Comment vider un tableau en JavaScript

1. Définir un nouveau tableau de taille zéro
2. Utilisez la propriété length pour vider un tableau en JavaScript
3. Utilisez la méthode splice() pour vider un tableau en JavaScript
4. Utilisez la méthode pop() pour vider un tableau en JavaScript
5. Modifier les méthodes natives pour vider un tableau en JavaScript

Le tableau est une collection d’articles stockés dans un ensemble pratique et indexé. Que faire si l’on veut vider un tableau qui contient des éléments multiples ?

Ce tutoriel présente différentes méthodes pour vider un tableau en JavaScript.

Définir un nouveau tableau de taille zéro

C’est le moyen le plus rapide. Cela permettra de définir un nouveau tableau vide.

let Arr = [1, 2, 3, 4];
Arr = [];

C’est simple si vous n’avez pas de référence au tableau original provenant d’autres endroits. Ces références ne seront pas mises à jour si vous le faites, et ces endroits continueront à utiliser l’ancien tableau. Cela signifie que les références au contenu du tableau précédent sont toujours conservées en mémoire, ce qui entraîne des fuites de mémoire.

N’utilisez ceci que si vous faites référence au tableau par sa variable originale Arr.

L’exemple de code ci-dessous montre le problème que vous pouvez rencontrer en utilisant cette méthode :

let Arr1 = [1, 2, 3, 4, 5, 6];
let Arr2 = Arr1;
Arr1 = [];
console.log({Arr1, Arr2});

Production:

{
  Arr1: [],
  Arr2: [1, 2, 3, 4, 5, 6]
}

Utilisez la propriété length pour vider un tableau en JavaScript

Il efface le tableau existant en fixant sa longueur à 0. La propriété de longueur d’un tableau est une propriété de lecture/écriture, elle fonctionne donc également en mode strict dans l’ECMAScript 5.

Arr1.length = 0

Cette méthode présente un avantage car elle supprime tout ce qui se trouve dans le tableau, ce qui a un impact sur les autres références. Si nous avons deux références au même tableau, nous supprimons le contenu du tableau en utilisant Arr1.length = 0, les deux références pointeront maintenant vers le même tableau vide.

Exemple :

let foo1 = [1, 2, 3];
let bar1 = [1, 2, 3];
let foo2 = foo1;
let bar2 = bar1;
foo1 = [];
bar1.length = 0;
console.log({foo1, bar1, foo2, bar2});

Production:

{
  bar1: [],
  bar2: [circular object Array],
  foo1: [],
  foo2: [1, 2, 3]
}

Utilisez la méthode splice() pour vider un tableau en JavaScript

La méthode array.splice() est une méthode intégrée dans JavaScript, qui est utilisée pour ajouter/supprimer des éléments à un tableau et retourne les éléments supprimés.

let Arr1 = ['Tomato', 'Letcuce', 'Spinash', 'Cucumber'];
Arr1.splice(2, 0, 'Lemon', 'Kiwi')
console.log(Arr1);

Production:

["Tomato", "Letcuce", "Lemon", "Kiwi", "Spinash", "Cucumber"]

Pour vider le tableau :

Arr1.splice(0, Arr1.length);
console.log(Arr1);

Production:

[]

Elle supprime tous les éléments du tableau et nettoiera le tableau original.

Utilisez la méthode pop() pour vider un tableau en JavaScript

La méthode pop() supprime le dernier élément d’un tableau et retourne cet élément. Et elle va changer la longueur du tableau.

let vegetables = ['broccoli', 'cauliflower', 'cabbage', 'kale', 'tomato'];

console.log(vegetables.pop());

console.log(vegetables);

Production:

tomato
(4) ["broccoli", "cauliflower", "cabbage", "kale"]

Nous faisons une boucle sur le tableau, nous faisons apparaître l’élément du tableau à chaque boucle, et finalement nous obtenons le tableau vide.

let Arr1 = [1, 2, 3, 4, 5];
for (let i = Arr1.length; i > 0; i--) {
  Arr1.pop();
}
console.log(Arr1);

Production:

[]

Cette solution n’est pas très concise, et c’est aussi la solution la plus lente.

Modifier les méthodes natives pour vider un tableau en JavaScript

La dernière technique de cette liste peut être utilisée avec toutes les méthodes ci-dessus ; JavaScript nous permet de modifier et d’utiliser des méthodes natives pour étendre leurs capacités. Nous pouvons utiliser la fonction Array.proptotype.remove pour modifier le processus.

Dans l’exemple ci-dessous, nous utilisons la méthode splice(), que nous avons utilisée dans l’exemple précédent. Maintenant, nous pouvons utiliser le processus en l’appelant comme la fonction arr.remove().

var arr = [1, 2, 3, 4, 5, 6];

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

arr.remove();
console.log(arr);

Production:

[]