深圳网站建设制作,建设局网站模板,怎么查公司联系方式,泰安网络公司行情目录
es6数组中对象去重
1. filter()用法
2. findIndex()用法
3. 去重
其他方法#xff1a;
方法二#xff1a;reduce()去重
1. reduce()用法
1.1 找出字符长度最长的数组成员。
1.2 扁平化二维数组
1.3 扁平化多维数组 三、总结方案#xff1a;
使用Set#xf…
目录
es6数组中对象去重
1. filter()用法
2. findIndex()用法
3. 去重
其他方法
方法二reduce()去重
1. reduce()用法
1.1 找出字符长度最长的数组成员。
1.2 扁平化二维数组
1.3 扁平化多维数组 三、总结方案
使用SetES6引入的Set数据结构可以用于存储唯一的值。通过将数组转换为Set然后将Set转换回数组可以实现去重。
使用filter()方法和indexOf()方法利用Array的filter()方法和indexOf()方法可以过滤出不重复的元素。
使用reduce()方法和includes()方法利用Array的reduce()方法和includes()方法可以遍历数组并累积不重复的元素。
使用Map利用Map数据结构的特性可以实现数组的去重。 es6数组中对象去重
1. filter()用法
filter()方法返回一个包含符合指定条件的所有元素的新数组。如果没有符合条件的元素则返回空数组。
注意 filter() 不会对空数组进行检测。注意 filter() 不会改变原始数组。
let arr [{id: 1,name: 王五},{id: 2,name: 李赵六}];let nArr arr.filter((value, index, Arr) {console.log(value);console.log(index);console.log(Arr);
});打印结果
{id: 1, name: 王五}
0
[{id: 1, name: 王五},{id: 2, name: 李赵六}]{id: 2, name: 李赵六}
1
[{id: 1, name: 王五},{id: 2, name: 李赵六}]2. findIndex()用法
findIndex()方法返回传入一个测试条件函数符合条件的数组第一个元素位置。findIndex()方法为数组中的每个元素都调用一次函数执行
当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置之后的值不会再调用执行函数。如果没有符合条件的元素返回 -1 注意: findIndex() 对于空数组函数是不会执行的。注意: findIndex() 并没有改变数组的原始值。 [3, 10, 18, 20].findIndex(value value11); // 2 (18的下标是2) [3, 10, 18, 20].findIndex(value value1); // 0 (3的下标是0) [3, 10, 18, 20].findIndex(value value30); // -1 (不存在则返回-1) 3. 去重
let arr [{id: 1,name: 张三},{id: 2,name: 李四},{id: 1,name: 张三},{id: 2,name: 李四}];let nArr arr.filter((currentValue, currentIndex, selfArr) {return selfArr.findIndex(x x.name currentValue.name) currentIndex
});
console.log(nArr);[{id: 1,name: 张三},{id: 2,name: 李四}]
其他方法
var m new Map();
person person.filter((ele) !m.has(ele.id) m.set(ele.id, ));方法二reduce()去重
1. reduce()用法
reduce方法和reduceRight方法依次处理数组的每个成员最终累计为一个值。
区别
reduce是从左到右处理从第一个成员到最后一个成员reduceRight则是从右到左从最后一个成员到第一个成员其他完全一样。
注意:reduce() 对于空数组是不会执行回调函数的。
语法array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
total 累积变量默认为数组的第一个成员currentValue 当前变量默认为数组的第二个成员currentIndex 当前位置从0开始arr 原数组 这四个参数之中只有前两个是必须的后两个则是可选的
// total为最终累计值
let total [1, 2, 3, 4, 5].reduce(function (a, b) {console.log(a, b);return a b;
});
// 1 2
// 3 3
// 6 4
// 10 5
// 15如果要对累积变量指定初值可以把它放在reduce方法和reduceRight方法的第二个参数。
上面的第二个参数相当于设定了默认值处理空数组时尤其有用可避免一些空指针异常。
由于这两个方法会遍历数组所以实际上还可以用来做一些遍历相关的操作。 比如
1.1 找出字符长度最长的数组成员。
function findLongest(entries) {return entries.reduce(function (longest, entry) {return entry.length longest.length ? entry : longest;}, );
}findLongest([aaa, bb, c]) // aaa1.2 扁平化二维数组
let arr [[0, 1], [2, 3], [4, 5]]
let newArr arr.reduce((pre,cur){return pre.concat(cur)
},[])
console.log(newArr); // [0, 1, 2, 3, 4, 5]1.3 扁平化多维数组
let arr [[0, 1], [2, 3], [4,[5,6,7]]]
const newArr function(arr){return arr.reduce((pre,cur)pre.concat(Array.isArray(cur)?newArr(cur):cur),[])
}
console.log(newArr(arr)); //[0, 1, 2, 3, 4, 5, 6, 7]三、总结方案 在JavaScript和es6中介绍一些常见的方法
使用SetES6引入的Set数据结构可以用于存储唯一的值。通过将数组转换为Set然后将Set转换回数组可以实现去重。
const arr [1, 2, 2, 3, 4, 4, 5];
const uniqueArr [...new Set(arr)];
console.log(uniqueArr); // [1, 2, 3, 4, 5]使用filter()方法和indexOf()方法利用Array的filter()方法和indexOf()方法可以过滤出不重复的元素。
const arr [1, 2, 2, 3, 4, 4, 5];
const uniqueArr arr.filter((value, index, self) {return self.indexOf(value) index;
});
console.log(uniqueArr); // [1, 2, 3, 4, 5]
使用reduce()方法和includes()方法利用Array的reduce()方法和includes()方法可以遍历数组并累积不重复的元素。
const arr [1, 2, 2, 3, 4, 4, 5];
const uniqueArr arr.reduce((acc, curr) {if (!acc.includes(curr)) {acc.push(curr);}return acc;
}, []);
console.log(uniqueArr); // [1, 2, 3, 4, 5]
使用Map利用Map数据结构的特性可以实现数组的去重。
const arr [1, 2, 2, 3, 4, 4, 5];
const uniqueArr Array.from(new Map(arr.map(value [value, value])).values());
console.log(uniqueArr); // [1, 2, 3, 4, 5]这些方法都可以实现对数组的去重操作。具体选择哪种方法取决于个人偏好和性能需求。在ES6中引入的Set和箭头函数等特性使得数组去重更加简洁和高效。
