JavaScript中删除数组元素 - delete vs splice

1450

使用delete操作符和使用Array.splice方法在数组元素上的区别是什么?

例如:

myArray = ['a', 'b', 'c', 'd'];

delete myArray[1];
//  or
myArray.splice (1, 1);

如果我可以像操作对象一样删除数组元素,那为什么还需要splice方法呢?


3
关于在循环中使用 .splice,请参考这个问题:在JavaScript中从数组中删除元素 - Rob W
6
是的,但是这个回答是在之后的一天发布的,并且得到了更多的投票 - 我会说它写得更好,这就是原因。 - Camilo Martin
@andynormancx — 看起来这不是完全重复的问题。你链接的那个问题基本上是在问为什么从数组中删除一个元素(从而使其变得稀疏)不会减少它的长度。而这个问题则是在询问deleteArray.prototype.splice之间的区别。 - chharvey
@chharvey同意,但更重要的是,这个问题怎么可能在9年前发布!让我感到老了,现在又回来评论它。 - andynormancx
《JavaScript:前20年》提到:“JavaScript 1.1添加了delete、typeof和void运算符。在JavaScript 1.1中,delete运算符仅将其变量或对象属性操作数设置为null值。”并且splice被添加到1.2版本中,“数组push、pop、shift、unshift和splice直接模拟了同名的Perl数组函数。” - Qiulang
29个回答

2
如果您有一个小数组,可以使用filter函数:
myArray = ['a', 'b', 'c', 'd'];
myArray = myArray.filter(x => x !== 'b');

1

好的,想象一下我们有以下的数组:

const arr = [1, 2, 3, 4, 5];

让我们先做删除操作:

delete arr[1];

这是结果:
[1, empty, 3, 4, 5];

空的! 让我们开始吧:

arr[1]; //undefined

所以意味着只有值被删除了,现在是未定义的,所以长度是相同的,也会返回true...

让我们重置我们的数组,并这次使用splice来实现:

arr.splice(1, 1);

这次的结果如下:

[1, 3, 4, 5];

正如您所看到的,数组长度已经改变,arr[1]现在是3...

此外,这将返回一个已删除的数组项,即在本例中为[3]...


1
保持简单 :-
当你删除数组中的任何元素时,它将删除所提及位置的值,并使其变为空/未定义,但该位置仍存在于数组中。

var arr = [1, 2, 3 , 4, 5];

function del() {
  delete arr[3];
  console.log(arr);
}
del(arr);

而在splice原型中,参数如下。 //arr.splice(开始删除的位置,要删除的项目数)

var arr = [1, 2, 3 , 4, 5];

function spl() {
  arr.splice(0, 2);
// arr.splice(position to start the delete , no. of items to delete)
  console.log(arr);
}
spl(arr);


0
如果要删除的元素位于中间(比如我们想要删除 'c',其索引为1),可以使用以下方法:
var arr = ['a','b','c'];
var indexToDelete = 1;
var newArray = arr.slice(0,indexToDelete).combine(arr.slice(indexToDelete+1, arr.length))

0

IndexOf也接受引用类型。假设有以下情况:

var arr = [{item: 1}, {item: 2}, {item: 3}];
var found = find(2, 3); //pseudo code: will return [{item: 2}, {item:3}]
var l = found.length;

while(l--) {
   var index = arr.indexOf(found[l])
      arr.splice(index, 1);
   }
   
console.log(arr.length); //1

不同之处:

var item2 = findUnique(2); //will return {item: 2}
var l = arr.length;
var found = false;
  while(!found && l--) {
  found = arr[l] === item2;
}

console.log(l, arr[l]);// l is index, arr[l] is the item you look for

0
delete:delete会删除对象属性,但不会重新索引数组或更新其长度。这使它看起来像是未定义的:
splice:实际上删除了元素,重新索引了数组并更改了其长度。
从最后删除元素。
arrName.pop();

从第一个元素删除

arrName.shift();

从中间删除

arrName.splice(starting index,number of element you wnt to delete);

Ex: arrName.splice(1,1);

删除最后一个元素

arrName.splice(-1);

通过使用数组索引号进行删除

 delete arrName[1];

0

想要使用Lodash的人可以使用以下代码:

myArray = _.without(myArray, itemToRemove)

或者,如我在Angular2中使用的那样:

import { without } from 'lodash';
...
myArray = without(myArray, itemToRemove);
...

0

最简单的方法可能是

var myArray = ['a', 'b', 'c', 'd'];
delete myArray[1]; // ['a', undefined, 'c', 'd']. Then use lodash compact method to remove false, null, 0, "", undefined and NaN
myArray = _.compact(myArray); ['a', 'c', 'd'];

希望这可以帮到您。 参考:https://lodash.com/docs#compact

1
如果有人在寻找“compact”的相关信息,不需要使用lodash。可以尝试使用myArray.filter(function(n){return n;}) - dat

-1
function deleteFromArray(array, indexToDelete){
  var remain = new Array();
  for(var i in array){
    if(array[i] == indexToDelete){
      continue;
    }
    remain.push(array[i]);
  }
  return remain;
}

myArray = ['a', 'b', 'c', 'd'];
deleteFromArray(myArray , 0);

// 结果:myArray = ['b', 'c', 'd'];


@ChrisDennis 为什么?(没有讽刺或恶意,这是一个真诚的问题) - Chris Bier
除了这个答案没有回答 OP 的问题之外 - Chris Bier

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接