JavaScript ES6 – Most used array methods with examples

How to use JavaScript array methods, and what are the most common array methods for JavaScript?

Let’s look at all array methods one-by-one with usage and an examples.

array forEach() method

Array forEach() method is used to loop thru an array and do something with each value within each iteration.

Want to learn more about foreEach() method? check array forEach() method.

let arr = ['apple', 'orange', 'cherry'];

arr.forEach(function(value, index) {
  console.log(index, value);
});

// OUTPUT
// 0 apple
// 1 orange
// 2 cherry

array map() method

Think of JavaScript array map() method as: “I want a new array containing new copies, or changes, of each array element”.

Want to learn more about map() method? check array map() method.

let arr = [3, 5, 6, 8, 23, 11];

let newArr = arr.map((value) => {
  return value * 2
});

console.log('arr', arr)
console.log('newArr', newArr)

// OUTPUT
// arr [3, 5, 6, 8, 23, 11]
// newArr [6, 10, 12, 16, 46, 22]

array filter() method

Think of JavaScript array filter() method as: “I want a new array containing just the items I need”.

Want to learn more about filter() method? check array filter() method.

let arr = [3, 5, 6, 8, 23, 11];

let evenNumbers = arr.filter((value) => {
  if (value % 2 == 0) {
    return value;
  }
});

console.log('arr', arr)
console.log('evenNumbers', evenNumbers)

// OUTPUT
// arr [3, 5, 6, 8, 23, 11]
// evenNumbers [6, 8]

array reduce() method

Think of JavaScript array reduce() method as: “I want to reduce my array to just a single value”.

Want to learn more about reduce() method? check array reduce() method.

let arr = [2, 9, 6, 8, 23];
let sum = arr.reduce((prev, next) => {
  return prev + next;
});
console.log(sum);

// OUTPUT
// 48

array some() method

Think of JavaScript array some() method as: “I want to check if any value in my array meets my condition. yes/no answer!”

Want to learn more about some() method? check array some() method.

let arr = [2, 9, 6, 8, 23];
const result = arr.some((value) => value % 2 === 0);
console.log(result);

// OUTPUT
// true

array every() method

Think of JavaScript array every() method as: “I want to check if every value in my array meets my condition. yes/no answer!”

Want to learn more about every() method? check array every() method.

let arr = [2, 28, 6];
const result = arr.every((value) => value % 2 === 0);
console.log(result);

// OUTPUT
// true

array find() method

Think of JavaScript array find() method as: “I want to find a particular element in my array.”

Want to learn more about find() method? check array find() method.

let arr = [9, 4, 24, 6];
const result = arr.find((value) => value % 2 === 0);
console.log(result);

// OUTPUT
// 4

array findIndex() method

Think of JavaScript array findIndex() method as: “I want to find the index number of an element within the object array.”

Want to learn more about findIndex() method? check array findIndex() method.

const products = [
  { type: "apple", quantity: 9 },
  { type: "banana", quantity: 2 },
  { type: "orange", quantity: 8 }
];

const appleIndex = products.findIndex((product) => product.type === 'banana');
console.log(appleIndex);

// OUTPUT
// 1

array indexOf() method

Think of JavaScript array indexOf() method as: “I want to find the index number of an element within the array.”

Want to learn more about indexOf() method? check array indexOf() method.

let arr = [19, 12, 32, 12, 25];
const index = arr.indexOf(12);
console.log(index);

// OUTPUT:
// 1

array sort() method

Think of JavaScript array sort() method as: “I want to sort an array in ascending or descending order.”

Want to learn more about sort() method? check array sort() method.

const arr = [23, 12, 15, 20];
const sorted = arr.sort();
console.log(sorted);

// OUTPUT
// 0: 12
// 1: 15
// 2: 20
// 3: 23

array concat() method

Think of JavaScript array concat() method as: “I want to combine 2 or more arrays into one array.”

Want to learn more about concat() method? check array concat() method.

const letters = ['a', 'b', 'c'];
const numbers = [1, 2, 3];

const alphaNumeric = letters.concat(numbers);
console.log(alphaNumeric);

// OUTPUT
// [a', 'b', 'c', 1, 2, 3]

array includes() method

Think of JavaScript array includes() method as: “I want to know if the array contains a value? yes/no answer!”

Want to learn more about includes() method? check array includes() method.

const arr = [22, 8, 34];
const result = arr.includes(8);

console.log(result);

// OUTPUT
// true
%d bloggers like this: