blocks|key|1422003|text|因为delete只从数组中的元素中删除对象，所以数组的长度不会改变。Splice删除对象并缩短数组。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1422004|下面的代码将显示"a“、"b”、"undefined“、"d”|1422005|myArray+=+['a',+'b',+'c',+'d'];+delete+myArray[2];

for+(var+count+=+0;+count+<+myArray.length;+count%2B%2B)+{
++++alert(myArray[count]);
}|code-block|syntax|javascript|1422006|而这将显示"a“、"b”、"d“|1422007|myArray+=+['a',+'b',+'c',+'d'];+myArray.splice(2,1);

for+(var+count+=+0;+count+<+myArray.length;+count%2B%2B)+{
++++alert(myArray[count]);
}|1422008|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|P|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|Q|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|R|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|S|8|@]|9|@]|A|$G|H]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

Because delete only removes the object from the element in the array, the length of the array won't change. Splice removes the object and shortens the array.

The following code will display "a", "b", "undefined", "d"

<pre><code>myArray = ['a', 'b', 'c', 'd']; delete myArray[2];

for (var count = 0; count &lt; myArray.length; count++) {
 alert(myArray[count]);
}
</code></pre>

Whereas this will display "a", "b", "d"

<pre><code>myArray = ['a', 'b', 'c', 'd']; myArray.splice(2,1);

for (var count = 0; count &lt; myArray.length; count++) {
 alert(myArray[count]);
}
</code></pre>

blocks|key|1636953|text|当我试图理解如何从数组中删除元素的每个匹配项时，我偶然发现了这个问题。splice和delete的Here's+a+comparison，用于从items阵列中删除每个'c'。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1636954|var+items+=+['a',+'b',+'c',+'d',+'a',+'b',+'c',+'d'];

while+(items.indexOf('c')+!==+-1)+{
++items.splice(items.indexOf('c'),+1);
}

console.log(items);+//+["a",+"b",+"d",+"a",+"b",+"d"]

items+=+['a',+'b',+'c',+'d',+'a',+'b',+'c',+'d'];

while+(items.indexOf('c')+!==+-1)+{
++delete+items[items.indexOf('c')];
}

console.log(items);+//+["a",+"b",+undefined,+"d",+"a",+"b",+undefined,+"d"]
​|code-block|syntax|javascript|1636955|entityMap|0|LINK|mutability|MUTABLE|url|http://jsfiddle.net/y5NbD/5/^0|Z|6|16|6|20|5|2C|3|1D|J|0|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@$9|T|A|U|B|C]|$9|V|A|W|B|C]|$9|X|A|Y|B|C]|$9|Z|A|10|B|C]]|D|@$9|11|A|12|1|13]]|E|$]]|$1|F|3|G|5|H|7|14|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|15|8|@]|D|@]|E|$]]]|L|$M|$5|N|O|P|E|$Q|R]]]]

I stumbled onto this question while trying to understand how to remove every occurrence of an element from an Array. <a href="http://jsfiddle.net/y5NbD/5/" rel="noreferrer">Here's a comparison</a> of <code>splice</code> and <code>delete</code> for removing every <code>'c'</code> from the <code>items</code> Array.

<pre><code>var items = ['a', 'b', 'c', 'd', 'a', 'b', 'c', 'd'];

while (items.indexOf('c') !== -1) {
 items.splice(items.indexOf('c'), 1);
}

console.log(items); // ["a", "b", "d", "a", "b", "d"]

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

while (items.indexOf('c') !== -1) {
 delete items[items.indexOf('c')];
}

console.log(items); // ["a", "b", undefined, "d", "a", "b", undefined, "d"]
​
</code></pre>

blocks|key|1636906|text|splice将使用数字索引。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1636907|而delete可以用于其他类型的索引。|1636908|示例：|1636909|delete+myArray['text1'];|code-block|syntax|javascript|1636910|entityMap^0|0|6|0|1|6|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@$9|R|A|S|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|T|8|@$9|U|A|V|B|C]]|D|@]|E|$]]|$1|H|3|I|5|6|7|W|8|@]|D|@]|E|$]]|$1|J|3|K|5|L|7|X|8|@]|D|@]|E|$M|N]]|$1|O|3|-4|5|6|7|Y|8|@]|D|@]|E|$]]]|P|$]]

<code>splice</code> will work with numeric indices.

whereas <code>delete</code> can be used against other kind of indices..

example:

<pre><code>delete myArray['text1'];
</code></pre>

blocks|key|1422124|text|可能还值得一提的是，splice只适用于数组。(不能依赖对象属性来遵循一致的顺序。)|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1422125|要从对象中删除键值对，delete实际上是您想要的：|1422126|delete+myObj.propName;+++++//+,+or:
delete+myObj["propName"];++//+Equivalent.|code-block|syntax|javascript|1422127|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|L|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|M|8|@]|9|@]|A|$G|H]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

It's probably also worth mentioning that splice only works on arrays. (Object properties can't be relied on to follow a consistent order.)

To remove the key-value pair from an object, delete is actually what you want: 

<pre><code>delete myObj.propName; // , or:
delete myObj["propName"]; // Equivalent.
</code></pre>

blocks|key|1637005|text|您可以使用下面这样的内容|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1637006|​|1637007|var+my_array+=+[1,2,3,4,5,6];
delete+my_array[4];
console.log(my_array.filter(function(a){return+typeof+a+!==+'undefined';}));+//+[1,2,3,4,6]|code-block|syntax|javascript|1637008|1637009|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|M|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|N|8|@]|9|@]|A|$G|H]]|$1|I|3|C|5|6|7|O|8|@]|9|@]|A|$]]|$1|J|3|-4|5|6|7|P|8|@]|9|@]|A|$]]]|K|$]]

you can use something like this

<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>var my_array = [1,2,3,4,5,6];
delete my_array[4];
console.log(my_array.filter(function(a){return typeof a !== 'undefined';})); // [1,2,3,4,6]</code></pre>
</div>
</div>

blocks|key|1422348|text|为什么不直接过滤呢？我认为这是在js中考虑数组的最清晰的方式。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1422349|myArray+=+myArray.filter(function(item){
++++return+item.anProperty+!=+whoShouldBeDeleted
});|code-block|syntax|javascript|1422350|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

Why not just filter? I think it is the most clear way to consider the arrays in js.

<pre><code>myArray = myArray.filter(function(item){
 return item.anProperty != whoShouldBeDeleted
});
</code></pre>

blocks|key|1422481|text|其他人已经正确地将delete与splice进行了比较。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1422482|另一个有趣的比较是delete和undefined：删除的数组项比刚刚设置为undefined的数组项使用更少的内存；|1422483|例如，此代码将不会结束：|1422484|let+y+=+1;
let+ary+=+[];
console.log("Fatal+Error+Coming+Soon");
while+(y+<+4294967295)
{
++++ary.push(y);
++++ary[y]+=+undefined;
++++y+%2B=+1;
}
console(ary.length);|code-block|syntax|javascript|1422485|它会产生以下错误：|1422486|FATAL+ERROR:+CALL_AND_RETRY_LAST+Allocation+failed+-+JavaScript+heap+out+of+memory.|1422487|因此，正如您所看到的，undefined实际上占用了堆内存。|1422488|但是，如果您还delete了ary-item+(而不是仅仅将其设置为undefined)，代码将缓慢完成：|1422489|let+x+=+1;
let+ary+=+[];
console.log("This+will+take+a+while,+but+it+will+eventually+finish+successfully.");
while+(x+<+4294967295)
{
++++ary.push(x);
++++ary[x]+=+undefined;
++++delete+ary[x];
++++x+%2B=+1;
}
console.log(`Success,+array-length:+${ary.length}.`);|1422490|这些都是极端的例子，但它们提出了一个关于delete的观点，我在任何地方都没有看到任何人提到过。|1422491|entityMap^0|9|6|G|6|0|9|6|G|9|12|9|0|0|0|0|0|B|9|0|7|6|Y|9|0|0|K|6|0^^$0|@$1|2|3|4|5|6|7|12|8|@$9|13|A|14|B|C]|$9|15|A|16|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|17|8|@$9|18|A|19|B|C]|$9|1A|A|1B|B|C]|$9|1C|A|1D|B|C]]|D|@]|E|$]]|$1|H|3|I|5|6|7|1E|8|@]|D|@]|E|$]]|$1|J|3|K|5|L|7|1F|8|@]|D|@]|E|$M|N]]|$1|O|3|P|5|6|7|1G|8|@]|D|@]|E|$]]|$1|Q|3|R|5|L|7|1H|8|@]|D|@]|E|$M|N]]|$1|S|3|T|5|6|7|1I|8|@$9|1J|A|1K|B|C]]|D|@]|E|$]]|$1|U|3|V|5|6|7|1L|8|@$9|1M|A|1N|B|C]|$9|1O|A|1P|B|C]]|D|@]|E|$]]|$1|W|3|X|5|L|7|1Q|8|@]|D|@]|E|$M|N]]|$1|Y|3|Z|5|6|7|1R|8|@$9|1S|A|1T|B|C]]|D|@]|E|$]]|$1|10|3|-4|5|6|7|1U|8|@]|D|@]|E|$]]]|11|$]]

Others have already properly compared <code>delete</code> with <code>splice</code>.

Another interesting comparison is <code>delete</code> versus <code>undefined</code>: a deleted array item uses less memory than one that is just set to <code>undefined</code>;

For example, this code will not finish:

<pre><code>let y = 1;
let ary = [];
console.log("Fatal Error Coming Soon");
while (y &lt; 4294967295)
{
 ary.push(y);
 ary[y] = undefined;
 y += 1;
}
console(ary.length);
</code></pre>

It produces this error:

<pre><code>FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory.
</code></pre>

So, as you can see <code>undefined</code> actually takes up heap memory.

However, if you also <code>delete</code> the ary-item (instead of just setting it to <code>undefined</code>), the code will slowly finish:

<pre><code>let x = 1;
let ary = [];
console.log("This will take a while, but it will eventually finish successfully.");
while (x &lt; 4294967295)
{
 ary.push(x);
 ary[x] = undefined;
 delete ary[x];
 x += 1;
}
console.log(`Success, array-length: ${ary.length}.`);
</code></pre>

These are extreme examples, but they make a point about <code>delete</code> that I haven't seen anyone mention anywhere.

blocks|key|1422373|text|function+remove_array_value(array,+value)+{
++++var+index+=+array.indexOf(value);
++++if+(index+>=+0)+{
++++++++array.splice(index,+1);
++++++++reindex_array(array);
++++}
}
function+reindex_array(array)+{
+++var+result+=+[];
++++for+(var+key+in+array)+{
++++++++result.push(array[key]);
++++}
++++return+result;
}|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1422374|示例：|unstyled|1422375|var+example_arr+=+['apple',+'banana',+'lemon'];+++//+length+=+3
remove_array_value(example_arr,+'banana');|1422376|删除banana，数组长度=2|1422377|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$B|C]]|$1|D|3|E|5|F|7|N|8|@]|9|@]|A|$]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$B|C]]|$1|I|3|J|5|F|7|P|8|@]|9|@]|A|$]]|$1|K|3|-4|5|F|7|Q|8|@]|9|@]|A|$]]]|L|$]]

<pre><code>function remove_array_value(array, value) {
 var index = array.indexOf(value);
 if (index &gt;= 0) {
 array.splice(index, 1);
 reindex_array(array);
 }
}
function reindex_array(array) {
 var result = [];
 for (var key in array) {
 result.push(array[key]);
 }
 return result;
}
</code></pre>

example:

<pre><code>var example_arr = ['apple', 'banana', 'lemon']; // length = 3
remove_array_value(example_arr, 'banana');
</code></pre>

banana is deleted and array length = 2

blocks|key|1637411|text|如果你有很小的数组，你可以使用filter|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1637412|myArray+=+['a',+'b',+'c',+'d'];
myArray+=+myArray.filter(x+=>+x+!==+'b');|code-block|syntax|javascript|1637413|entityMap^0|F|6|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|P|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|Q|8|@]|D|@]|E|$]]]|L|$]]

If you have small array you can use <code>filter</code>:

<pre><code>myArray = ['a', 'b', 'c', 'd'];
myArray = myArray.filter(x =&gt; x !== 'b');
</code></pre>

blocks|key|1637085|text|IndexOf也接受引用类型。假设以下场景：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1637086|​|1637087|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|code-block|syntax|javascript|1637088|1637089|不同的是：|1637090|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|1637091|entityMap^0|0|7|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|T|8|@$9|U|A|V|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|W|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|X|8|@]|D|@]|E|$K|L]]|$1|M|3|G|5|6|7|Y|8|@]|D|@]|E|$]]|$1|N|3|O|5|6|7|Z|8|@]|D|@]|E|$]]|$1|P|3|Q|5|J|7|10|8|@]|D|@]|E|$K|L]]|$1|R|3|-4|5|6|7|11|8|@]|D|@]|E|$]]]|S|$]]

<code>IndexOf</code> accepts also a reference type. Suppose the following scenario:

<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>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</code></pre>
</div>
</div>


Differently:

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

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

blocks|key|1637130|text|最简单的方法可能是|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1637131|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'];|code-block|syntax|javascript|1637132|希望这能有所帮助。参考：https://lodash.com/docs#compact|offset|length|1637133|entityMap|0|LINK|mutability|MUTABLE|url|https://lodash.com/docs#compact^0|0|0|C|V|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|U|8|@]|9|@$I|V|J|W|1|X]]|A|$]]|$1|K|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|L|$M|$5|N|O|P|A|$Q|R]]]]

Easiest way is probably 

<pre><code>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'];
</code></pre>

Hope this helps. 
Reference: <a href="https://lodash.com/docs#compact" rel="nofollow">https://lodash.com/docs#compact</a>

blocks|key|1422299|text|如果想要删除的元素在中间(比如我们想删除'c'，它的索引是1)，你可以使用：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1422300|var+arr+=+['a','b','c'];
var+indexToDelete+=+1;
var+newArray+=+arr.slice(0,indexToDelete).combine(arr.slice(indexToDelete%2B1,+arr.length))|code-block|syntax|javascript|1422301|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

If the desired element to delete is in the middle (say we want to delete 'c', which its index is 1), you can use:

<pre><code>var arr = ['a','b','c'];
var indexToDelete = 1;
var newArray = arr.slice(0,indexToDelete).combine(arr.slice(indexToDelete+1, arr.length))
</code></pre>

blocks|key|1637325|text|对于那些想使用Lodash的人，可以使用：myArray+=+_.without(myArray,+itemToRemove)|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1637326|或者像我在Angular2中使用的那样|1637327|import+{+without+}+from+'lodash';
...
myArray+=+without(myArray,+itemToRemove);
...|code-block|syntax|javascript|1637328|entityMap|0|LINK|mutability|MUTABLE|url|https://lodash.com/docs/4.17.4#without^0|L|16|7|6|0|0|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@$9|V|A|W|B|C]]|D|@$9|X|A|Y|1|Z]]|E|$]]|$1|F|3|G|5|6|7|10|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|11|8|@]|D|@]|E|$K|L]]|$1|M|3|-4|5|6|7|12|8|@]|D|@]|E|$]]]|N|$O|$5|P|Q|R|E|$S|T]]]]

For those who wants to use <a href="https://lodash.com/docs/4.17.4#without" rel="nofollow noreferrer">Lodash</a> can use:
<code>myArray = _.without(myArray, itemToRemove)</code>

Or as I use in Angular2

<pre><code>import { without } from 'lodash';
...
myArray = without(myArray, itemToRemove);
...
</code></pre>

blocks|key|1637040|text|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);|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1637041|//结果:+myArray+=+'b'，'c'，'d'；|unstyled|1637042|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$B|C]]|$1|D|3|E|5|F|7|J|8|@]|9|@]|A|$]]|$1|G|3|-4|5|F|7|K|8|@]|9|@]|A|$]]]|H|$]]

<pre><code>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);
</code></pre>

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

What is the difference between using <a href="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Operators/delete" rel="noreferrer">the <code>delete</code> operator</a> on the array element as opposed to using <a href="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Array/splice" rel="noreferrer">the <code>Array.splice</code> method</a>? 

For example:

<pre><code>myArray = ['a', 'b', 'c', 'd'];

delete myArray[1];
// or
myArray.splice (1, 1);
</code></pre>

Why even have the splice method if I can delete array elements like I can with objects?

Deleting array elements in JavaScript - delete vs splice

与使用相比，在数组元素上使用有什么区别？例如：myArray = ['a', 'b', 'c', 'd'];delete myArray[1];//  ormyArray.splice (1, 1);如果我可以像删除对象一样删除数组元素，为什么还要使用splice方法呢？

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

回答 14

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问删除JavaScript中的数组元素- delete vs spliceEN

回答 14

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

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