Javascript array methods made simple

The arrays in javascript (or programming in general) is a way to store data in a form of collection of items (maybe of same/diff type) under single variable name. But in javascript, we have a bunch of methods that comes very handy while working with arrays. So let's explore these together today!

1. at()

The at() method is used retrieve an item from the array present at the given index. This method takes a number as a parameter and returns the value present at that index in the array on which the method is being called.

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

const itemAtIndexTwo = array.at(2);

console.log("item at index 2: ", itemAtIndexTwo);
// output -> item at index 2: 3

2. concat()

The concat() method is used merge/combine two or more array into the single array. This method returns a new array that contains all the elements of the arrays that are being merged.

const array1 = [1, 2, 3, 4, 5];
const array2 = [6, 7, 8, 9, 0];

const array3 = array1.concat(array2);

console.log("new array: ", array3);
// output -> new array: [1, 2, 3, 4, 5, 6, 7, 8, 9, 0]

3. every()

The every() method checks if all items of an array satisfies the given condition. This method takes a callback function as a parameter and That function should return a truthy value to indicate that the item has passed the condition. When all items satisfies the condition then every function returns true otherwise returns false.

const array = [2, 4, 6, 8];

function isNumberEven(number) {
  return number % 2 === 0;
}
const isArrayEven = array.every((number) => isNumberEven(number));

console.log(isArrayEven);
// output -> true

4. filter()

The filter() method checks if all items of an array satisfies the given condition and returns the new array of containing those elements. This method takes a callback function as a parameter and that function returns true if that the element satisfies the condition. The newly created array is a shallow copy of the original array.

const array = [2, 3, 6, 9];

function isNumberEven(number) {
  return number % 2 === 0;
}
const evenNumbers = array.filter((number) => isNumberEven(number));

console.log(evenNumbers);
// output -> [2, 6]

5. find()

The find() method checks if element of an array satisfies the given condition and returns that element. This method takes a callback function as a parameter and that function returns true if that the element satisfies the condition else it returns undefined.

const array = [1, 3, 4, 9];

function isNumberEven(number) {
  return number % 2 === 0;
}
const firstEvenNumber = array.find((number) => isNumberEven(number));

console.log(firstEvenNumber);
// output -> 4

6. findIndex()

The findIndex() method checks if element of an array satisfies the given condition and returns that index of that element. This method takes a callback function as a parameter and that function returns the index of the element if that the element satisfies the condition else it returns -1.

const array = [1, 3, 4, 9];

function isNumberEven(number) {
  return number % 2 === 0;
}
const indexOfFirstEvenNumber = array.filter((number) => isNumberEven(number));

console.log(indexOfFirstEvenNumber);
// output -> 2

7. forEach()

The forEach() method runs a given callback function for each element of an array. This function does not return anything.

const array = [1, 2, 3, 4];

function square(number) {
  return number * number;
}
const squareArray = array.filter((number) => square(number));

console.log(squareArray);
// output -> [1, 4, 9, 16]