js去重的几种方法

344 阅读1分钟

1.ES6的Set去重

    const arr = [1,1,3,4,8,8,9];
    const setData = Array.from(new Set(arr));
    console.log(setData);  //[1,3,4,8,9]

但是Set去重有一个弊端,无法去重对象数组

image.png 所以如果您的数组中都是值类型的数据(比如全string或者全number),那么使用Set进行去重一定是首选,会为您减少很多的麻烦。

2.双重for循环去重

const handleRemoveRepeat = function(arr) {
    for (let i = 0,len = arr.length; i < len;i++) {
            for (let j = i + 1; j<len;j++) {
                    if (arr[i] == arr[j]) {
                            arr.splice(j,1)
                            j--;
                              // j--很关键的一步  如果删除 程序就会出错 
                            //j--的原因是 每次使用splice删除元素时 返回的是一个新的数组 
                            // 这意味这数组下次遍历是 跳过了一个元素
                            /*
                                例如: 第一次删除后 返回的是 1 1 3 2 1 2 4
                             *  但是第二次遍历是 j的值为2  arr[2] = 3,而不是=1
                             *  相当于跳过一个元素 因此要 j--
                             * */
                    }
            }
    }
    return arr;
}
const arr = [1,2,3,4,5,5,5,3,2]
console.log(handleRemoveRepeat(arr))

image.png

3.indexOf去重

function noRepeat2 (arr) {
        const result = [];
        for (let i=0;i<arr.length;i++) {
                if (result.indexOf(arr[i]) === -1) {
                        result.push(arr[i])
                }
        }

            return arr;
    }
    var arr2=noRepeat2(array);
    console.log('arr2',arr2);

4.includes去重

循环数组的每一项,用新数组检测当前数组中是否包含数组项,如果不包含,则追加该元素

function noRepeat3 (arr) {
        const result = [];
        for (let i=0;i<arr.length;i++) {
                if (!result.includes(arr[i])) {
                        result.push(arr[i])
                }
        }

        return arr;
    }

var arr3=noRepeat3(array);
console.log('arr3',arr3);

5.数组对象去重

去重之前的数据如下,

const array = [{
			id:1,
			name:'a'
		},{
			id:1,
			name:'b'
		},{
			id:2,
			name:'c
		}]

去除id相等的项目后的数据如下

 array = [{
                id:1,
                name:'a'
		},{
                id:2,
                name:'c
	}]

实现如下,使用Map实现

	function noRepeat4(arr) {
			const map = new Map()
			const result = [];
			arr.forEach((item,index) => {
				if(!map.has(item.id)) {
					result.push(item)
					map.set(item.id,true)
				}
			})
			return result;
		}

		var arr4=noRepeat4(array2);
		console.log('arr4',arr4);

结果如下

image.png