JavaScript Array Methods – The Complete Reference

const arr = [3, 1, 4, 1, 5];

// push / pop – end of array
arr.push(9, 2);       // [3,1,4,1,5,9,2] → returns new length: 7
arr.pop();            // [3,1,4,1,5,9]   → returns 9

// unshift / shift – beginning of array
arr.unshift(0);       // [0,3,1,4,1,5,9] → returns new length
arr.shift();          // [3,1,4,1,5,9]   → returns 0

// splice(start, deleteCount, ...items)
const removed = arr.splice(2, 2, 10, 20);
// removed = [4, 1], arr = [3, 1, 10, 20, 5, 9]

// sort – lexicographic by default! use comparator
[3, 1, 10, 2].sort();               // [1, 10, 2, 3] — wrong for numbers!
[3, 1, 10, 2].sort((a, b) => a-b);  // [1, 2, 3, 10] — ascending

// reverse – in place
[1, 2, 3].reverse(); // [3, 2, 1]

// fill(value, start?, end?)
new Array(5).fill(0);          // [0, 0, 0, 0, 0]
[1,2,3,4,5].fill(0, 1, 3);    // [1, 0, 0, 4, 5]

// copyWithin(target, start, end)
[1,2,3,4,5].copyWithin(0, 3); // [4, 5, 3, 4, 5] (copies positions 3-4 to start)

const fruits = ['apple', 'banana', 'cherry', 'banana'];

// slice(start, end) – new array, does not mutate
console.log(fruits.slice(1, 3)); // ['banana', 'cherry']
console.log(fruits.slice(-2));   // ['cherry', 'banana']

// concat – merge arrays into a new array
const more = fruits.concat(['date', 'elderberry']);
// ['apple','banana','cherry','banana','date','elderberry']

// join(separator) – array to string
console.log(fruits.join(', ')); // 'apple, banana, cherry, banana'
console.log([1,2,3].join('-'));  // '1-2-3'

// indexOf / lastIndexOf
console.log(fruits.indexOf('banana'));     // 1
console.log(fruits.lastIndexOf('banana')); // 3
console.log(fruits.indexOf('grape'));      // -1

// includes (uses SameValueZero — handles NaN correctly)
console.log(fruits.includes('cherry')); // true
console.log([NaN].includes(NaN));       // true ← unlike indexOf!

// at(index) – supports negative indices (ES2022)
console.log(fruits.at(0));   // 'apple'
console.log(fruits.at(-1));  // 'banana' (last)

// flat / flatMap
console.log([[1,2],[3,[4]]].flat());    // [1, 2, 3, [4]]
console.log([[1,2],[3,[4]]].flat(2));   // [1, 2, 3, 4]

const nums = [1, 2, 3, 4, 5, 6];

// forEach – side effects; returns undefined
nums.forEach((n, i) => console.log(i, n));

// map – transform; returns new array (same length)
const doubled = nums.map(n => n * 2);
// [2, 4, 6, 8, 10, 12]

// filter – keep matching elements; returns new array
const evens = nums.filter(n => n % 2 === 0);
// [2, 4, 6]

// reduce(callback, initialValue) – accumulate to single value
const sum = nums.reduce((acc, n) => acc + n, 0);    // 21
const product = nums.reduce((acc, n) => acc * n, 1); // 720

// reduceRight – same as reduce, but right to left
['a','b','c'].reduceRight((acc, s) => acc + s, ''); // 'cba'

// find – first match or undefined
const firstEven = nums.find(n => n % 2 === 0); // 2

// findIndex – index of first match or -1
const idx = nums.findIndex(n => n > 4); // 4

// findLast / findLastIndex (ES2023)
const lastEven = nums.findLast(n => n % 2 === 0);      // 6
const lastEvenIdx = nums.findLastIndex(n => n % 2 === 0); // 5

// some – returns true if ANY element passes test
console.log(nums.some(n => n > 5));  // true
console.log(nums.some(n => n > 10)); // false

// every – returns true if ALL elements pass test
console.log(nums.every(n => n > 0));  // true
console.log(nums.every(n => n > 3));  // false

// flatMap – map + flat(1) in one pass
const sentences = ['hello world', 'foo bar'];
const words = sentences.flatMap(s => s.split(' '));
// ['hello', 'world', 'foo', 'bar']

// Array.isArray – reliable type check
Array.isArray([]);           // true
Array.isArray('string');     // false
Array.isArray({ length: 2 }); // false

// Array.from – create from iterable or array-like
Array.from('abc');                       // ['a', 'b', 'c']
Array.from({ length: 3 }, (_, i) => i); // [0, 1, 2]
Array.from(new Set([1, 2, 2, 3]));       // [1, 2, 3]

// Array.of – create from arguments (unlike new Array)
Array.of(7);       // [7]    (NOT [empty × 7])
Array.of(1, 2, 3); // [1, 2, 3]

const orders = [
  { id: 1, product: 'Laptop',  price: 999,  qty: 1, status: 'shipped' },
  { id: 2, product: 'Mouse',   price: 29,   qty: 3, status: 'pending' },
  { id: 3, product: 'Monitor', price: 399,  qty: 2, status: 'shipped' },
  { id: 4, product: 'Keyboard',price: 79,   qty: 2, status: 'pending' },
  { id: 5, product: 'Webcam',  price: 149,  qty: 1, status: 'shipped' }
];

// Find total revenue from shipped orders, sorted by value
const report = orders
  .filter(o => o.status === 'shipped')          // keep shipped
  .map(o => ({ ...o, total: o.price * o.qty })) // add total field
  .sort((a, b) => b.total - a.total)            // sort descending
  .map(o => `${o.product}: $${o.total}`);        // format

console.log(report);
// ['Laptop: $999', 'Monitor: $798', 'Webcam: $149']

// Total revenue
const totalRevenue = orders
  .filter(o => o.status === 'shipped')
  .reduce((sum, o) => sum + o.price * o.qty, 0);
console.log(totalRevenue); // 1946