Вопрос: Как очистить массив в JavaScript?


Есть ли способ очистить массив, и если это возможно с .remove()?

Например,

A = [1,2,3,4];

Как я могу это опорочить?


2199


источник


Ответы:


Способы очистки существующего массива A:

Способ 1

(это был мой первоначальный ответ на вопрос)

A = [];

Этот код установит переменную 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 (в виде предложенный от Мэтью Крамли )

A.length = 0

Это очистит существующий массив, установив его длину равным 0. Некоторые утверждают, что это может не работать во всех реализациях JavaScript, но оказывается, что это не так. Он также работает при использовании «строгого режима» в ECMAScript 5, потому что свойство length массива является свойством чтения / записи.

Способ 3 (в виде предложенный от Энтони )

A.splice(0,A.length)

С помощью .splice()будет работать отлично, но поскольку .splice()функция вернет массив со всеми удаленными элементами, он фактически вернет копию исходного массива. Тесты показывают, что это не влияет на производительность вообще.

Способ 4 (в виде предложенный от tanguy_k )

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

Это решение не очень кратким, и оно также является самым медленным решением, в отличие от предыдущих эталонных тестов, упомянутых в первоначальном ответе.

Представление

Из всех способов очистки существующий массив , методы 2 и 3 очень похожи по производительности и намного быстрее, чем метод 4. См. это эталонный тест ,

Как указывалось Diadistis в их ответ ниже, исходные контрольные показатели, которые использовались для определения эффективности четырех описанных выше методов, были ошибочными. Исходный эталон повторно использовал очищенный массив, поэтому вторая итерация очищала массив, который был уже пуст.

Следующий критерий устраняет этот недостаток: http://jsben.ch/#/hyj65 , Он ясно показывает, что методы # 2 (свойство длины) и # 3 (сращивание) являются самыми быстрыми (не считая метод # 1, который не меняет исходный массив).


Это была горячая тема и причина много споров. На самом деле есть много правильных ответов, и поскольку этот ответ был отмечен как принятый ответ в течение очень долгого времени, я буду включать все методы здесь. Если вы проголосуете за этот ответ, пожалуйста, поддержите другие ответы, на которые я ссылался.


3364



Если вам нужно сохранить исходный массив, потому что у вас есть другие ссылки на него, которые также должны быть обновлены, вы можете очистить его, не создавая новый массив, установив его длину равным нулю:

A.length = 0;

2236



Здесь самая быстрая рабочая реализация в то время как сохранение того же массива ( "Изменчивый"):

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

FYI карта определяет clear()так что было бы логично clear()для массив слишком.

Или как Underscore.js mixin :

_.mixin({
  clearArray: function(array) {
    while (array.length) {
      array.pop();
    }
  }
});

Или простая функция:

function clearArray(array) {
  while (array.length) {
    array.pop();
  }
}

Машинопись версия:

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

FYI, это не может быть упрощено while (array.pop()): тесты не удастся.

И тесты, которые идут с ним:

describe('Array', () => {
  it('should clear the array', () => {
    let array = [1, 2, 3, 4, 5];
    array.clear();
    expect(array.length).toEqual(0);
    expect(array[0]).toEqual(undefined);
    expect(array[4]).toEqual(undefined);

    // Even with undefined or null inside
    array = [1, undefined, 3, null, 5];
    array.clear();
    expect(array.length).toEqual(0);
    expect(array[0]).toEqual(undefined);
    expect(array[4]).toEqual(undefined);
  });
});

Здесь обновленный jsPerf: http://jsperf.com/array-destroy/32 http://jsperf.com/array-destroy/152


253



Более кросс-браузерное и более оптимальное решение будет заключаться в использовании spliceметод для опорожнения содержимого массива A, как показано ниже:

A.splice(0, A.length);


178



Тест производительности:

http://jsperf.com/array-clear-methods/3

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

59



The answers that have no less that 2739 upvotes by now are misleading and incorrect.

The question is: "How do you empty your existing array?" E.g. for A = [1,2,3,4].

  1. Saying "A = [] is the answer" is ignorant and absolutely incorrect. [] == [] is false.

    This is because these two arrays are two separate, individual objects, with their own two identities, taking up their own space in the digital world, each on its own.


Let's say your mother asks you to empty the trash can.

  • You don't bring in a new one as if you've done what you've been asked for.
  • Instead, you empty the trash can.
  • You don't replace the filled one with a new empty can, and you don't take the label "A" from the filled can and stick it to the new one as in A = [1,2,3,4]; A = [];

Emptying an array object is the easiest thing ever:

A.length = 0;

This way, the can under "A" is not only empty, but also as clean as new!


  1. Furthermore, you are not required to remove the trash by hand until the can is empty! You were asked to empty the existing one, completely, in one turn, not to pick up the trash until the can gets empty, as in:

    while(A.length > 0) {
        A.pop();
    }
    
  2. Nor, to put your left hand at the bottom of the trash, holding it with your right at the top to be able to pull its content out as in:

    A.splice(0, A.length);
    

No, you were asked to empty it:

A.length = 0;

This is the only code that correctly empties the contents of a given JavaScript array.


57



You can add this to your JavaScript file to allow your arrays to be "cleared":

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

Then you can use it like this:

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

Or if you want to be sure you don't destroy something:

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

Lots of people think you shouldn't modify native objects (like Array), and I'm inclined to agree. Please use caution in deciding how to handle this.


32



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

And call it: array.clear();


17



There is a lot of confusion and misinformation regarding the while;pop/shift performance both in answers and comments. The while/pop solution has (as expected) the worst performance. What's actually happening is that setup runs only once for each sample that runs the snippet in a loop. eg:

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
    }
}

I have created a new test that works correctly :

http://jsperf.com/empty-javascript-array-redux

Warning: even in this version of the test you can't actually see the real difference because cloning the array takes up most of the test time. It still shows that splice is the fastest way to clear the array (not taking [] into consideration because while it is the fastest it's not actually clearing the existing array).


15



In case you are interested in the memory allocation, you may compare each approach using something like this jsfiddle in conjunction with chrome dev tools' timeline tab. You will want to use the trash bin icon at the bottom to force a garbage collection after 'clearing' the array. This should give you a more definite answer for the browser of your choice. A lot of answers here are old and I wouldn't rely on them but rather test as in @tanguy_k's answer above.

(for an intro to the aforementioned tab you can check out here)

Stackoverflow forces me to copy the jsfiddle so here it is:

<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>

And you should take note that it may depend on the type of the array elements, as javascript manages strings differently than other primitive types, not to mention arrays of objects. The type may affect what happens.


14



A.splice(0);

I just did this on some code I am working on. It cleared the array.


10