• # 好像不是最全的数组去重方法

这一篇文章，我们讲解一下数组去重。

1.最简单粗暴地方式，两重for循环

``````
let arr = [9, 5, 6, 5, '1', '1', true, 5, true];
for (var i = 0; i &lt; arr.length; i++) {
for (var j = i + 1; j &lt; arr.length; j++) {
if(arr[i] === arr[j]){
arr.splice(j,1);
}
}
}
console.log(arr); // [9, 5, 6, "1", true, undefined, null, NaN, NaN, {…}, {…}]
// 两个NaN, 因为NaN!=NaN
``````

2.indexOf

``````
let a = [];
for (var i = 0; i &lt; arr.length; i++) {
if(a.indexOf(arr[i]) === -1){
a.push(arr[i]);
}
}
console.log(a); // [9, 5, 6, "1", true, undefined, null, NaN, NaN, {…}, {…}]
// 两个NaN, 因为NaN!=NaN
``````

3.includes

``````
for (var i = 0; i &lt; arr.length; i++) {
if(!a.includes(arr[i])){
a.push(arr[i]);
}
}
console.log(a); // [9, 5, 6, "1", true, undefined, null, NaN, {…}, {…}]
``````

4.Set

``````
let a = [...(new Set(arr))];
console.log(a); // [9, 5, 6, "1", true, undefined, null, NaN, {…}, {…}]
``````

5.filter

``````
let a = arr.filter(function(value, index){
return arr.indexOf(value, 0) === index;
})
console.log(a);// [9, 5, 6, "1", true, undefined, null, {…}, {…}]
arr.filter(function(value){
return a.indexOf(value) === -1 ? a.push(value) : a;
})
console.log(a);// [9, 5, 6, "1", true, undefined, null, NaN, NaN, {…}, {…}]
``````

6.sort

``````
arr = arr.sort(); // 排序，如果相同就会挨着
a.push(arr[0]); // 先放数组第一个元素
for (var i = 1; i &lt; arr.length; i++) {
if(arr[i] !== arr[i - 1]){
a.push(arr[i]);
}
}
``````

7.reduce

``````
arr = arr.sort();
arr.reduce(function(preVal, nowVal){
if(preVal !== nowVal){
a.push(preVal);
}
return nowVal;
}, a)
arr.reduce(function(preVal, nowVal){
return a.indexOf(nowVal) === -1 ? a.push(nowVal) : a;
}, a)
console.log(a); //["1", 5, 6, 9, NaN, NaN, {…}, {…}, null, true, undefined]
``````

8.hasOwnProperty

``````
let obj = {};
for (var i = 0; i &lt; arr.length; i++) {
if(!obj.hasOwnProperty(obj[typeof arr[i] + arr[i]])){
obj[typeof arr[i] + arr[i]] = arr[i];
}
}
console.log(Object.values(obj)); //[9, 5, 6, "1", true, undefined, null, NaN, {…}] 无法判断对象
``````

9.对象数组去重方法

``````
let obj = {};
for (var i = 0; i &lt; arr.length; i++) {
if(!obj[typeof arr[i] + arr[i]]){
obj[typeof arr[i] + arr[i]] = arr[i];
}
}
console.log(Object.values(obj)); //[9, 5, 6, "1", true, undefined, null, NaN, {…}]
``````

10.Map

``````
let map = new Map();
for (var i = 0; i &lt; arr.length; i++) {
if(!map.get(arr[i])){
map.set(arr[i], arr[i]);
}
}
console.log(map);
``````

• 补充

我想说一下forEach与map

``````
arr.forEach( function(element, index) {
console.log(element);
});
arr.map(function(element, index){
console.log(element);
});
``````
• 相同点

• 他们都是用来遍历数组的。
• 不同点

• map能有返回值，forEach没有返回值。
``````
let arr = [9,3,6,3,6,3];
arr = arr.forEach( function(element, index) {
return element + 1;
});
console.log(arr); // undefined
arr = arr.map(function(element, index){
return element + 1;
});
console.log(arr); //[10, 4, 7, 4, 7, 4]

``````
• forEach不能中途打断
``````
let arr = [9,3,6,3,6,3];
arr.forEach( function(element, index) {
console.log(element);
if(index === 2){
return; //没用，break,continue会报错是无效的
}
});

``````
• forEach模拟实现

``````
Array.prototype.bforEach = function (fn) {
let array = this;
for (var i = 0; i &lt; array.length; i++) {
fn(array[i], i, array);
}
}
arr.bforEach(function(element, index){
console.log(element); // 9, 3, 6, 3, 6, 3
});
``````
• map模拟实现

``````
Array.prototype.Map = function (fn) {
let array = this,
a = [],
r;
for (var i = 0; i &lt; array.length; i++) {
r = fn(array[i], i, array);
a.push(r);
}
return a;
}
``````

喜欢的可以点一个赞，或者关注一下。鼓励一下一名自学前端的大学生。

• 相关阅读:
Windows7在自由的虚拟机（微软官方虚拟机）
POJ1135_Domino Effect(最短)
项目优化经验分享（七）敏捷开发
POJ 3299 Humidex（简单的问题）
NEFUOJ 500 二分法+最大流量
json 解析解乱码
【设计模式】Abstract Factory模式
汇编语言的应用
Duanxx的STM32学习：NVIC操作
PHP移动互联网的发展票据（6）——MySQL召回数据库基础架构[1]
• 原文地址：https://www.cnblogs.com/qixidi/p/10224722.html