javascript数组去重有哪几种方式-木庄网络博客

本文摘自PHP中文网，作者青灯夜游，侵删。

去重方式：1、用“Array.from(new Set(arr))”语句；2、用“[…new Set(arr)]”语句；3、用“arr.filter((item,index)=>arr.indexOf(item)===index)”语句。

本教程操作环境：windows7系统、javascript1.8.5版、Dell G3电脑。

JavaScript 数组去重的几种方式

1、Array.from(new Set(arr))

const arr = [1, 2, 3, 2, 3];
 
Array.from(new Set(arr)); // [1, 2, 3]

由于 Set 中的元素是唯一的，无论是原始值或者是对象引用，所以可以通过将数组转换成 Set 对象来实现去重

Array.from方法可以将 Set 对象转换成数组

2、[…new Set(arr)]

1 2	`const arr = [1, 2, 3, 2, 3];` `[...new` `Set(arr)];` `// [1, 2, 3]`

这里是通过 ES6 的展开语法将 Set 对象转换成数组；

3、arr.filter((item, index) => arr.indexOf(item) === index)

const arr = [1, 2, 3, 2, 3];
 
arr.filter((item, index) => arr.indexOf(item) === index); // [1, 2, 3]

indexOf方法返回指定元素在数组中的第一个索引(index)，如果没有则返回 -1

所以这里的 arr 数组中的每个元素通过 indexOf() 方法返回的索引值分别是 0 1 2 1 2

1	`arr.forEach(item => console.log(arr.indexOf(item)));` `// 0 1 2 1 2`

可以通过 indexOf 来实现去重，比如 arr 中的第四个元素 2 通过 indexOf 返回的是索引是 1，但是它当前的 index 下标是 3，不相等，说明当前的这个 2 元素在之前出现过, 所以应该把它过滤掉

【相关推荐：javascript学习教程】

￥83.86元 人民邮电出版社

本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者