Array methods in JS

Here’s a breakdown of the most commonly used JavaScript array methods along with examples for each grouped by functionality.

Photo by Boitumelo on Unsplash

1. Adding / Removing Elements

push() — Add to the end

let arr = [1, 2];
arr.push(3); 
console.log(arr); // [1, 2, 3]

pop() — Remove from the end

let arr = [1, 2, 3];
arr.pop();
console.log(arr); // [1, 2]

unshift() — Add to the start

let arr = [2, 3];
arr.unshift(1);
console.log(arr); // [1, 2, 3]

shift() — Remove from the start

let arr = [1, 2, 3];
arr.shift();
console.log(arr); // [2, 3]

splice() — Add/Remove at specific index

let arr = [1, 2, 3, 4];
arr.splice(1, 2, "a", "b"); // remove 2 from index 1, add "a","b"
console.log(arr); // [1, "a", "b", 4]

2. Searching

indexOf() — First index of element

let arr = ["a", "b", "c", "b"];
console.log(arr.indexOf("b")); // 1

lastIndexOf() — Last index of element

console.log(arr.lastIndexOf("b")); // 3

includes() — Check if element exists

console.log(arr.includes("c")); // true
console.log(arr.includes("x")); // false

find() — First element matching condition

let arr = [10, 20, 30];
let found = arr.find(num => num > 15);
console.log(found); // 20

findIndex() — Index of first match

console.log(arr.findIndex(num => num > 15)); // 1

3. Iteration

forEach()

let arr = [1, 2, 3];
arr.forEach(num => console.log(num * 2));
// 2, 4, 6

map() — Create new array

let doubled = arr.map(num => num * 2);
console.log(doubled); // [2, 4, 6]

filter() — Filter elements

let evens = arr.filter(num => num % 2 === 0);
console.log(evens); // [2]

reduce() — Reduce to a single value

let sum = arr.reduce((acc, num) => acc + num, 0);
console.log(sum); // 6

reduceRight()

let str = ["a", "b", "c"].reduceRight((acc, ch) => acc + ch, "");
console.log(str); // "cba"

4. Transforming / Combining

concat()

let arr1 = [1, 2], arr2 = [3, 4];
console.log(arr1.concat(arr2)); // [1, 2, 3, 4]

slice() — Extract portion

let arr = [1, 2, 3, 4];
console.log(arr.slice(1, 3)); // [2, 3]

flat() — Flatten nested arrays

let arr = [1, [2, 3], [4, [5]]];
console.log(arr.flat(2)); // [1, 2, 3, 4, 5]

flatMap()

let arr = [1, 2, 3];
console.log(arr.flatMap(x => [x, x * 2])); // [1, 2, 2, 4, 3, 6]

5. Sorting

sort()

let arr = [3, 1, 4, 2];
arr.sort((a, b) => a - b);
console.log(arr); // [1, 2, 3, 4]

reverse()

let arr = [1, 2, 3];
arr.reverse();
console.log(arr); // [3, 2, 1]

6. String Conversion

join()

let arr = ["Hello", "World"];
console.log(arr.join(" ")); // "Hello World"

toString()

let arr = [1, 2, 3];
console.log(arr.toString()); // "1,2,3"

7. New ES6+ Methods

keys(), values(), entries()

let arr = ["a", "b", "c"];

console.log([...arr.keys()]);    // [0, 1, 2]
console.log([...arr.values()]);  // ["a", "b", "c"]
console.log([...arr.entries()]); // [[0,"a"], [1,"b"], [2,"c"]]

fill()

let arr = new Array(5).fill(0);
console.log(arr); // [0, 0, 0, 0, 0]

copyWithin()

let arr = [1, 2, 3, 4, 5];
arr.copyWithin(0, 3); // copy from index 3 to start
console.log(arr); // [4, 5, 3, 4, 5]

That’s it for JS Array methods. Happy Coding :)

Get Neha Goel’s stories in your inbox

Join Medium for free to get updates from this writer.

Remember me for faster sign in

#javascript #coding #learning #interview #softwareengineer