Maison > interface Web > js tutoriel > le corps du texte

Comment supprimer des éléments de tableau en javascript

藏色散人
Libérer: 2023-01-05 16:10:48
original
11562 Les gens l'ont consulté

Comment supprimer des éléments de tableau en JavaScript : 1. Supprimer des éléments de tableau via l'attribut length ; 2. Supprimer via la méthode de suppression ; 3. Supprimer via la méthode de pile ; Supprimé via la méthode opérationnelle ; 6.Supprimé via la méthode itérative ; 7.Supprimé via la méthode prototype ;

Comment supprimer des éléments de tableau en javascript

L'environnement d'exploitation de cet article : système Windows 7, version JavaScript 1.8.5, ordinateur Dell G3.

Un résumé de sept méthodes pour supprimer des éléments de tableau en JavaScript

in En JavaScript, outre Object, le type Array est probablement le type le plus couramment utilisé. Il existe une grande différence avec les tableaux des autres langages. Les tableaux en JavaScript sont très flexibles. Aujourd'hui, je vais résumer la méthode de suppression de tableau en JavaScript. Une classification approximative peut être divisée dans les catégories suivantes :
1. longueur
2. suppression
3. méthode de pile
4. méthode de file d'attente
5. méthode d'opération
6. itération méthode
7. Méthode prototype

Ci-dessous, je vais donner des exemples et des explications des méthodes ci-dessus une par une.

1. longueur

JavaScript中Array的length属性非常有特点一一它不是只读的。因此,通过设置这个属性可以从数组的末尾移除项或添加新项,请看下面例子:
Copier après la connexion
var colors = ["red", "blue", "grey"];   //创建一个包含3个字符串的数组colors.length = 2;
console.log(colors[2]);  //undefined
Copier après la connexion

2. mot-clé de suppression

var arr = [1, 2, 3, 4];delete arr[0];console.log(arr);   //[undefined, 2, 3, 4]
Copier après la connexion

On peut voir que la longueur du tableau reste inchangée après la suppression, mais l'élément supprimé est défini sur indéfini.

3. Méthode Stack

var colors = ["red", "blue", "grey"];
var item = colors.pop();
console.log(item);      
//"grey"console.log(colors.length);    
//2
Copier après la connexion

On voit que lorsque la méthode Pop est appelée, le tableau renvoie le dernier élément, qui est "gris", et il n'y en a que deux. éléments restants dans le tableau.

4. Méthode de file d'attente

La règle d'accès à la structure de données de la file d'attente est FIFO (premier entré, premier sorti). La file d'attente ajoute des éléments à la fin de la liste et supprime des éléments. du début de la liste. Utilisez la méthode shift, qui supprime le premier élément du tableau et le renvoie avec la longueur du tableau réduite de 1.

var colors = ["red", "blue", "grey"];
var item = colors.shift();
console.log(item);      
//"red"console.log(colors.length);    
//2
Copier après la connexion

5. Méthode d'opération

splice() est probablement la méthode de tableau la plus puissante. Il existe de nombreuses façons de l'utiliser. Ici, nous introduisons uniquement la méthode de suppression d'éléments de tableau. . Lors de la suppression d'éléments du tableau, il peut supprimer n'importe quel nombre d'éléments. Il vous suffit de spécifier 2 paramètres : la position du premier élément à supprimer et le nombre d'éléments à supprimer. Par exemple, splice(0, 2) sera supprimé. le premier élément du tableau Deux éléments.

var colors = ["red", "blue", "grey"];var item = colors.splice(0, 1);console.log(item);      
//"red"console.log(colors);    
//["blue", "grey"]
Copier après la connexion

[Apprentissage recommandé : Tutoriel JavaScript avancé]

6. méthode itérative Il s'agit d'utiliser une boucle pour parcourir les éléments du tableau et supprimer les éléments qui correspondent aux éléments à supprimer. L'endroit le plus couramment utilisé peut être lorsque les éléments du tableau sont des objets et que les éléments du tableau sont supprimés en fonction de. attributs des objets tels que les identifiants, etc. Deux méthodes sont présentées ci-dessous :

La première utilise la boucle ForEach la plus courante pour comparer les éléments et les supprimer après les avoir trouvés :

var colors = ["red", "blue", "grey"];

colors.forEach(function(item, index, arr) {
    if(item == "red") {
        arr.splice(index, 1);
    }
});
Copier après la connexion

La seconde utilise la méthode de filtrage dans la boucle :

var colors = ["red", "blue", "grey"];

colors = colors.filter(function(item) {
    return item != "red"});

console.log(colors);    
//["blue", "grey"]
Copier après la connexion

Le code est très simple. Découvrez le nombre d'éléments dont les éléments ne sont pas "rouges" et remettez-le en couleurs (en fait, vous obtenez un nouveau tableau), obtenant ainsi l'effet de suppression. .

7. Méthode prototype

Atteindre l'objectif de suppression en ajoutant une méthode au prototype du tableau :

Array.prototype.remove = function(dx) {

    if(isNaN(dx) || dx > this.length){        return false;
    }    for(var i = 0,n = 0;i < this.length; i++) {        if(this[i] != this[dx]) {            this[n++] = this[i];
        }
    }    this.length -= 1;
};var colors = ["red", "blue", "grey"];
colors.remove(1);

console.log(colors);    //["red", "grey"]
Copier après la connexion
Ici, la méthode de suppression est ajoutée au tableau. Objet prototype, tous les objets Array de cet environnement peuvent utiliser cette méthode. Bien que cela soit possible, nous déconseillons de modifier les prototypes d’objets natifs dans les applications de production. La raison est simple. Si vous ajoutez cette méthode au prototype d'un objet natif parce qu'une méthode est manquante dans une implémentation, cela peut provoquer un conflit de nom lorsque le code est exécuté dans une autre implémentation prenant en charge cette méthode. Et cela peut accidentellement conduire à remplacer les méthodes natives.

Ici, j'ai résumé les méthodes couramment utilisées pour supprimer des éléments dans un tableau JavaScript. Tout le monde est invité à les ajouter.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!