Table of Contents
Mutating Array Methods (Change the Original Array)
These methods modify the original array directly:
1. push()
Adds one or more elements to the end of an array.
let arr = [1, 2, 3];
arr.push(4); // arr is now [1, 2, 3, 4]
2. pop()
Removes the last element from an array.
let arr = [1, 2, 3];
arr.pop(); // arr is now [1, 2]
3. shift()
Removes the first element from an array.
let arr = [1, 2, 3];
arr.shift(); // arr is now [2, 3]
4. unshift()
Adds one or more elements to the beginning of an array.
let arr = [1, 2, 3];
arr.unshift(0); // arr is now [0, 1, 2, 3]
5. splice()
Changes the array by removing/replacing existing elements and/or adding new elements.
let arr = [10, 5, 6, 4];
arr.splice(1, 2, 20, 30); // Removes 5,6 and adds 20,30
// arr is now [10, 20, 30, 4]
6. fill()
Fills elements with a static value.
let arr = [25, 30, 35, 40, 45, 50];
arr.fill(0, 2, 5); // Fills from index 2 to 5 with 0
// arr is now [25, 30, 0, 0, 0, 50]
7. sort()
Sorts elements in place.
let arr = [30, 10, 1, 20];
arr.sort(); // arr is now [1, 10, 20, 30]
8. reverse()
Reverses elements in place.
let arr = [1, 2, 3, 4];
arr.reverse(); // arr is now [4, 3, 2, 1]
9. copyWithin()
Copies part of array to another location.
let arr = [1, 2, 3, 4, 5];
arr.copyWithin(0, 2); // arr is now [3, 4, 5, 4, 5]
Non-Mutating Array Methods (Do Not Change the Original Array)
These methods return new arrays/values without modifying the original:
1. slice()
Returns a portion of array.
let arr = [1, 2, 3, 4, 5];
let sliced = arr.slice(1, 4); // [2, 3, 4]
2. concat()
Combines arrays.
let arr1 = ["a", "b"];
let arr2 = ["c", "d"];
let combined = arr1.concat(arr2); // ["a", "b", "c", "d"]
3. indexOf()
Returns first index of element.
let arr = [1, 2, 3, 4];
let index = arr.indexOf(3); // 2
4. lastIndexOf()
Returns last index of element.
let arr = ["a", "b", "a"];
let lastIndex = arr.lastIndexOf("a"); // 2
5. includes()
Checks if value exists.
let arr = [1, 2, 3];
let hasTwo = arr.includes(2); // true
6. find()
Returns first matching element.
let nums = [10, 25, 30];
let found = nums.find(n => n > 20); // 25
7. findIndex()
Returns index of first matching element.
let nums = [10, 25, 30];
let index = nums.findIndex(n => n > 20); // 1
8. filter()
Returns new array with matching elements.
let nums = [10, 25, 30];
let filtered = nums.filter(n => n > 20); // [25, 30]
9. map()
Transforms each element.
let nums = [1, 2, 3];
let doubled = nums.map(n => n * 2); // [2, 4, 6]
10. reduce()
Reduces to single value.
let nums = [1, 2, 3];
let sum = nums.reduce((t, n) => t + n, 0); // 6
11. reduceRight()
Reduces from right to left.
let nums = [1, 2, 3];
let sum = nums.reduceRight((t, n) => t + n, 0); // 6
12. some()
Tests if any element passes test.
let nums = [1, 2, 3];
let hasEven = nums.some(n => n % 2 === 0); // true
13. every()
Tests if all elements pass test.
let nums = [2, 4, 6];
let allEven = nums.every(n => n % 2 === 0); // true
14. forEach()
Executes function for each element.
let nums = [1, 2, 3];
nums.forEach(n => console.log(n)); // Logs 1, 2, 3
15. toSorted()
Returns new sorted array.
let nums = [3, 1, 2];
let sorted = nums.toSorted(); // [1, 2, 3]
16. toSpliced()
Returns new spliced array.
let nums = [1, 2, 3];
let spliced = nums.toSpliced(1, 1); // [1, 3]
17. at()
Returns element at index.
let nums = [10, 20, 30];
let num = nums.at(1); // 20
18. findLast()
Returns last matching element.
let nums = [10, 25, 30, 25];
let last = nums.findLast(n => n === 25); // 25
19. findLastIndex()
Returns index of last match.
let nums = [10, 25, 30, 25];
let lastIndex = nums.findLastIndex(n => n === 25); // 3
20. join()
Joins elements into string.
let arr = ["Hello", "World"];
let str = arr.join(" "); // "Hello World"
21. flat()
Flattens nested arrays.
let arr = [1, [2, [3]]];
let flat = arr.flat(2); // [1, 2, 3]
22. flatMap()
Maps then flattens.
let arr = [1, 2, 3];
let mapped = arr.flatMap(x => [x, x*2]); // [1, 2, 2, 4, 3, 6]
23. toReversed()
Returns new reversed array.
let arr = [1, 2, 3];
let reversed = arr.toReversed(); // [3, 2, 1]
Author: Mohin Sheikh
Follow me on GitHub for more insights!
Top comments (0)