深入了解JavaScript数组去重的五种方法

1. 使用Set去重

JavaScript中的Set是一种不重复的集合,只能存储唯一的值。因此,使用Set去重非常简单,只需将数组转换为Set,然后再将Set转换为数组即可。

const arr = [1, 2, 2, 3, 4, 4, 5];

const newArr = Array.from(new Set(arr));

console.log(newArr); // [1, 2, 3, 4, 5]

以上代码通过 Set 去重的方法实现了数组去重。

1.1 Set特性

Set对象允许存储任何类型的唯一值。值可以是原始类型值或对象引用。

Set 对象中不允许有重复的元素。如果存在重复的元素,只会存储一个元素。

Set 对象中的元素按照插入顺序迭代元素。Set 对象中的迭代顺序与插入顺序相同。

可以通过循环读取Set对象中的元素。

2. 使用filter和indexOf去重

这种方法使用了数组的filter方法和indexOf方法,代码如下:

const arr = [1, 2, 2, 3, 4, 4, 5];

const newArr = arr.filter((item, index) => arr.indexOf(item) === index);

console.log(newArr); // [1, 2, 3, 4, 5]

以上代码通过 filter 和 indexOf 去重的方法实现了数组去重。

2.1 filter方法

filter() 方法创建一个新数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。

2.2 indexOf方法

indexOf() 方法返回在数组中可以找到一个给定元素的第一个索引,如果不存在,则返回-1。

3. 使用reduce和includes去重

这种方法使用了数组的reduce方法和includes方法,代码如下:

const arr = [1, 2, 2, 3, 4, 4, 5];

const newArr = arr.reduce((prev, cur) => prev.includes(cur) ? prev : [...prev, cur], []);

console.log(newArr); // [1, 2, 3, 4, 5]

以上代码通过 reduce 和 includes 去重的方法实现了数组去重。

3.1 reduce方法

reduce() 方法对累加器和数组中的每个元素(从左到右)应用一个函数,以将其减少为单个值。reduce() 可以返回任何值。

3.2 includes方法

includes() 方法用来判断一个数组是否包含一个指定的值,如果是返回 true,否则false。

4. 双重循环去重

这种方法是最基础的去重方法,使用了两个for循环,代码如下:

const arr = [1, 2, 2, 3, 4, 4, 5];

const newArr = [];

for (let i = 0; i < arr.length; i++) {

let isExist = false;

for (let j = 0; j < newArr.length; j++) {

if (arr[i] === newArr[j]) {

isExist = true;

break;

}

}

if (!isExist) newArr.push(arr[i]);

}

console.log(newArr); // [1, 2, 3, 4, 5]

以上代码通过双重循环去重的方法实现了数组去重。

5. map去重

这种方法使用了map来记录数组中的元素是否出现过,代码如下:

const arr = [1, 2, 2, 3, 4, 4, 5];

const hashMap = new Map();

const newArr = [];

for (let i = 0; i < arr.length; i++) {

if (!hashMap.has(arr[i])) {

hashMap.set(arr[i], true);

newArr.push(arr[i]);

}

}

console.log(newArr); // [1, 2, 3, 4, 5]

以上代码通过 map 去重的方法实现了数组去重。

5.1 map方法

JavaScript Map 对象与 Array 对象类似,也是一组有序的键值对的集合。但是与 Array 不同的是,Map 的键不仅可以是字符串和数字,还可以是对象等其他类型。

5.2 Map方法的has()方法

Map 对象的 has() 方法用于查找 Map 中是否存在指定元素,如果存在返回 true,否则返回 false。

5.3 Map方法的set()方法

Map 对象的 set() 方法用于向 Map 对象中添加指定的键值对。

总结

本文介绍了JavaScript中常用的五种数组去重方法,分别是使用Set去重、使用filter和indexOf去重、使用reduce和includes去重、双重循环去重、使用map去重。

从效率上来讲,方法2和方法3比较快,而方法5因为使用了Map,所以内存消耗会更大一些。

在实际开发中,我们应该根据具体情况选择不同的去重方法。

免责声明:本文来自互联网,本站所有信息(包括但不限于文字、视频、音频、数据及图表),不保证该信息的准确性、真实性、完整性、有效性、及时性、原创性等,版权归属于原作者,如无意侵犯媒体或个人知识产权,请来电或致函告之,本站将在第一时间处理。猿码集站发布此文目的在于促进信息交流,此文观点与本站立场无关,不承担任何责任。