DEV Community

Carlos Daniel Ortega Hernandez
Carlos Daniel Ortega Hernandez

Posted on

JavaScript Array Methods

Array Mutation Methods

Changes original array

  • pop(): Removes the las element of an array and returns it.
const array = ['Element 1', 'Element 2', 'Element 3'];
console.log(array.pop()); // 'Element 3'
console.log(array); // ['Element 1', 'Element 2'];
Enter fullscreen mode Exit fullscreen mode
  • shift(): Removes the firts element of an array and returns it.
const array = ['Element 1', 'Element 2', 'Element 3'];
console.log(array.shift()); // 'Element 1'
console.log(array); // ['Element 2', 'Element 3'];
Enter fullscreen mode Exit fullscreen mode
  • push(): Adds a new element to the array, at the end of the array, and returns the new length of the array.
const array = ['Element 1', 'Element 2', 'Element 3'];
console.log(array.push('Element 4')); // 4
console.log(array); // [ 'Element 1', 'Element 2', 'Element 3', 'Element 4' ]
Enter fullscreen mode Exit fullscreen mode
  • reverse(): Reverses the order of the elements in an array.
const array = ['Element 1', 'Element 2', 'Element 3'];
console.log(array.reverse()); // [ 'Element 3', 'Element 2', 'Element 1' ]
console.log(array); // [ 'Element 3', 'Element 2', 'Element 1' ]
Enter fullscreen mode Exit fullscreen mode
  • unshift(): Adds one or more elements to the beginning of an array, and returns the new length of the array.
const array = ['Element 1', 'Element 2', 'Element 3'];
console.log(array.unshift('Element 4')); // 4
console.log(array); // [ 'Element 4', 'Element 1', 'Element 2', 'Element 3' ]
Enter fullscreen mode Exit fullscreen mode
  • sort(): Sorts the elements of an array.
const array = [2, 8, 1, 4];
console.log(array.sort()); // [ 1, 2, 4, 8 ]
console.log(array); // [ 1, 2, 4, 8 ]
Enter fullscreen mode Exit fullscreen mode
  • splice(): Changes the contents of an array, removing existing elements and/or adds new elements.
const array = [2, 8, 1, 4, 'a', 'b'];
console.log(array.splice(1,3,'a')); // [ 8, 1, 4 ]
console.log(array); // [ 2, 'a', 'a', 'b' ]
Enter fullscreen mode Exit fullscreen mode

Array Accessor Methods

Does not modify the original array. Creates new array.

  • join(): Joins all the elements of an array into a string and returns the string.
const array = [2, 8, 1, 4, 'a', 'b', 'c'];

console.log(array.join()); // '2,8,1,4,a,b,c'
console.log(array); // [ 2, 8, 1, 4, 'a', 'b', 'c' ]
Enter fullscreen mode Exit fullscreen mode
  • slice(): Returns a part of the array in a new array.
const array = ['Element 1', 'Element 2', 'Element 3'];

console.log(array.slice(1, 2)); // [ 'Element 2' ]
console.log(array); // [ 'Element 1', 'Element 2', 'Element 3' ]
Enter fullscreen mode Exit fullscreen mode
  • concat(): Joins two or more arrays into one.
const array = ['Element 1', 'Element 2', 'Element 3'];
const array2 = [1, 2, 3];
const array3 = [true, false];

console.log(array.concat(array2, array3)); // [ 'Element 1', 'Element 2', 'Element 3', 1, 2, 3, true, false ]
console.log(array); // [ 'Element 1', 'Element 2', 'Element 3' ]
Enter fullscreen mode Exit fullscreen mode
  • includes(): Returns true if it finds the string, number, etc. or returns false if it finds nothing.
const array = ['Element 1', 'Element 2', 'Element 3'];

console.log(array.includes(2)); // false
console.log(array.includes('Element 1')); // true
Enter fullscreen mode Exit fullscreen mode
  • toString(): Returns all elements of the array, in a string.
const array = ['Element 1', 'Element 2', 'Element 3'];

console.log(array.toString()); // 'Element 1,Element 2,Element 3'
Enter fullscreen mode Exit fullscreen mode
  • indexOf(): Returns the first index that matches the search.
const array = [1, 2, 3, 4, 1, 3, 5, 2, 1];

console.log(array.indexOf(1)); // 0
Enter fullscreen mode Exit fullscreen mode
  • lastIndexOf(): Returns the last index that matches the search.
const array = [1, 2, 3, 4, 1, 3, 5, 2, 1];

console.log(array.lastIndexOf(2)); // 7
Enter fullscreen mode Exit fullscreen mode

Oldest comments (0)