几种一维基本数据类型的数组去重

前端-卡布达

已于 2022-04-05 19:00:45 修改

阅读量409

点赞数

分类专栏： JavaScript 文章标签： javascript 前端

于 2021-12-04 11:00:25 首次发布

本文链接：https://blog.csdn.net/fsfsdgsdg/article/details/121712537

版权

JavaScript 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

本文详细介绍了JavaScript中去除数组重复元素的四种常见方法，包括使用ES6的Set、filter、forEach以及对象的特性。每种方法都有其适用场景和特点，例如Set的便捷性，filter和indexOf的对比检查，以及利用对象属性唯一性的去重策略。通过实例代码展示，帮助读者理解和掌握这些去重技巧。

摘要由CSDN通过智能技术生成

let arr = [1, 2, 2, 4, 5, 6, "A", "B", "B"];
let arr1 = [1, 2, 2, 4, 5, 6, "A", "B", "B"];

/***
 *方式一：Es6中set方法
 * 说明：
 *   1、set方法是es6中新增的数据类型，其结构类似于数组，但是相比起来其元素是唯一的
 *   2、可用于数组、字符串去重
 */
 let newOneArr = [...new Set(arr)];
 console.log("方式一结果：", newOneArr);
 
 //  字符串去重
 let newString = [...new Set('ababbc')].join('');
 console.log("去重后字符串",newString);



/***
 *方式二：数组的filter方法结合数组的indexOf方法
 * 说明：
 *   1、filter用于过滤，将符合callback里面条件的元素组合起来 创建返回一个新的数组
 *   2、indexOf方法返回在数组中匹配到的第一个元素的索引,如果不存在返回-1
 *   3、此方式就是比较出现的位置，如果出现的位置不一致，则表明数据重复
 */
let newTwoArr = arr.filter((item, index) => {
    return arr.indexOf(item) === index;
});
console.log("方式二结果：", newTwoArr);


/***
 *方式三：forEach循环结合数组的indexOf方法
 * 说明：
 *   1、创建一个新的数组，然后把当前想要去重的这个数组中的每一位都循环判断一下是否在新数组中，如果不在，就添加到新数组
 */
 let newThreeArr = [];
 arr.forEach(item=>{
     if (newThreeArr.indexOf(item) === -1) {
        newThreeArr.push(item);
     }
 });
console.log("方式三结果：", newThreeArr);



/***
 *方式四：对象的特性去重
 * 说明：
 *   1、利用对象的key是唯一的属性，可利用这个特性进行去重
 */
 let obj = {};
 arr.forEach(item=>{
    obj[item]  = item;
 });
//  将对象的属性值变成数组
 var newFourArr = Object.values(obj);
console.log("方式四结果：", newFourArr);