Short JavaScript Array methods cheatsheet, that helps you to learn, remind, or prepare to JS interview.
- length
- concat
- join
- slice
- indexOf
- lastIndexOf
- map
- sort
- reverse
- forEach
- every
- some
- filter
- shift
- unshift
- pop
- push
- splice
['a', 'b', 'c'].length // 3
['a', 'b', 'c'].concat(['d', 'e']) // ['a', 'b', 'c', 'd', 'e']
['a', 'b', 'c'].join('_') // 'a_b_c'
['a', 'b', 'c'].slice(2) // ['c']
['a', 'b', 'c', 'b', 'b'].indexOf('b') // 1
['a', 'b', 'c', 'b', 'b'].lastIndexOf('b') // 4
[1, 2, 3, 4].map(item => item * 10) // [10, 20, 30, 40]
[1, 2, 3, 4].reduce((sum, cur) => sum + cur) // 10
[4, 2, 5, 1, 3].sort() // [1, 2, 3, 4, 5]
['a', 'b', 'c'].reverse() // ['c', 'b', 'a']
[1, 2, 3, 4].forEach(item => console.log(item))
[1, 2, 3, 4].every(item => item > 0) // true
[-1, -2, -3, 4].some(item => item > 0) // true
[1, -1, 2, -2, 3].filter(item => item > 0) // [1, 2, 3]
[1, 2, 3].shift() // 1; and base array = [2, 3]
[1, 2, 3].unshift(4, 5) // [4, 5, 1, 2, 3]
[1, 2, 3].pop() // 3; base array - [1, 2]
[1, 2, 3].push(4, 5) // 5; base array - [1, 2, 3, 4, 5]
["I'm", "learning", "JavaScript"].splice(1, 1) // ["learning"]; ["I'm", "JavaScript"]
length
Return total count of elements in array
['a', 'b', 'c'].length // 3
concat
This method merges your base array and array from arguments. Concat doesn't change the existing base array, just return new
one.
['a', 'b', 'c'].concat(['d', 'e']) // ['a', 'b', 'c', 'd', 'e']
// or you can merge arrays without any method (by spread operator)
const arr1 = ['a', 'b', 'c']
const arr2 = ['d', 'e']
const result = [...arr1, ...arr2] // ['a', 'b', 'c', 'd', 'e']
join
Return string of array elements, that separated by separator string from arguments
['a', 'b', 'c'].join('_') // 'a_b_c'
slice
Return copy of array from start
and end
from arguments
['a', 'b', 'c'].slice(2) // ['c']
['a', 'b', 'c'].slice(0, 1) // ['a']
indexOf
Returns index of the first founded element
['a', 'b', 'c', 'b', 'b'].indexOf('b') // 1
['a', 'b', 'c'].indexOf('d') // -1
lastIndexOf
Returns index of last founded element
['a', 'b', 'c', 'b', 'b'].lastIndexOf('b') // 4
map
Method creates a new array populated with the results of calling a provided callback
[1, 2, 3, 4].map(item => item * 10) // [10, 20, 30, 40]
reduce
The method executes a callback (from args) on each element of the array, resulting in a single output value.
[1, 2, 3, 4].reduce((sum, cur) => sum + cur) // 10
sort
Returns sorted array
[4, 2, 5, 1, 3].sort() // [1, 2, 3, 4, 5]
[4, 2, 5, 1, 3].sort((a, b) => b - a) // [5, 4, 3, 2, 1]
reverse
Method reverses an array
['a', 'b', 'c'].reverse() // ['c', 'b', 'a']
forEach
The method executes a provided function once for each array element.
[1, 2, 3, 4].forEach(item => console.log(item))
every
Returns true
if callback returns true
for each array element.
[1, 2, 3, 4].every(item => item > 0) // true
some
Returns true
if callback returns true
for any array element.
[-1, -2, -3, 4].some(item => item > 0) // true
filter
The method creates a new array with all elements that pass the test implemented by the provided callback.
[1, -1, 2, -2, 3].filter(item => item > 0) // [1, 2, 3]
shift
Removes the first element from an array
[1, 2, 3].shift() // 1; and base array = [2, 3]
unshift
Add the element to the beginning of an array
[1, 2, 3].unshift(4, 5) // 5; array - [4, 5, 1, 2, 3]
pop
Removes the last element from an array and returns that element.
[1, 2, 3].pop() // 3; base array - [1, 2]
push
The method adds one or more elements to the end of an array
[1, 2, 3].push(4, 5) // 5; base array - [1, 2, 3, 4, 5]
splice
The method changes the contents of an array by removing or replacing existing elements and/or adding new elements in place.
let arr = ["I'm", "learning", "JavaScript"];
arr.splice(1, 1); // from index 1, delete 1 element
console.log( arr ); // ["I'm", "JavaScript"]
Click likes and add to bookmarks if you like that Article. Also follow me on Twitter
Latest comments (6)
wow very good
Nice! But .find(), .findIndex() is missing
Very easy to read and remembering the list of important JS methods.
Congrats on achieving this and thanks for sharing. :)
Thank you, Anna!
Wow! great source mate!
Thanks a lot!