JS清空数组的三种方式

小灰灰 2022-04-14 20:18 254阅读 0赞

**方式1，splice**

<table> 
 <tbody> 
  <tr> 
   <td> <p>1</p> <p>2</p> <p>3</p> </td> 
   <td> <p><code>var</code>&nbsp;<code>ary = [1,2,3,4];</code></p> <p><code>ary.splice(0,ary.length);</code></p> <p><code>console.log(ary);&nbsp;</code><code>// 输出 []，空数组，即被清空了</code></p> </td> 
  </tr> 
 </tbody> 
</table>

**方式2，length赋值为0**

这种方式很有意思，其它语言如Java，其数组的length是只读的，不能被赋值。如

<table> 
 <tbody> 
  <tr> 
   <td> <p>1</p> <p>2</p> </td> 
   <td> <p><code>int</code><code>[] ary = { </code><code>1</code><code>,</code><code>2</code><code>,</code><code>3</code><code>,</code><code>4</code><code>};</code></p> <p><code>ary.length =&nbsp;</code><code>0</code><code>;</code></p> </td> 
  </tr> 
 </tbody> 
</table>

Java中会报错，编译通不过。而JS中则可以，且将数组清空了，

<table> 
 <tbody> 
  <tr> 
   <td> <p>1</p> <p>2</p> <p>3</p> </td> 
   <td> <p><code>var</code>&nbsp;<code>ary = [1,2,3,4];</code></p> <p><code>ary.length = 0;</code></p> <p><code>console.log(ary);&nbsp;</code><code>// 输出 []，空数组，即被清空了</code></p> </td> 
  </tr> 
 </tbody> 
</table>

目前 Prototype中数组的 [clear][] 和mootools库中数组的 [empty][] 使用这种方式清空数组。

**方式3，赋值为\[\]**

<table> 
 <tbody> 
  <tr> 
   <td> <p>1</p> <p>2</p> </td> 
   <td> <p><code>var</code>&nbsp;<code>ary = [1,2,3,4];</code></p> <p><code>ary = [];&nbsp;</code><code>// 赋值为一个空数组以达到清空原数组</code></p> </td> 
  </tr> 
 </tbody> 
</table>

这里其实并不能说是严格意义的清空数组，只是将ary重新赋值为空数组，之前的数组如果没有引用在指向它将等待垃圾回收。

Ext库Ext.CompositeElementLite类的 [clear][clear 1] 使用这种方式清空。  
  
方式2 保留了数组其它属性，方式3 则未保留。很多人认为方式2的效率很高些，因为仅仅是给length重新赋值了，而方式3则重新建立个对象。经 测试 恰恰是方式3的效率高。测试代码：

<table> 
 <tbody> 
  <tr> 
   <td> <p>1</p> <p>2</p> <p>3</p> <p>4</p> <p>5</p> <p>6</p> <p>7</p> <p>8</p> <p>9</p> </td> 
   <td> <p><code>var</code>&nbsp;<code>a = [];</code></p> <p><code>for</code>&nbsp;<code>(</code><code>var</code>&nbsp;<code>i=0; i&lt; 1000000; i++){ </code></p> <p><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>a.push(i);</code></p> <p><code>}</code></p> <p><code>var</code>&nbsp;<code>start =&nbsp;</code><code>new</code>&nbsp;<code>Date();</code></p> <p><code>//a = [];</code></p> <p><code>a.length = 0;</code></p> <p><code>var</code>&nbsp;<code>end =&nbsp;</code><code>new</code>&nbsp;<code>Date();</code></p> <p><code>alert(end - start);</code></p> </td> 
  </tr> 
 </tbody> 
</table>

测试结果：

![2011040413204710.png][]

以上结果可看到:方式3更快，效率更高。因此如果不保留原数组的其它属性Ext采用的方式更值得推荐。

原文链接：[https://www.cnblogs.com/snandy/archive/2011/04/04/2005156.html][https_www.cnblogs.com_snandy_archive_2011_04_04_2005156.html]

[clear]: http://api.prototypejs.org/language/Array/prototype/clear/
[empty]: http://mootools.net/docs/core/Types/Array#Array:empty
[clear 1]: http://www.sencha.com/products/core/docs/source/CompositeElementLite.html#method-Ext.CompositeElementLite-clear
[2011040413204710.png]: /images/20220415/5a5803d16346497981e2373303442177.png
[https_www.cnblogs.com_snandy_archive_2011_04_04_2005156.html]: https://www.cnblogs.com/snandy/archive/2011/04/04/2005156.html