JS去重

博客提及使用 Array.from(new Set(数组)) 进行数组去重,这是信息技术中处理数组的一种常见操作,可有效去除数组中的重复元素。

Array.from(new Set(数组))

### JavaScript 数组方法 在 JavaScript 中,数组是常见的需求。以下是几种常见的数组方法: #### 1. 使用双层循环与 `splice` 方法 通过双层循环检查数组中的复元素,并使用 `splice` 方法删除复项。这种方法会改变原数组[^3]。 ```javascript function noRepeat9(arr) { for (var i = 0; i < arr.length; i++) { for (var j = 0; j < arr.length; j++) { if (arr[i] == arr[j] && i != j) { arr.splice(j, 1); j--; // 调整索引以避免跳过元素 } } } return arr; } var arr = [1, 1, 2, 2, 3, 3, 4, 4, 5, 5, 4, 3, 1, 2, 6, 6, 6, 6]; console.log(noRepeat9(arr)); // [1, 2, 3, 4, 5, 6] ``` #### 2. 使用 `Set` 数据结构 `Set` 是 ES6 引入的一种数据结构,它只允许存储唯一的值。通过将数组转换为 `Set` 再转回数组,可以轻松实现[^2]。 ```javascript function uniqueUsingSet(arr) { return [...new Set(arr)]; } var arr = [1, 1, 'true', 'true', true, true, 15, 15, false, false, undefined, undefined, null, null, NaN, NaN, 'NaN', 0, 0, 'a', 'a', {}, {}]; console.log(uniqueUsingSet(arr)); // [1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, "a", {…}, {…}] ``` 需要注意的是,`Set` 方法无法正确处理对象类型的,例如空对象 `{}`。 #### 3. 使用 `filter` 和 `indexOf` 通过 `filter` 方法结合 `indexOf`,可以筛选出数组中第一次出现的元素,从而实现。 ```javascript function uniqueUsingFilter(arr) { return arr.filter(function (item, index) { return arr.indexOf(item) === index; }); } var arr = [1, 1, 'true', 'true', true, true, 15, 15, false, false, undefined, undefined, null, null, NaN, NaN, 'NaN', 0, 0, 'a', 'a']; console.log(uniqueUsingFilter(arr)); // [1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, "a"] ``` #### 4. 使用 `reduce` 方法 利用 `reduce` 方法遍历数组,并将未复的元素添加到结果数组中。 ```javascript function uniqueUsingReduce(arr) { return arr.reduce((result, item) => { if (!result.includes(item)) { result.push(item); } return result; }, []); } var arr = [1, 1, 'true', 'true', true, true, 15, 15, false, false, undefined, undefined, null, null, NaN, NaN, 'NaN', 0, 0, 'a', 'a']; console.log(uniqueUsingReduce(arr)); // [1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, "a"] ``` #### 5. 使用 `Map` 数据结构 `Map` 可以用于存储键值对,通过判断键是否存在来实现。 ```javascript function uniqueUsingMap(arr) { const map = new Map(); return arr.filter(item => { const key = typeof item + JSON.stringify(item); if (!map.has(key)) { map.set(key, true); return true; } return false; }); } var arr = [1, 1, 'true', 'true', true, true, 15, 15, false, false, undefined, undefined, null, null, NaN, NaN, 'NaN', 0, 0, 'a', 'a', {}, {}]; console.log(uniqueUsingMap(arr)); // [1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, "a", {…}, {…}] ``` 这种方法能够更好地处理复杂数据类型,如对象和数组[^2]。 --- ### 注意事项 - `Set` 方法虽然简洁,但对于对象类型的效果有限。 - 如果需要兼容旧版浏览器,可以使用双层循环或 `filter` 方法。 - 对于大型数组,性能可能会成为问题,需根据实际情况选择合适的方法。 ---
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值