Fatal编程技术网
  • javascript/
  • 如何在JavaScript中清空数组？

如何在JavaScript中清空数组？

javascript arrays

如何在JavaScript中清空数组？,javascript,arrays,Javascript,Arrays,是否有方法清空数组，如果有可能，请使用.remove（） 比如说, A = [1,2,3,4]; 如何清空该数组？清除现有数组的方法A： 方法1 （这是我对这个问题最初的回答） 此代码将变量A设置为新的空数组。如果您没有对原始数组A的引用，这是非常完美的，因为这实际上创建了一个全新的（空）数组。使用此方法时应小心，因为如果从其他变量或属性引用此数组，则原始数组将保持不变。仅当仅通过原始变量A引用数组时，才使用此选项 这也是最快的解决方案 此代码示例显示了使用此方法时可能遇到的问题： var a

是否有方法清空数组，如果有可能，请使用
.remove（）

比如说,

A = [1,2,3,4];
如何清空该数组？

清除现有数组的方法
A
：

方法1

（这是我对这个问题最初的回答）

此代码将变量
A
设置为新的空数组。如果您没有对原始数组
A
的引用，这是非常完美的，因为这实际上创建了一个全新的（空）数组。使用此方法时应小心，因为如果从其他变量或属性引用此数组，则原始数组将保持不变。仅当仅通过原始变量
A
引用数组时，才使用此选项

这也是最快的解决方案

此代码示例显示了使用此方法时可能遇到的问题：

var arr1 = ['a','b','c','d','e','f'];
var arr2 = arr1;  // Reference arr1 by another variable 
arr1 = [];
console.log(arr2); // Output ['a','b','c','d','e','f']
方法2（按）

这将通过将现有数组的长度设置为0来清除该数组。有人认为这可能不适用于所有JavaScript实现，但事实证明并非如此。在ECMAScript 5中使用“严格模式”时也可以使用，因为数组的length属性是读/写属性

方法3（按）

使用
.splice（）
可以很好地工作，但是由于
.splice（）
函数将返回一个包含所有删除项的数组，因此它实际上将返回原始数组的副本。基准表明，这对性能没有任何影响

方法4（按）

这个解决方案不是很简洁，也是最慢的解决方案，与原始答案中引用的早期基准相反

性能

在清除现有阵列的所有方法中，方法2和方法3的性能非常相似，比方法4快得多。看这个

正如他们在下文中指出的，用于确定上述四种方法性能的原始基准是有缺陷的。最初的基准测试重用了清除的数组，因此第二次迭代是清除一个已经为空的数组

以下基准测试修复了此缺陷：。它清楚地表明方法#2（长度属性）和#3（拼接）是最快的（不包括不改变原始数组的计数方法#1）

这是一个热门话题，引起了很多争议。实际上有很多正确的答案，因为这个答案已经被标记为被接受的答案很长时间了，我将在这里包括所有的方法。如果您对这个答案投赞成票，请将我引用的其他答案也投赞成票。

如果您需要保留原始数组，因为您对它的其他引用也应该更新，您可以通过将其长度设置为零，在不创建新数组的情况下清除它：

A.length = 0;
一个更跨浏览器友好、更优化的解决方案是使用
splice
方法清空数组A的内容，如下所示：

A.拼接（0，A.长度）
您可以将其添加到JavaScript文件中，以允许“清除”阵列：

然后你可以这样使用它：


var list = [1, 2, 3];
list.clear();



arr.splice(0, arr.length); //[]


或者，如果你想确保自己不会破坏某些东西：


if (!Array.prototype.clear) {
    Array.prototype.clear = function() {
       this.splice(0, this.length);
    };
}


很多人认为不应该修改本机对象（比如数组），我倾向于同意。请谨慎决定如何处理此问题


Array.prototype.clear = function() {
    this.length = 0;
};


并将其命名为：
array.clear（）
这里是在保持相同数组（“可变”）的情况下最快的工作实现：

仅供参考，当（array.pop（））
时，不能将其简化为
：测试将失败

仅供参考并定义
clear（）
，将
clear（）
也包含在内似乎是合乎逻辑的

打字稿版本：


function clearArray<T>(array: T[]) {
  while (array.length) {
    array.pop();
  }
}


以下是更新后的jsPerf：http://jsperf.com/array-destroy/32 http://jsperf.com/array-destroy/152

jsPerf离线。类似的基准：
使用的初始建议的修改版本：


var originalLength = A.length;
for (var i = originalLength; i > 0; i--) {
     A.pop();
}


简短的：


for (let i = A.length; i > 0;A.pop(),i--) {}


或者这里有另一个例子：


while(!A[Symbol.iterator]().next().done)A.shift()



如果您对内存分配感兴趣，您可以使用类似于chrome dev tools的时间线选项卡来比较每种方法。您需要使用底部的垃圾箱图标在“清除”阵列后强制垃圾收集。这将为您选择的浏览器提供更明确的答案。这里的很多答案都很古老，我不会依赖它们，而是像上面@tanguy_k的答案那样进行测试

（有关上述选项卡的介绍，您可以查看）

Stackoverflow强制我复制JSFIDLE，因此它是：


<html>
<script>
var size = 1000*100
window.onload = function() {
  document.getElementById("quantifier").value = size
}

function scaffold()
{
  console.log("processing Scaffold...");
  a = new Array
}
function start()
{
  size = document.getElementById("quantifier").value
  console.log("Starting... quantifier is " + size);
  console.log("starting test")
  for (i=0; i<size; i++){
    a[i]="something"
  }
  console.log("done...")
}

function tearDown()
{
  console.log("processing teardown");
  a.length=0
}

</script>
<body>
    <span style="color:green;">Quantifier:</span>
    <input id="quantifier" style="color:green;" type="text"></input>
    <button onclick="scaffold()">Scaffold</button>
    <button onclick="start()">Start</button>
    <button onclick="tearDown()">Clean</button>
    <br/>
</body>
</html>




变量大小=1000*100
window.onload=函数（）{
document.getElementById（“量词”）.value=size
}
函数脚手架（）
{
控制台日志（“处理脚手架…”）；
a=新阵列
}
函数start（）
{
大小=document.getElementById（“量词”）.value
log（“开始…量词为”+大小）；
日志（“启动测试”）
对于（i=0；i
A.splice（0）；

我只是在我正在编写的一些代码中执行了此操作。它清除了阵列。
性能测试：



如果您正在使用


a = []; 


然后将新数组引用分配给，如果a中的引用已分配给任何其他变量，则它也不会清空该数组，因此垃圾收集器不会收集该内存

例如


var a=[1,2,3];
var b=a;
a=[];
console.log(b);// It will print [1,2,3];


或

当我们指定
a.length
时，我们只是重置数组的边界，其余数组元素的内存将由垃圾收集器连接

相反，这两种解决方案更好


a.splice(0,a.length)


及


根据kenshou.html之前的回答，第二种方法速度更快。
关于while；pop/shift的性能，答案和注释中都有很多混淆和错误信息。while/pop解决方案（正如预期的那样）具有

for (let i = A.length; i > 0;A.pop(),i--) {}



while(!A[Symbol.iterator]().next().done)A.shift()



<html>
<script>
var size = 1000*100
window.onload = function() {
  document.getElementById("quantifier").value = size
}

function scaffold()
{
  console.log("processing Scaffold...");
  a = new Array
}
function start()
{
  size = document.getElementById("quantifier").value
  console.log("Starting... quantifier is " + size);
  console.log("starting test")
  for (i=0; i<size; i++){
    a[i]="something"
  }
  console.log("done...")
}

function tearDown()
{
  console.log("processing teardown");
  a.length=0
}

</script>
<body>
    <span style="color:green;">Quantifier:</span>
    <input id="quantifier" style="color:green;" type="text"></input>
    <button onclick="scaffold()">Scaffold</button>
    <button onclick="start()">Start</button>
    <button onclick="tearDown()">Clean</button>
    <br/>
</body>
</html>



a = []; // 37% slower
a.length = 0; // 89% slower
a.splice(0, a.length)  // 97% slower
while (a.length > 0) {
    a.pop();
} // Fastest



a = []; 



var a=[1,2,3];
var b=a;
a=[];
console.log(b);// It will print [1,2,3];



a.length = 0;



a.splice(0,a.length)



while(a.length > 0) {
    a.pop();
}



var arr = [];

for (var i = 0; i < 100; i++) { 
    arr.push(Math.random()); 
}

for (var j = 0; j < 1000; j++) {
    while (arr.length > 0) {
        arr.pop(); // this executes 100 times, not 100000
    }
}



A.length = 0;



while(A.length > 0) {
    A.pop();
}



A.splice(0, A.length);



A.length = 0;



var arr = ['77'];
arr.length = 20;
console.log("Increasing : ", arr); // (20) ["77", empty × 19]
arr.length = 12;
console.log("Truncating : ", arr); // (12) ["77", empty × 11]

var mainArr = new Array();
mainArr = ['1', '2', '3', '4'];

var refArr = mainArr;
console.log('Current', mainArr, 'Refered', refArr);

refArr.length = 3;
console.log('Length: ~ Current', mainArr, 'Refered', refArr);

mainArr.push('0');
console.log('Push to the End of Current Array Memory Location \n~ Current', mainArr, 'Refered', refArr);

mainArr.poptill_length(0);
console.log('Empty Array \n~ Current', mainArr, 'Refered', refArr);

Array.prototype.poptill_length = function (e) {
  while (this.length) {
    if( this.length == e ) break;

    console.log('removed last element:', this.pop());
  }
};



mainArr = []; // a new empty array is addressed to mainArr.

var arr = new Array('10'); // Array constructor
arr.unshift('1'); // add to the front
arr.push('15'); // add to the end
console.log("After Adding : ", arr); // ["1", "10", "15"]

arr.pop(); // remove from the end
arr.shift(); // remove from the front
console.log("After Removing : ", arr); // ["10"]

var arrLit = ['14', '17'];
console.log("array literal « ", indexedItem( arrLit ) ); // {0,14}{1,17}

function indexedItem( arr ) {
    var indexedStr = "";
    arr.forEach(function(item, index, array) {
        indexedStr += "{"+index+","+item+"}";
        console.log(item, index);
    });
    return indexedStr;
}



var shallowCopy = mainArr.slice(); // this is how to make a copy

var cloneArr = mainArr.slice(0, 3); 
console.log('Main', mainArr, '\tCloned', cloneArr);

cloneArr.length = 0; // Clears current memory location of an array.
console.log('Main', mainArr, '\tCloned', cloneArr);



const numbers = [1, 2, 3]



numbers = []



numbers.length = 0



xs
=> Array [ <4 empty slots> ]

[...xs]
=> Array [ undefined, undefined, undefined, undefined ]

xs.length
=> 4

xs[0]
=> ReferenceError: reference to undefined property xs[0]



public emptyFormArray(formArray:FormArray) {
    for (let i = formArray.controls.length - 1; i >= 0; i--) {
        formArray.removeAt(i);
    }
}



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



arr.length = 0; //change the length



[] //result



/* could be arr.pop() or arr.splice(0)
don't need to return as main array get changed */

function remove(arr) {
  while(arr.length) {
    arr.shift(); 
  }
}



arr.splice(0, arr.length); //[]



arr = []; //[]



Array.prototype.remove = Array.prototype.remove || function() {
  this.splice(0, this.length);
};



arr.remove(); //[]