Résumé des méthodes de déduplication de tableau js

Comment dédupliquer des tableaux js : 1. Utilisez ES6 Set pour dédupliquer ; 2. Utilisez for pour imbriquer, puis splice pour dédupliquer ; 3. Utilisez indexOf pour dédupliquer ; 5. Utiliser les caractéristiques des objets dont les attributs ne peuvent pas être les mêmes pour supprimer les doublons, etc.

Recommandé : "Tutoriel vidéo js"

Déduplication de tableau, généralement lors des entretiens Vous rencontrerez ceci parfois, et cela nécessite généralement d'écrire manuellement le code de la méthode de déduplication du tableau. Si on vous le demande, quelles sont les méthodes de déduplication des baies ? Si vous pouvez répondre à 10 d’entre elles, l’intervieweur sera probablement impressionné par vous.
La déduplication de tableau rencontrée dans les projets réels est généralement traitée en arrière-plan, et le front-end est rarement utilisé pour traiter la déduplication de tableau. Bien que la probabilité de l'utiliser dans des projets quotidiens soit relativement faible, vous devez tout de même le connaître au cas où on vous poserait des questions à ce sujet lors de l'entretien.

Remarque : je l'ai écrit à la hâte, et j'ai été un peu occupé ces jours-ci, donc je ne l'ai pas vérifié très attentivement, mais il n'y a aucun problème avec l'idée. Il peut y avoir quelques petits détails. c'est faux.

Méthodes de déduplication des tableaux

1. Utiliser ES6 Définir pour dédupliquer (le plus couramment utilisé dans ES6)

function unique (arr) {
  return Array.from(new Set(arr))
}
var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
console.log(unique(arr))
 //[1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, "a", {}, {}]

Indépendamment de la compatibilité, cette méthode de déduplication a le moins de code . Cette méthode ne peut pas supprimer les objets vides "{}", et les méthodes d'ordre supérieur ultérieures ajouteront des méthodes pour supprimer les "{}" répétés.

2. Utilisez for pour imbriquer, puis épisser pour supprimer les doublons (le plus couramment utilisé dans ES5)

function unique(arr){            
        for(var i=0; i<arr.length; i++){
            for(var j=i+1; j<arr.length; j++){
                if(arr[i]==arr[j]){         //第一个等同于第二个，splice方法删除第二个
                    arr.splice(j,1);
                    j--;
                }
            }
        }
return arr;
}
var arr = [1,1,&#39;true&#39;,&#39;true&#39;,true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,&#39;NaN&#39;, 0, 0, &#39;a&#39;, &#39;a&#39;,{},{}];
    console.log(unique(arr))
    //[1, "true", 15, false, undefined, NaN, NaN, "NaN", "a", {…}, {…}]     //NaN和{}没有去重，两个null直接消失了

Boucle à double niveau, éléments de boucle externe, comparer les valeurs pendant la boucle interne . Si les valeurs sont les mêmes, cette valeur sera supprimée.
Si vous souhaitez apprendre rapidement la syntaxe ES6 plus couramment utilisée, vous pouvez lire mon article précédent "Apprendre les notes ES6 - Syntaxe ES6 couramment utilisée au travail".

3. Utilisez indexOf pour supprimer les doublons

function unique(arr) {
    if (!Array.isArray(arr)) {
        console.log('type error!')
        return
    }
    var array = [];
    for (var i = 0; i < arr.length; i++) {
        if (array .indexOf(arr[i]) === -1) {
            array .push(arr[i])
        }
    }
    return array;
}
var arr = [1,1,&#39;true&#39;,&#39;true&#39;,true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,&#39;NaN&#39;, 0, 0, &#39;a&#39;, &#39;a&#39;,{},{}];
console.log(unique(arr))
   // [1, "true", true, 15, false, undefined, null, NaN, NaN, "NaN", 0, "a", {…}, {…}]  //NaN、{}没有去重

Créez un tableau de résultats vide, bouclez le tableau d'origine et déterminez si l'élément actuel existe dans le tableau de résultats s'il y a les mêmes valeurs. , ignorez-les s'ils ne sont pas identiques, puis insérez-les dans le tableau.

4. Utilisez sort()

function unique(arr) {
    if (!Array.isArray(arr)) {
        console.log('type error!')
        return;
    }
    arr = arr.sort()
    var arrry= [arr[0]];
    for (var i = 1; i < arr.length; i++) {
        if (arr[i] !== arr[i-1]) {
            arrry.push(arr[i]);
        }
    }
    return arrry;
}
     var arr = [1,1,&#39;true&#39;,&#39;true&#39;,true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,&#39;NaN&#39;, 0, 0, &#39;a&#39;, &#39;a&#39;,{},{}];
        console.log(unique(arr))
// [0, 1, 15, "NaN", NaN, NaN, {…}, {…}, "a", false, null, true, "true", undefined]      //NaN、{}没有去重

Utilisez la méthode de tri sort(), puis parcourez et comparez les éléments adjacents en fonction des résultats triés.

5. Utilisez les propriétés des objets qui ne peuvent pas être les mêmes pour dédupliquer (cette méthode de déduplication des tableaux pose des problèmes, n'est pas recommandée et doit être améliorée)

function unique(arr) {
    if (!Array.isArray(arr)) {
        console.log('type error!')
        return
    }
    var arrry= [];
     var  obj = {};
    for (var i = 0; i < arr.length; i++) {
        if (!obj[arr[i]]) {
            arrry.push(arr[i])
            obj[arr[i]] = 1
        } else {
            obj[arr[i]]++
        }
    }
    return arrry;
}
    var arr = [1,1,&#39;true&#39;,&#39;true&#39;,true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,&#39;NaN&#39;, 0, 0, &#39;a&#39;, &#39;a&#39;,{},{}];
        console.log(unique(arr))
//[1, "true", 15, false, undefined, null, NaN, 0, "a", {…}]    //两个true直接去掉了，NaN和{}去重

6.

function unique(arr) {
    if (!Array.isArray(arr)) {
        console.log('type error!')
        return
    }
    var array =[];
    for(var i = 0; i < arr.length; i++) {
            if( !array.includes( arr[i]) ) {//includes 检测数组是否有某个值
                    array.push(arr[i]);
              }
    }
    return array
}
var arr = [1,1,&#39;true&#39;,&#39;true&#39;,true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,&#39;NaN&#39;, 0, 0, &#39;a&#39;, &#39;a&#39;,{},{}];
    console.log(unique(arr))
    //[1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, "a", {…}, {…}]     //{}没有去重

7. Utilisez hasOwnProperty

function unique(arr) {
    var obj = {};
    return arr.filter(function(item, index, arr){
        return obj.hasOwnProperty(typeof item + item) ? false : (obj[typeof item + item] = true)
    })
}
    var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
        console.log(unique(arr))
//[1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, "a", {…}]   //所有的都去重了

Utilisez hasOwnProperty pour déterminer s'il existe des propriétés d'objet

8 Utilisez le filtre

function unique(arr) {
  return arr.filter(function(item, index, arr) {
    //当前元素，在原始数组中的第一个索引==当前索引值，否则返回当前元素
    return arr.indexOf(item, 0) === index;
  });
}
    var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
        console.log(unique(arr))
//[1, "true", true, 15, false, undefined, null, "NaN", 0, "a", {…}, {…}]

Utilisez la récursivité pour supprimer. duplicates

function unique(arr) {
        var array= arr;
        var len = array.length;

    array.sort(function(a,b){   //排序后更加方便去重
        return a - b;
    })

    function loop(index){
        if(index >= 1){
            if(array[index] === array[index-1]){
                array.splice(index,1);
            }
            loop(index - 1);    //递归loop，然后数组去重
        }
    }
    loop(len-1);
    return array;
}
 var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
console.log(unique(arr))
//[1, "a", "true", true, 15, false, 1, {…}, null, NaN, NaN, "NaN", 0, "a", {…}, undefined]

10. Utilisez la structure de données Map pour dédupliquer

function arrayNonRepeatfy(arr) {
  let map = new Map();
  let array = new Array();  // 数组用于返回结果
  for (let i = 0; i < arr.length; i++) {
    if(map .has(arr[i])) {  // 如果有该key值
      map .set(arr[i], true); 
    } else { 
      map .set(arr[i], false);   // 如果没有该key值
      array .push(arr[i]);
    }
  } 
  return array ;
}
 var arr = [1,1,&#39;true&#39;,&#39;true&#39;,true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,&#39;NaN&#39;, 0, 0, &#39;a&#39;, &#39;a&#39;,{},{}];
    console.log(unique(arr))
//[1, "a", "true", true, 15, false, 1, {…}, null, NaN, NaN, "NaN", 0, "a", {…}, undefined]

Créez une structure de données Map vide, parcourez le tableau qui doit être dédupliqué et stockez chaque élément du tableau en tant que clé dans la carte. Étant donné que la même valeur de clé n'apparaîtra pas dans la carte, le résultat final est le résultat après déduplication.

11. Utiliser réduire+includes

function unique(arr){
    return arr.reduce((prev,cur) => prev.includes(cur) ? prev : [...prev,cur],[]);
}
var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
console.log(unique(arr));
// [1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, "a", {…}, {…}]

12 [...new Set(arr)]

[...new Set(arr)] 
//代码就是这么少----（其实，严格来说并不算是一种，相对于第一种方法来说只是简化了代码）

PS : Certains articles mentionnés foreach+indexOf array Personnellement, je Je pense que les méthodes pour supprimer les doublons sont similaires, donc je ne les ai pas écrites.

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!