Iterators

Question 1

const fruits = [‘mango’, ‘papaya’, ‘pineapple’, ‘apple’];

// Iterate over fruits below saying “i want to eat …”

Answer 1

fruits.forEach(fruit => console.log(I want to eat a ${fruit}))

Question 2

The .forEach() Method
The first iteration method that we’re going to learn is .forEach(). Aptly named, .forEach() will execute the same code for each element of an array.

Answer 2

groceries.forEach(groceryItem => console.log(groceryItem));

function printGrocery(element){
  console.log(element);
}

groceries.forEach(printGrocery);

Question 3

The .map() Method
The second iterator we’re going to cover is .map(). When .map() is called on an array, it takes an argument of a callback function and returns a new array! Take a look at an example of calling .map():

Answer 3

const numbers = [1, 2, 3, 4, 5];

const bigNumbers = numbers.map(number => {
  return number * 10;
});

Question 4

Use .map() to create a new array that contains the first character of each string in the animals array. Save the new array to a const variable named secretMessage.

Answer 4

const secretMessage = animals.map(animal => {
  return animal[0]
})

Question 5

Use .map() to divide all the numbers in bigNumbers by 100. Save the returned values to a variable declared with const called smallNumbers.

Answer 5

const smallNumbers = bigNumbers.map(sn => {
  return sn/100
})

Question 6

The .filter() Method
Another useful iterator method is .filter(). Like .map(), .filter() returns a new array. However, .filter() returns an array of elements after filtering out certain elements from the original array. The callback function for the .filter() method should return true or false depending on the element that is passed to it. The elements that cause the callback function to return true are added to the new array. Take a look at the following example:

Answer 6

const words = [‘chair’, ‘music’, ‘pillow’, ‘brick’, ‘pen’, ‘door’];

const shortWords = words.filter(word => {
  return word.length < 6;
});

Question 7

Call the .filter() method on randomNumbers to return values that are less than 250. Save them to a new array called smallNumbers, declared with const.

Answer 7

const smallNumbers = randomNumbers.filter(num => {
  return num < 250
})

Question 8

Now let’s work with an array of strings. Invoke .filter() on the favoriteWords array to return elements that have more than 7 characters. Save the returned array to a const variable named longFavoriteWords.

Answer 8

const longFavoriteWords = favoriteWords.filter(word => {
  return word.length > 7
})

Question 9

The .findIndex() Method
We sometimes want to find the location of an element in an array. That’s where the .findIndex() method comes in! Calling .findIndex() on an array will return the index of the first element that evaluates to true in the callback function.

Answer 9

const jumbledNums = [123, 25, 78, 5, 9];

const lessThanTen = jumbledNums.findIndex(num => {
  return num < 10;
});

Question 10

Invoke .findIndex() on the animals array to find the index of the element that has the value ‘elephant’ and save the returned value to a const variable named foundAnimal.

Answer 10

const foundAnimal = animals.findIndex(word => {
  return word === 'elephant'
})

Question 11

.
Let’s see if we can find the index of the first animal that starts with the letter ‘s’.

Call .findIndex() on the animals array return the index of the first element that starts with ‘s’. Assign the returned value to a const variable named startsWithS.

Answer 11

const startsWithS = animals.findIndex(word => {
  return word[0] === 's'
})

Question 12

The .reduce() Method
Another widely used iteration method is .reduce(). The .reduce() method returns a single value after iterating through the elements of an array, thereby reducing the array. Take a look at the example below:

Answer 12

const numbers = [1, 2, 4, 10];

const summedNums = numbers.reduce((accumulator, currentValue) => {
  return accumulator + currentValue
})

console.log(summedNums) // Output: 17

Question 13

const newNumbers = [1, 3, 5, 7];

const newSum = newNumbers.reduce((accumulator, currentValue) => {
console.log(‘The value of accumulator: ‘, accumulator);
console.log(‘The value of currentValue: ‘, currentValue);
return currentValue + accumulator
})

Answer 13

The value of accumulator:  1
The value of currentValue:  3
The value of accumulator:  4
The value of currentValue:  5
The value of accumulator:  9
The value of currentValue:  7