　　　携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第5天，点击查看活动详情 >>

一、什么是类数组

指一个拥有 length 长度属性，却不能调用数组方法的对象。
arguments、function 以及 DOM 方法返回的结果都是类数组对象。

1. 类数组转数组

ES6：

Array.from(类数组)

ES5：

Array.prototype.slice.call(类数组)

二、数组去重

将数组中重复项内容全部去除，只保留一项。

1. set 去重

const arr = [1, 1, 'true', 'true', true, true, 15, 15, false, false, undefined, undefined,  null, null, NaN, NaN, 'NaN', 0, 0, 'a', 'a', {}, {}]
console.log(Array.from(new Set(arr)))

// 也可以使用扩展运算符简写为
const arr2 = [1, 1, 'true', 'true', true, true, 15, 15, false, false, undefined, undefined,  null, null, NaN, NaN, 'NaN', 0, 0, 'a', 'a', {}, {}]
console.log([...new Set(arr)])

2. 双层 for 嵌套循环比较去重（冒泡算法）

写两层 for 循环，外部循环数组元素，内部循环比较两个数组中的每一项，如果遇到两个相同的值，则删除其中一个。

const arr3 = [1, 1, 'true', 'true', true, true, 15, 15, false, false, undefined, undefined,  null, null, NaN, NaN, 'NaN', 0, 0, 'a', 'a', {}, {}]
for(let i = 0; i < arr3.length; i++){
    // 内部遍历数组当前元素项的之后每项
    for(let j = i+1; j < arr3.length; j++){
        // 判断当前元素项与之后的每项是否相等
        if(arr3[i] == arr3[j]){
            // 如果相等，就将之后与它相同的哪一项删除
            arr3.splice(j, 1)
        }
    }
}
console.log(arr3)

3. 使用 indexOF() 去重

新建一个数组，循环遍历原数组，并在新数组中查找有没有与原数组相同的元素项，如果有则不进行操作，如果没有则将这项 push 到新数组中。

const newArr2 = []
const arr6 = [1, 1, 'true', 'true', true, true, 15, 15, false, false, undefined, undefined,  null, null, NaN, NaN, 'NaN', 0, 0, 'a', 'a', {}, {}]
for(let i = 0; i < arr6.length; i++){
    // 如果使用 indexOf 查不到那就表示新数组中没有此项，也没有重复
    if(newArr2.indexOf(arr6[i]) == -1){
        newArr2.push(arr6[i])
    }
}
console.log(newArr2)

4. 使用 includes() 去重

新建一个数组，循环遍历原数组，并在新数组中查找有没有与原数组相同的元素项，如果有则不进行操作，如果没有则将这项 push 到新数组中。

const arr4 = [1, 1, 'true', 'true', true, true, 15, 15, false, false, undefined, undefined,  null, null, NaN, NaN, 'NaN', 0, 0, 'a', 'a', {}, {}]
const newArr = []
for(let i = 0; i < arr4.length; i++){
    // 在新数组查找就数组组，如果查找不到那么就是没有重复
    if(!newArr.includes(arr4[i])){
        newArr.push(arr4[i])
    }
}
console.log(newArr)

5. 使用 map 数据结构去重

使用 map.get() 方法查找

const arr5 = [1, 1, 'true', 'true', true, true, 15, 15, false, false, undefined, undefined,  null, null, NaN, NaN, 'NaN', 0, 0, 'a', 'a', {}, {}]
let newMap = new Map()
const newArr1 = []
for(let i = 0; i < arr5.length; i++){
    // 使用 map.get() 查找此项是否已在 newMap 中
    if(newMap.get(arr5[i]) == undefined){
        // 往 map 与新数组中同时插入
        newMap.set(arr5[i], arr5[i])
        newArr1.push(arr5[i])
    }
}
console.log(newArr1)

三、数组扁平化

数组扁平化是指讲一个多维数组转为一维数组的操作。

1. 使用ES6 .flat() 实现

flat() 中的选项，表示扁平几次，非正整数，会失效，填入 Infinity 表示扁平所有。

const arr = [1, [2, 3], [4, [5, 6], 7], 8]
// 使用 ES6 flat() 扁平化
console.log(arr.flat(Infinity))

2. 使用数组的 .some() 方法实现

将多维数组遍历出来后使用合并方法和扩展运算符将其赋回原数组。

let arr1 = [1, [2, 3], [4, [5, 6], 7], 8]
// 用 some() 方法循环检测数组中的每一项是否是一个数组，如果是的话
while(arr1.some(Array.isArray)){
    // 则将这个数组展开后合并到一个空数组中，最后赋值回数组
    arr1 = [].concat(...arr1)
}
console.log(arr1)

JS进阶之类数组与数组去重、扁平化