Comment vider un tableau en JavaScript ?

Question

Existe-t-il un moyen de vider un tableau et, si oui, éventuellement avec .remove() ?

Par exemple,

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

Comment puis-je le vider ?

Answer 1

Façons d'effacer un tableau existant A :

Méthode 1

(c'était ma réponse initiale à la question)

A = [];

Ce code va définir la variable A vers un nouveau tableau vide. C'est parfait si vous n'avez pas références au tableau original A n'importe où ailleurs, car cela crée en fait un tout nouveau tableau (vide). Vous devez faire attention avec cette méthode car si vous avez référencé ce tableau à partir d'une autre variable ou propriété, le tableau d'origine restera inchangé. N'utilisez cette méthode que si vous ne référencez le tableau que par sa variable d'origine. A .

C'est aussi la solution la plus rapide.

Cet exemple de code montre le problème que vous pouvez rencontrer en utilisant cette méthode :

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

Méthode 2 (comme Proposition de par Matthew Crumley )

A.length = 0

Cela effacera le tableau existant en fixant sa longueur à 0. Certains ont fait valoir que cela ne fonctionne pas dans toutes les implémentations de JavaScript, mais il s'avère que ce n'est pas le cas. Elle fonctionne également en "mode strict" dans ECMAScript 5 car la propriété de longueur d'un tableau est une propriété de lecture/écriture.

Méthode 3 (comme Proposition de par Anthony )

A.splice(0,A.length)

Utilisation de .splice() fonctionnera parfaitement, mais comme l .splice() retournera un tableau avec tous les éléments supprimés, elle retournera en fait une copie du tableau original. Les tests de référence suggèrent que cela n'a aucun effet sur les performances.

Méthode 4 (comme Proposition de par tanguy_k )

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

Cette solution n'est pas très succincte, et c'est aussi la solution la plus lente, contrairement aux benchmarks précédents référencés dans la réponse originale.

Performance

De toutes les méthodes de nettoyage d'un dispositif existant Les méthodes 2 et 3 sont très similaires en termes de performances et sont beaucoup plus rapides que la méthode 4. Voir cette repère .

Comme l'a souligné Diadistis dans leur réponse ci-dessous, les repères originaux qui ont été utilisés pour déterminer les performances des quatre méthodes décrites ci-dessus étaient défectueux. Le benchmark original réutilisait le tableau effacé, de sorte que la deuxième itération effaçait un tableau déjà vide.

Le benchmark suivant corrige cette faille : http://jsben.ch/#/hyj65 . Il montre clairement que les méthodes #2 (propriété de longueur) et #3 (splice) sont les plus rapides (sans compter la méthode #1 qui ne modifie pas le tableau original).

---

Cette question a été un sujet brûlant et a suscité de nombreuses controverses. Il existe en fait de nombreuses réponses correctes et comme cette réponse a été marquée comme la réponse acceptée depuis très longtemps, je vais inclure toutes les méthodes ici. Si vous votez pour cette réponse, merci d'upvoter également les autres réponses que j'ai référencées.

Answer 2

Si vous devez conserver le tableau original parce que vous avez d'autres références à celui-ci qui doivent être mises à jour également, vous pouvez l'effacer sans créer un nouveau tableau en fixant sa longueur à zéro :

A.length = 0;

Answer 3

Voici la mise en œuvre la plus rapide tandis que en gardant le même tableau ("mutable") :

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

Pour info, il ne peut pas être simplifié en while (array.pop()) : les tests échoueront.

FYI Carte et Définir définir clear() il aurait été logique d'avoir clear() pour Array aussi.

Version TypeScript :

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

Les tests correspondants :

describe('clearArray()', () => {
  test('clear regular array', () => {
    const array = [1, 2, 3, 4, 5];
    clearArray(array);
    expect(array.length).toEqual(0);
    expect(array[0]).toEqual(undefined);
    expect(array[4]).toEqual(undefined);
  });

  test('clear array that contains undefined and null', () => {
    const array = [1, undefined, 3, null, 5];
    clearArray(array);
    expect(array.length).toEqual(0);
    expect(array[0]).toEqual(undefined);
    expect(array[4]).toEqual(undefined);
  });
});

Voici la mise à jour de jsPerf : http://jsperf.com/array-destroy/32 http://jsperf.com/array-destroy/152

jsPerf hors ligne. Repère similaire : https://jsben.ch/hyj65

Answer 4

Une solution plus optimale et plus adaptée aux navigateurs croisés consistera à utiliser la balise splice pour vider le contenu du tableau A comme ci-dessous :

A.splice(0, A.length);

Answer 5

Test de performance :

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