Sujet JavaScript 2 : Déduplication de tableau

Répertoire

• 1. Boucle double couche (méthode de force brute)
• 2.
• 3. Tri et déduplication
• 4. filtre
• 5. Paire clé-valeur (clé-valeur)
• 6. 🎜>7 , certaines questions
• font référence à
• écrites à la fin
(Recommandations d'apprentissage gratuites associées :

)

const unique = (arr)=>{
    for(let i = 0; i {
    var arr = [1, '1', '1', 1, 2, true, false, true, 3, 2, 2, 1];
    var newArr = [];
    for(let i = 0; i 

• O(n^2)Les deux méthodes ci-dessus sont deux parcours de boucles et les méthodes de traitement sont légèrement différentes
• La méthode d'implémentation ci-dessus n'est en effet pas la meilleure choix, mais c'est mieux qu'une bonne compatibilité ~

2.1 indexOf simplifie le jugement de boucle à un niveau

pour supprimer
• indexOf trouve un doublon ( pas égal à la position où il est apparu pour la première fois) >splice : Renvoie un
qui peut trouver un élément donné dans le tableau, ou -1 s'il n'existe pas.
• indexOf第一个索引
• ele : l'élément à trouver indexOf(ele, fromIndex)
  fromIndex : la position de départ de l'élément à trouver, la valeur par défaut est 0, les nombres négatifs sont autorisés, -2 signifie partir de l'avant-dernier element
  • Renvoyer un indice (numéro)
Code :

const unique = (arr) => {
    var res = [];
    for (let i = 0; i <strong>2.2 inclut une boucle simplifiée à un niveau jugement</strong><h5>Point essentiel :</h5><p><strong></strong>Vous pouvez le combiner vous-même, que vous souhaitiez renvoyer le tableau d'origine ou un nouveau tableau~</p>

•  : Utilisé pour déterminer si un tableau contient une valeur spécifiée, selon la situation, s'il est inclus, renvoie
, sinon renvoie
• includestruefalse
• ele : L'élément à trouver includes(ele, fromIndex)
  fromIndex : Lancer la recherche à l'index spécifié. La valeur par défaut est 0. S'il est négatif, faites avancer la valeur absolue des index
  • depuis la fin. .
  • Résultat de retour (bool)fromIndex
Code :

const unique = (arr) => {
    var res = [];
    for (let i = 0; i <strong>2.3 indexOf et inclut pour la sélection du scène actuelle </strong>Ici, nous vous recommandons d'utiliser des inclusions pour rechercher des éléments : <h5></h5><p>La valeur de retour peut être directement utilisée comme instruction conditionnelle de if, de manière concise </p><p></p><pre class="brush:php;toolbar:false">if(res.indexOf(arr[i]) !== -1 ){ todo }// orif(res.includes(arr[i])){ todo }

NaNS'il y a dans le tableau et que vous avez juste besoin de déterminer si le tableau existe

pour déterminer , vous devez utiliser NaNCette méthode. NaN

var arr = [NaN, NaN];arr.indexOf(NaN); // -1arr.includes(NaN); // true

undefined S'il y a une valeur dans le tableau,

valeur vide n'est pas définieundefined, et includesNon.

var arr = new Array(3);console.log(arr.indexOf(undefined)); //-1console.log(arr.includes(undefined)) //true

Point central :

Une fois le tableau trié, pareil. les éléments seront Adjacents, donc si l'élément actuel est différent de ses éléments adjacents, il est stocké dans un nouveau tableau

par rapport à indexOf, un seul niveau de boucle est nécessaire
• concat ; épissez les tableaux et renvoie un nouveau tableau ; le tri
• sort() est effectué en triant en fonction du
• converti en. Il est donc difficile de garantir son exactitude
• 字符串的各个字符的Unicode位点
Code :

var arr = [1, 1, '1'];function unique(arr) {
    var res = [];
    var sortedArr = arr.concat().sort();
    var last;
    for (var i = 0; i <strong></strong>filtre<p><strong>Point central : </strong></p><p><strong>filter : la méthode crée un nouveau tableau qui contient tous les éléments passant le </strong> fourni (renvoie les éléments pour lesquels la fonction de test est établie) </p>

•  : 函数实现的测试
le rappel accepte trois paramètres : element - l'élément en cours de traitement, index - l'index de l'élément actuel, array - le tableau lui-même qui a appelé le filtre
• filter(callback, thisArg)thisArg : lors de l'exécution le rappel, utilisez la valeur de this.
  En utilisant le filtre, nous pouvons simplifier la boucle externe au niveau du code :
  • 
    
  Code :

var arr = [1, 2, 1, 1, '1'];const unique = function (arr) {
    var res = arr.filter(function(item, index, arr){
        return arr.indexOf(item) === index;
    })
    return res;}console.log(unique(arr)); // [ 1, 2, '1' ]

Combiné avec le tri Idée：

var arr = [1, 2, 1, 1, '1'];const unique = function (arr) {
    return arr.concat().sort().filter(function(item, index, arr){
        return !index || item !== arr[index - 1]
    })}console.log(unique(arr));

Les méthodes mentionnées précédemment peuvent être résumées comme suit:

1. Nous proposons une autre manière, en utilisant la valeur-clé de la méthode objet Object pour comptez le nombre d'éléments apparaissant dans le tableau. Il existe deux logiques de jugement préliminaires
2. Prenons

1. 统计每个元素出现的次数，obj：{1: 3, 2: 2, 3: 3}, 返回这个obj的key而不管他们的value
2. 只元素首次出现，再次出现则证明他是重复元素

5.1 统计次数

var arr = [1, 2, 1, 1, '1', 3, 3];const unique = function(arr) {
    var obj = {};
    var res = [];
    arr.forEach(item => {
        if (!obj[item]) {
            obj[item] = true;
            res.push(item);
        }
    });
    return res;}console.log(unique(arr)); // [1, 2, 3]

5.2 结合filter

var arr = [1, 2, 1, 1, '1'];const unique = function(arr) {
    var obj = {};
    return arr.filter(function(item, index, arr){
        return obj.hasOwnProperty(item) ? false : (obj[item] = true)
    })}console.log(unique(arr)); // [1, 2]

5.3 key: value存在的问题

对象的属性是字符串类型的，即本身数字1和字符串‘1’是不同的，但保存到对象中时会发生隐式类型转换，导致去重存在一定的隐患。

考虑到string和number的区别（typeof 1 === ‘number’， typeof ‘1’ === ‘string’），

所以我们可以使用 typeof item + item 拼成字符串作为 key 值来避免这个问题：

var arr = [1, 2, 1, 1, '1', 3, 3, '2'];const unique = function(arr) {
    var obj = {};
    var res = [];
    arr.forEach(item => {
        if (!obj[typeof item + item]) {
            obj[typeof item + item] = true;
            res.push(item);
        }
    });
    return res;}console.log(unique(arr)); // [ 1, 2, '1', 3, '2' ]

六、ES6

随着 ES6 的到来，去重的方法又有了进展，比如我们可以使用 Set 和 Map 数据结构。

6.1 Set

Set：它允许你存储任何类型的唯一值，无论是原始值或者是对象引用

代码：

var arr = [1, 2, 1, '1', '2'];const unique = function(arr) {
   return Array.from(new Set(arr));}console.log(unique(arr)); // [ 1, 2, '1', '2' ]

简化1：

function unique(array) {
    return [...new Set(array)];}

简化2：

var unique = (a) => [...new Set(a)]

6.2 Map

Map 对象保存键值对，并且能够记住键的原始插入顺序。任何值(对象或者原始值) 都可以作为一个键或一个值。

• Map.prototype.has(key)：返回一个布尔值，表示Map实例是否包含键对应的值。
• Map.prototype.set(key, value)：设置Map对象中键的值。返回该Map对象。

function unique (arr) {
    const newMap = new Map()
    return arr.filter((a) => !newMap.has(a) && newMap.set(a, 1));}

写到这里比较常规的数组去重方法就总结的差不多了，如果需要更强大的去重方法，我们需要对他们进行组合，而且因为场景的不同，我们所实现的方法并不一定能涵盖到

相关免费学习推荐：javascript（视频）

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!