Discovering the common multiples of two numbers within an array by utilizing the .forEach() method in JavaScript

Question

Discovering the common multiples of two numbers within an array by utilizing the .forEach() method in JavaScript

I have been tasked with looping through an array using the .forEach method in order to return all the values. If any of the numbers are a multiple of 3 or 5, or both 3 and 5, that number must be returned as a string. Here is my current code:

let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 
14, 15];
let count = [];
arr.forEach((item) => {
count[item] = item;
if (count[item] % 3 === 0) {
count[item] = "Fizz";
} else if (count[item] % 5 === 0) {
count[item] = "Buzz";
} else if (count[item] % 3 === 0 || count[item] % 5 === 0) {
count[item] = "FizzBuzz";}
return count;});
console.log(count);

The challenge I am facing is that I am struggling to get it to return the final string "FizzBuzz" and also prevent the initialization of the count variable from displaying in the console.

As a beginner in JS, I would appreciate an explanation of the solution wherever possible.

Attached below are images of the outputs:

result

Expected output

Edit:

I should mention that this exercise is part of an assignment, so I must use the forEach method. This sets it apart from another question where a for loop was utilized instead.

javascript arrays foreach

Answer 1

Answer №1

I streamlined the if statement by using guard clauses
An effective approach is to utilize Array.forEach() with the index parameter for better organization

let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 
  14, 15];

arr.forEach(function(element, index) {
  if (element % 5 === 0 && element % 3 === 0) return arr[index] = "Fizz-Buzz"
  if (element % 5 === 0) return arr[index] = "Buzz"
  if (element % 3 === 0) return arr[index] = "Fizz"
})

console.log(arr)

It's important to note that JavaScript arrays start indexing at 0 ... therefore, count[item] = [item] can leave an undefined spot at count[0]. It's recommended to make use of the index argument in your forEach function from the beginning

Below is the code presented without guard clauses:

arr.forEach(function (element, index) {
  if (element % 5 === 0 && element % 3 === 0) {
    arr[index] = "Fizz-Buzz"
  } else if (element % 5 === 0) {
    arr[index] = "Buzz"
  } else if (element % 3 === 0) {
    arr[index] = "Fizz"
  }
})

Answer 2

I streamlined the if statement by using guard clauses
An effective approach is to utilize Array.forEach() with the index parameter for better organization

let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 
  14, 15];

arr.forEach(function(element, index) {
  if (element % 5 === 0 && element % 3 === 0) return arr[index] = "Fizz-Buzz"
  if (element % 5 === 0) return arr[index] = "Buzz"
  if (element % 3 === 0) return arr[index] = "Fizz"
})

console.log(arr)

It's important to note that JavaScript arrays start indexing at 0 ... therefore, count[item] = [item] can leave an undefined spot at count[0]. It's recommended to make use of the index argument in your forEach function from the beginning

Below is the code presented without guard clauses:

arr.forEach(function (element, index) {
  if (element % 5 === 0 && element % 3 === 0) {
    arr[index] = "Fizz-Buzz"
  } else if (element % 5 === 0) {
    arr[index] = "Buzz"
  } else if (element % 3 === 0) {
    arr[index] = "Fizz"
  }
})

Answer 3

Answer №2

To effectively handle the "FizBuzz" scenario before processing "Fizz" and "Buzz" individually, it is recommended to utilize .map instead of .forEach. The advantage of using .map in this situation is that it returns each element directly, eliminating the need to create a new empty array.

const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]

const res = arr.map(el => {
    if(el % 3 === 0 && el % 5 === 0)
        return "FizBuzz"
    else if (el % 3 === 0)
        return "Fizz"
    else if (el % 5 === 0)
        return "Buzz"
    else return el
})

console.log(res)

Answer 4

To effectively handle the "FizBuzz" scenario before processing "Fizz" and "Buzz" individually, it is recommended to utilize .map instead of .forEach. The advantage of using .map in this situation is that it returns each element directly, eliminating the need to create a new empty array.

const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]

const res = arr.map(el => {
    if(el % 3 === 0 && el % 5 === 0)
        return "FizBuzz"
    else if (el % 3 === 0)
        return "Fizz"
    else if (el % 5 === 0)
        return "Buzz"
    else return el
})

console.log(res)

Discovering the common multiples of two numbers within an array by utilizing the .forEach() method in JavaScript

Answer №1

Answer №2

Similar questions

Dealing with errors such as "Failed to load chunk" can be resolved by implementing lazy-loading and code-splitting techniques

Exploring the use of the new keyword to create pointer arrays in C++

Error when sending Angular 4 GET request with multiple Headers results in a 400 bad request code

Pattern matching for directory path excluding the filename

Struggling to integrate Ajax with Angular framework

Switching ng-Idle countdown time from seconds to minutes is possible by adjusting the configuration settings

Tips for creating a responsive carousel slider for images

AngularJS: iterating through POST requests and passing each index into its corresponding response

AngularJS allows for the passing of a function value into another function

Can I access properties from the index.html file within the Vue.js mount element?

How to retrieve the image source from a block using jQuery

Check if the page has been loaded using Jquery

JavaScript function that shows the name of an individual extracted from a specific file

Parsing an XML array using XSLT and implementing a universal template for nested elements to convert from XML to JSON

Issue with AngularJS ng-model not updating the value of a hidden input

Searching for 10 random data records within a collection of 100 in MongoDB

nyroModal automatically adapts its dimensions according to the size of the webpage, not the size of

Retrieving data response post upload with JQuery and an HTML5 Uploader

Iterate through an ajax function by employing promises

Ways to store a JSON string in a variable