js常用的几种数组去重方法详解

2022-02-20 08:15:02

数组去重

描述:从数组中找到相同的元素,并将相同的元素删除;保证数组中的每个元素都是独一无二的操作。

a.基本方法

基本思想:定义一个新数组,并存放原数组的第一个元素,再将其和原数组一一对比,若新数组里的元素和原数组里的元素不相同,则将原数组里的元素存入新数组

function unique(arr) {
            //初始化时,使新数组的第一个元素为原数组的第一个元素
            let newArr = [arr[0]];
            //遍历原数组
            for (let i = 1; i < arr.length; i++) {
                let flag = false;
                //遍历新数组
                for (let j = 0; j < newArr.length; j++) {
                    //判断新数组当中是否含有与原数组相同的元素,如果有则跳过
                    //如果没有,则将原数组中的元素放入新数组里即可
                    if (arr[i] === newArr[j]) {
                        flag = true;
                        break;
                    }
                }
                if (!flag) {
                    newArr.push(arr[i]);
                }
            }

            return newArr;
        }

console.log(unique(['a', 'd', 'a', 'b', 'r', 'b']));

b. 利用sort()方法

基本思想:首先,利用sort()方法对原数组进行排序;其次,再定义一个新数组并使新数组里的第一个元素等于原数组里的第一个元素;再者,比较新数组里的元素是否和原数组里的元素相同;最后,不相同则存入新数组反之舍去

arr = ['a', 'd', 'a', 'b', 'r', 'b'];
        //存入排序过后的数组
        let formArr = arr.sort();
        // console.log(formArr);
        //定义一个新数组,并使新数组中的第一个元素等于原数组中的第一个元素
        let newArr = [formArr[0]];
        //循环遍历排序过后的数组,并判断其里面的元素与新数组里面的元素是否相等
        //若不相等,则将其放入新数组,反之舍弃
        for (let i = 1; i < formArr.length; i++) {
            if (formArr[i] !== formArr[i - 1]) {
                newArr.push(formArr[i]);
            }
        }
console.log(newArr);

c.对象属性是否存在(hash表数组去重)

基本思想:利用对象属性的唯一性,将原数组的值当做对象的属性

哈希表:散列值表,无序的键值对集合。

let arr = ['a', 'd', 'a', 'b', 'r', 'b'];
        let obj = {};
        var newArr = [];
        //循环遍历
        for (let i = 0; i < arr.length; i++) {
            //将原数组里面的值作为对象的属性
            if (!obj[arr[i]]) {
                obj[arr[i]] = true; //属性“占位”
                newArr.push(arr[i]);
            }
        }
console.log(newArr);

d.indexof()

基本思想:利用数组的indexOf方法,目的是寻找存入参数在数组中第一次出现的位置。

缺点:实现这个方法的时候会遍历数组直到找到目标为止,消耗掉很多时间。

特点:牺牲时间换空间

<script>
        var arr = ['a', 'd', 'a', 'b', 'r', 'b'];
        var finalArr = [];
        // 循环判断
        for (var i = 0; i < arr.length; i++) {
            //只要arr中的元素不在finaArr里就把arr中的元素存入finaArr里
            // 最后finalArr中的元素就是arr中不重复的元素了
            if (finalArr.indexOf(arr[i]) == -1) {
                finalArr.push(arr[i]);
            }
        }
        console.log(finalArr);
</script>

e.includes()

基本思想:利用数组原型上的includes()方法来判断新数组里是否包含和原数组里相同的元素,如果不包含,则将该元素放入新数组,反之舍弃

let arr = ['a', 'd', 'a', 'b', 'r', 'b'];
        let newArr = [];
        //循环遍历
        for (let i = 0; i < arr.length; i++) {
            //如果新数组里的元素里不包括原数组里的元素,则把该元素放入新数组,反之舍弃
            if (!newArr.includes(arr[i])) {
                newArr.push(arr[i]);
            }
        }
console.log(newArr);

f.filter()和includes()

基本思想:利用数组原型上的 filter() 和 includes() 方法

let arr = ['a', 'd', 'a', 'b', 'r', 'b'];
        let newArr = [];
        newArr = arr.filter((item) => {
            return newArr.includes(item) ? '' : newArr.push(item);
        })

console.log(newArr);

g.forEach()和includes()

基本思想:利用数组原型上的forEach()和includes()

let arr = ['a', 'd', 'a', 'b', 'r', 'b'];
        let newArr = [];
        arr.forEach((item) => {
            return newArr.includes(item) ? '' : newArr.push(item);
        })

console.log(newArr);

h.lastIndexOf()

基本思想:与indexOf()类似

var arr = ['a', 'd', 'a', 'b', 'r', 'b'];
        var newArr = [];
        // 循环判断
        for (var i = 0; i < arr.length; i++) {
            //只要arr中的元素不在newArr里就把arr中的元素存入newArr里
            // 最后newArr中的元素就是arr中不重复的元素了
            if (newArr.lastIndexOf(arr[i]) == -1) {
                newArr.push(arr[i]);
            }
        }
console.log(newArr);

i.set()

基本思想:set数据结构,类似于类数组,其成员的值都是唯一的

var arr = ['a', 'd', 'a', 'b', 'r', 'b'];
// Array.from 将一个类数组对象或者可遍历对象转换成一个真正的数组
console.log(Array.from(new Set(arr)));

  • 作者:小白小白从不日白
  • 原文链接:https://blog.csdn.net/weixin_43285360/article/details/116198209
    更新时间:2022-02-20 08:15:02