JavaScript Array Methods: Cheatsheet
By: You Suck At Coding
Tags: Array Methods, Cheatsheet, Programming, JavaScript, Arrays

** from **

Creates an array from a string. Array.from('hello') Output: [‘h’, ‘e’, ‘l’, ‘l’, ‘o’]

-

** of **

Creates a new array with the given elements. Array.of('h', 'e', 'l', 'l', 'o') Output: [‘h’, ‘e’, ‘l’, ‘l’, ‘o’]

-

** isArray **

Verifies if the input is an array or not. Array.isArray(['h', 'e', 'l', 'l', 'o']) Output: true

-

** concat **

Joins the two arrays together. ['h', 'e', 'l'].concat(['l', 'o']) Output: [‘h’, ‘e’, ‘l’, ‘l’, ‘o’]

-

** filter **

Returns a new array with elements passing the test condition ['h', 'e', 'l', 'l', 'o'].filter(item => item === 'l') Output: [‘l’, ‘l’]

-

** find **

Returns the first element in the array that satisfies the test condition. ['h', 'e', 'l', 'l', 'o']

.find(item => item !== 'h' && item !== 'l' ) Output: ‘e’

-

** indexOf **

Returns the index of the first occurrence of the specified value starting from the start/given index. Returns -1 if not found. ['h', 'e', 'l', 'l', 'o'].indexOf('l', 3[optional]) Output: With index = 3. Without index = 2.

-

** findIndex **

Returns the index of the first element that satisfies the test condition. Returns -1 if none pass the test. ['h', 'e', 'l', 'l', 'o'].findIndex(item => item === 'g') Output: -1

-

** copyWithin **

Copies (shallow) a part of array to another part without changing the overall length. Example below: Copies to index 3 all elements from index 1 to end. ['h', 'e', 'l', 'l', 'o'].copyWithin(3, 1) Output: [‘h’, ‘e’, ‘l’, ‘e’, ‘l’]

-

** fill **

Fills the entire array with specified value ('w') ['h', 'e', 'l', 'l', 'o'].fill('w') Output: [‘w’, ‘w’, ‘w’, ‘w’, ‘w’]

-

** forEach **

Executes the provided function for each array element in place. ['h', 'e', 'l', 'l', 'o'].forEach(item => console.log(item)) Output:

h

e

l

l

o

-

** map **

Creates a new array by calling the provided function for each array element. ['h', 'e', 'l', 'l', 'o'].map(item => item.toUpperCase()) Output: [‘H’, ‘E’, ‘L’, ‘L’, ‘O’]

-

** every **

Checks if every element in the array passes the test condition. ['h', 'e', 'l', 'l', 'o'].every(item => item === 'h') Output: false

-

** some **

Checks if at least one element in the array passes the test condition. ['h', 'e', 'l', 'l', 'o'].some(item => item === 'h') Output: true

-

** pop **

Removes and returns the last element of the array. ['h', 'e', 'l', 'l', 'o'].pop() Output: ‘o’

-

** push **

Add new element(s) to the end of the array and returns the new length. ['h', 'e', 'l', 'l', 'o'].push(911) Output: 6

-

** shift **

Removes and returns the first element of the array. ['h', 'e', 'l', 'l', 'o'].shift() Output: ‘h’

-

** unshift **

Add new element(s) to the start of the array and returns the new length. ['h', 'e', 'l', 'l', 'o'].unshift(911) Output: 6

-

** toString **

Transforms the array to a string and returns the result string. ['h', 'e', 'l', 'l', 'o'].toString() Output: ‘h,e,l,l,o’

-

** join **

Returns a string by concatenating the array elements separated by a separator string. ['h', 'e', 'l', 'l', 'o'].join('-') Output: ‘h-e-l-l-o’

-

** includes **

Checks whether the array contains the specified element by iterating from the start/given index. ['h', 'e', 'l', 'l', 'o'].includes('o', 3[optional]) Output: true

-

** reverse **

Reverses the order of the elements in the given array (in place). ['h', 'e', 'l', 'l', 'o'].reverse() Output: [‘o’, ‘l’, ‘l’, ‘e’, ‘h’]

-

** splice **

Adds/removes/replaces elements in the array. 1. ['h', 'e', 'l', 'o'].splice(2, 0, 'l')

2. ['h', 'E', 'l', 'l', 'o'].splice(1, 1, 'e')

3. ['h', 'e', 'l', 'l', 'o'].splice(2, 1) Output 1 Array: [‘h’, ‘e’, ‘l’, ‘l’, ‘o’]

Output 2 Array: [‘h’, ‘e’, ‘l’, ‘l’, ‘o’]

Output 3 Array: [‘h’, ‘e’, ‘l’, ‘o’]

-

** slice **

Selects a part (start, end) of the array and returns it as a new array (end not included). ['h', 'e', 'l', 'l', 'o'].slice(2, 4[optional]) Output: With end = [‘l’, ‘l’]. Without end = [‘l’, ‘l’, ‘o’]

-