JavaScript Basics

JavaScript Advanced

JavaScript Arrays

JavaScript Functions

JavaScript Objects

JavaScript DOM

JavaScript String

JavaScript Array Exercises, Practice and Solution

On this page, you will find practice questions along with the solution related to the JavaScript array iteration methods such as map(), reduce(), filter(), etc. These exercises will improve your understanding related to the array.

Before you solve these exercise questions, it is assumed that you know JavaScript iteration methods such as map(), reduce(), and others. In case you are not familiar with these methods, then visit the following links:

Q1 Define a function called cleanNames that accepts an array of strings containing additional space characters at the beginning and end. The cleanNames() function should use the array map method to return a new array full of trimmed names. For example:

cleanNames([" avengers", "   captain_america", "ironman   ", " black panther   "]) 
should give
["avengers", "captain_america", "ironman", "black panther"]

Solution

function cleanNames(arr){
  return arr.map(name => name.trim())
}

Q2 Write a function that converts an array of values from miles to kilometres using the map method. In the end, add the kilometres up in a new variable called "totalDistanceInKilometers" and return this variable.

Solution

function convertMilesToKilometers(arr){
  return arr.map(mile => mile*1.609);
}

function totalDistance(acc, cur){
  return acc + cur;
}

const km = convertMilesToKilometers([1,2,3,4,5,6]);
console.log(km);
let totalDistanceInKilometers = km.reduce(totalDistance, 0);
console.log(totalDistanceInKilometers);

Q3 Square and sum the array elements using the arrow function and then find the average of the array.

Solution

let nums = [25, 45, 55, 77, 88, 99];

const square = nums.map(num => num*num);
console.log(square);
let average = square.reduce((acc, cur) => acc + cur, 0)/nums.length;
console.log(average);

Q4 Create a new array using the map function whose each element is equal to the original element plus 4.

Solution

let numbers = [4, -4, 10, 203, 53, 11];
console.log(numbers.map(number => number + 4));

Q5 From the array of numbers, choose even double even numbers and compute the sum using Array's filter, map and reduce methods.

Solution

let numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
numbers.filter(number => number%2 === 0)
.map(even => even*even)
.reduce((acc, cur) => acc + cur, 0);

Q6 Create a new array whose elements is in uppercase of words present in the original array.

Solution

let strings = ["avengers", "captain america", "ironman", "black panther"];
console.log(strings.map(string => string.toUpperCase()));

Q7 Use the .map() method on the heros array to return a new array.

  • The new array should rename the 'name' key to 'hero'.
  • The 'name' key should not appear in the new array.
  • The new array should have a new key added called (id).
  • The key 'id' should be based on the index.
const heros = [
  { name: 'Spider-Man' },
  { name: 'Thor' },
  { name: 'Black Panther' },
  { name: 'Captain Marvel' },
  { name: 'Silver Surfer' }
];
EXPECTED OUTPUT (array of objects): 
[
  { id: 0, hero: 'Spider-Man' }, 
  { id: 1, hero: 'Thor' }, 
  { id: 2, hero: 'Black Panther' }, 
  { id: 3, hero: 'Captain Marvel' }, 
  { id: 4, hero: 'Silver Surfer' }
]

Solution

const heros = [
  { name: 'Spider-Man' },
  { name: 'Thor' },
  { name: 'Black Panther' },
  { name: 'Captain Marvel' },
  { name: 'Silver Surfer' }
];

const arr = heros.map((hero, index) =>{
  return {id:index, hero:hero.name}
});

console.dir(arr);

Q8 Consider the following array:

const inputWords = ["spray", "limit", "elite", "exuberant", "destruction", "present"];

Write JavaScript statements that will produce the following output:

["exuberant", destruction", "present"]

Solution

const longWords = inputWords.filter(word=>word.length>6)
console.log(longWords);

Q9 Starting with an array containing the numbers 1 through 10, use filter, map, and reduce to produce the following. Use console.log to display the results.

  • An array of odd numbers.
  • An array of numbers divisible by 2 or 5.
  • An array of numbers divisible by 3 and then squared those numbers.
  • The sum of the following: square the numbers divisible by 5.

Solution

let numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
//An array of odd numbers.
const oddNumbers = numbers.filter(number => number%3 === 0);
console.log(oddNumbers);
//An array of numbers divisible by 2 or 5.
const divisibleBy2or5 = numbers.filter(number => number%2 === 0 || number%5 === 0);
console.log(divisibleBy2or5);
//An array of numbers divisible by 3 and then squared those numbers.
const squared = oddNumbers.map(odd => odd*odd);
console.log(squared);
//The sum of the following: square the numbers divisible by 5.
const divisibleBy5AndSquared = numbers.filter(number => number%5 === 0)
.map(number => number*number);
console.log(divisibleBy5AndSquared);

Q10 Consider the following array:

let nums = [11, 22, 33, 46, 75, 86, 97, 98];

Use filter then map functions to filter even numbers then square them. Assign the result to a variable named squaredEvenNums and display it. The output should be:

squaredEvenNums: [484, 2116, 7396, 9604]

Use the reduce function to calculate the sum of nums array. The output should be:

Sum of array elements: 468

Solution

let nums = [11, 22, 33, 46, 75, 86, 97, 98];
let squaredEvenNums = nums.filter(num => num%2===0 )
                          .map(num=>num*num);
console.log(squaredEvenNums);

let sum = nums.reduce((acc, cur) => acc+cur, 0);
console.log(sum);

Q11 Write a function Myfunc that takes in an array of numbers and multiply each of the elements by 2.

Sample Input
Myfunc([1, 2 ,3]);
Sample Output
[2, 4, 6]

Solution

function Myfunc(numbers){
  return numbers.map(number => number*2);
}
Myfunc([1, 2, 3]);

Recommended Posts