JavaScript Array Methods

What are array methods in JavaScript?

Array methods in JavaScript are built-in functions that allow you to manipulate and perform operations on arrays. They help with tasks such as adding, removing, transforming, and iterating over array elements.

What is the push() method?

The push() method adds one or more elements to the end of an array and returns the new length of the array.

const fruits = ['apple', 'banana'];
const newLength = fruits.push('orange'); // Adds 'orange'
console.log(fruits); // ['apple', 'banana', 'orange']
console.log(newLength); // 3

What is the pop() method?

The pop() method removes the last element from an array and returns that element. If the array is empty, it returns undefined.

const fruits = ['apple', 'banana', 'orange'];
const lastFruit = fruits.pop(); // Removes 'orange'
console.log(fruits); // ['apple', 'banana']
console.log(lastFruit); // 'orange'

What is the shift() method?

The shift() method removes the first element from an array and returns that element. This method changes the length of the array.

const fruits = ['apple', 'banana', 'orange'];
const firstFruit = fruits.shift(); // Removes 'apple'
console.log(fruits); // ['banana', 'orange']
console.log(firstFruit); // 'apple'

What is the unshift() method?

The unshift() method adds one or more elements to the beginning of an array and returns the new length of the array.

const fruits = ['banana', 'orange'];
const newLength = fruits.unshift('apple'); // Adds 'apple'
console.log(fruits); // ['apple', 'banana', 'orange']
console.log(newLength); // 3

What is the splice() method?

The splice() method changes the contents of an array by removing or replacing existing elements and/or adding new elements in place. It returns an array containing the removed elements.

// Remove 1 element at index 1
const fruits = ['apple', 'banana', 'orange'];
const removed = fruits.splice(1, 1); // Removes 'banana'
console.log(fruits); // ['apple', 'orange']
console.log(removed); // ['banana']

What is the slice() method?

The slice() method returns a shallow copy of a portion of an array into a new array, selected from start to end (not including end). The original array is not modified.

const fruits = ['apple', 'banana', 'orange', 'kiwi'];
const citrus = fruits.slice(1, 3); // ['banana', 'orange']
console.log(citrus);
console.log(fruits); // ['apple', 'banana', 'orange', 'kiwi'] (original array unchanged)

What is the map() method?

The map() method creates a new array populated with the results of calling a provided function on every element in the calling array.

const numbers = [1, 2, 3, 4];
const squares = numbers.map(num => num * num);
console.log(squares); // [1, 4, 9, 16]

What is the filter() method?

The filter() method creates a new array with all elements that pass the test implemented by the provided function.

const numbers = [1, 2, 3, 4, 5];
const evens = numbers.filter(num => num % 2 === 0);
console.log(evens); // [2, 4]

What is the reduce() method?

The reduce() method executes a reducer function (that you provide) on each element of the array, resulting in a single output value. It can be used for operations like summing values or flattening arrays.

const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0);
console.log(sum); // 10

What is the find() method?

The find() method returns the value of the first element in the array that satisfies the provided testing function. Otherwise, it returns undefined.

const numbers = [1, 2, 3, 4, 5];
const found = numbers.find(num => num > 3);
console.log(found); // 4

What is the includes() method?

The includes() method determines whether an array includes a certain value among its entries, returning true or false.

const fruits = ['apple', 'banana', 'orange'];
console.log(fruits.includes('banana')); // true
console.log(fruits.includes('grape')); // false

What is the sort() method?

The sort() method sorts the elements of an array in place and returns the sorted array. The default sort order is based on converting the elements to strings and comparing their sequences of UTF-16 code unit values.

const numbers = [4, 2, 5, 1, 3];
numbers.sort(); // Sorts as strings: [1, 2, 3, 4, 5]
console.log(numbers);

numbers.sort((a, b) => a - b); // Sorts as numbers: [1, 2, 3, 4, 5]
console.log(numbers);

What is the reverse() method?

The reverse() method reverses the elements of an array in place. The first array element becomes the last, and the last array element becomes the first.

const numbers = [1, 2, 3, 4, 5];
numbers.reverse(); // [5, 4, 3, 2, 1]
console.log(numbers);

What is the concat() method?

The concat() method is used to merge two or more arrays. It does not change the existing arrays but instead returns a new array.

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

What is the join() method?

The join() method joins all elements of an array into a string, with an optional separator specified.

const fruits = ['apple', 'banana', 'orange'];
const fruitString = fruits.join(', ');
console.log(fruitString); // apple, banana, orange