JavaScript - array delete operator vs splice method

In this article, we would like to show you the difference between delete operator and splice method on array elements in JavaScript.

The delete operator will remove the object property, but won't reindex the array or change its length. This makes the element appears as if it was undefined.

xxxxxxxxxx

//  index:    0    1    2    3

var array = ['a', 'b', 'c', 'd'];

​

delete array[0]

​

console.log(array);        // [ , b, c, d ]

console.log(array.length); // 4

console.log(array[0]);     // undefined

Note:

The value is not in fact set to undefined. The property is removed from the array, making it appear undefined.

In the Google Chrome developer tools we can see the following output:

Copy

xxxxxxxxxx

 

1

[empty, 'b', 'c', 'd']

or in Node.js:

Copy

xxxxxxxxxx

 

1

[ <1 empty item>, 'b', 'c', 'd' ]

The array.splice(start, deleteCount) actually removes the element, reindexes the array, and changes its length.

xxxxxxxxxx

//  index:    0    1    2    3

var array = ['a', 'b', 'c', 'd'];

​

array.splice(0, 1);

​

console.log(array);        // ['b', 'c', 'd' ]

console.log(array.length); // 3

console.log(array[0]);     // b

1. delete operator - JavaScript | MDN
2. Array.prototype.splice() - JavaScript | MDN