对象数组去重方法(javascript 数组去重)

对象数组去重方法(javascript 数组去重)

扫码添加渲大师小管家,免费领取渲染插件、素材、模型、教程合集大礼包!

大家好,今天来介绍对象数组去重方法(数组去重方法 js)的问题,以下是渲大师小编对此问题的归纳和整理,感兴趣的来一起看看吧!

JavaScript数组去重的几种方法效率测试

以下是我针对网上三种高效率方法总结与效率测试,如果大家有更好的意见或建议也可以提出,大家共勉学习。
数组去重法1:
Array.prototype.unique1 = function(){
console.time("数组去重法1"); //记录开始执行的时间
var arr = [];//创建一个临时数组
var obj = {}; //创建一个空对象
for(var i = 0; i < this.length; i++){ //遍历当前要去重的数组
if(!obj[this[i]]){ //判断obj对象中是否存有当前项,没有则执行
arr.push(this[i]); //将当前项push到临时数组中
obj[this[i]] = 1; //将当前项存入obj对象
}
}
console.timeEnd("数组去重法1"); //记录结束执行的时间
return arr;
}

数组去重法2:
Array.prototype.unique2 = function(){
console.time("数组去重法2"); //记录开始执行的时间
var arr = []; //创建一个临时数组
for(var i = 0; i < this.length; i++){ //遍历当前要去重的数组
if(arr.indexOf(this[i]) == -1){ //判断临时数组中是否存有当前项,没有则执行
arr.push(this[i]); //将当前项push到临时数组中
}
}
console.timeEnd("数组去重法2"); //记录结束执行的时间
return arr;
}

数组去重法3:
Array.prototype.unique3 = function(){
console.time("数组去重法3"); //记录开始执行的时间
var arr = [this[0]]; //创建一个临时数组,并将要去重数组的第一项存入临时数组
for(var i = 1; i < this.length; i++) { //从要去重数组第二项开始遍历
if (this.indexOf(this[i]) == i){ //判断则衫兆临时数组中是否存有当前项,没有则执行
arr.push(this[i]); //将当孙租前项push到临时数组中
}
}
console.timeEnd("数组去重法3"); //记录结束执行的时间
return arr;
}

效率测试方法:
var arr1 = []; //创建一个要去重的数组
for(var i = 0; i < 200000; i++){ //遍历200000个数据
arr1.push(parseInt(Math.random() * 10) + 1); //将所有数据返回为随机数(1-10之间)的数, 并push到要去重的数组中
}

console.log(arr1.unique1()); //打塌简印数组去重法1的执行时间
console.log(arr1.unique2()); //打印数组去重法2的执行时间
console.log(arr1.unique3()); //打印数组去重法3的执行时间

效率测试结果:

对象数组去重方法(javascript 数组去重)

数组去重

数组去重是一个经常会用到的方法,我写了一个测试模板,测枣漏试一下常见的数据去重的方法的性能搜岩喊

测试模板

1、Array.filter() + indexOf
方法思路:将两个数组拼接为一个数组,然后使用 ES6 中的 Array.filter() 遍历数组,并结世野合 indexOf 来排除重复项

2、双重 for 循环
方法思路:外层循环遍历元素,内层循环检查是否重复,当有重复值的时候,可以使用 push(),也可以使用 splice()

3、for...of + includes()
方法思路:双重for循环的升级版,外层用 for...of 语句替换 for 循环,把内层循环改为 includes()。先创建一个空数组,当 includes() 返回 false 的时候,就将该元素 push 到空数组中 。类似的,还可以用 indexOf() 来替代 includes()

4、Array.sort()
方法思路:首先使用 sort() 将数组进行排序,然后比较相邻元素是否相等,从而排除重复项

5、new Set()
ES6 新增了 Set 这一数据结构,类似于数组,但Set 的成员具有唯一性

6、for...of + Object
方法思路:首先创建一个空对象,然后用 for 循环遍历,利用对象的属性不会重复这一特性,校验数组元素是否重复

测试结果一目了然,几种方法的性能 6>5>4>3>1>2

数组去重的5种方法

数组去重的滑雀5种方法:

方法一:

双重for循环去重

原理 两两比较如果相等的话就删除第二个

例如: 1 1 1 3 2 1 2 4

先让第一个1 即arr[0]与后面的一个个比较 如果后面的值信禅早等于arr[0] 删除后面的值

第一次袭拦结束后的结果是 1 3 2 2 4 删除了后面所有的1

同理 第二次 第三会删除与自己相同的元素

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

function noRepeat1(arr){

// 第一层for用来控制循环的次数

for(var i=0; i<arr.length; i++){

//第二层for 用于控制与第一层比较的元素

for(var j=i+1; j<arr.length; j++){

//如果相等

if(arr[i] == arr[j]){

//删除后面的 即第 j个位置上的元素 删除个数 1 个

arr.splice(j,1);

// j--很关键的一步 如果删除 程序就会出错

//j--的原因是 每次使用splice删除元素时 返回的是一个新的数组

// 这意味这数组下次遍历是 比较市跳过了一个元素

/*

例如: 第一次删除后 返回的是 1 1 3 2 1 2 4

* 但是第二次遍历是 j的值为2 arr[2] = 3

* 相当于跳过一个元素 因此要 j--

* */

j--;

}

}

}

return arr;

}

方法二:

单层for循环

原理和方法一相似

1

2

3

4

5

6

7

8

9

10

11

12

13

function norepeat(arr){

arr.sort();

//先排序让大概相同的在一个位置,这里为什么说是大概相同 是因为sort排序是把元素当字符串排序的 它和可能排成 1 1 10 11 2 20 3 ... 不是我们想要的从小到大

for(var i = 0; i < arr.length-1;i++){

//还是两两比较 一样删除后面的

if(arr[i]==arr[i+1]){

arr.splice(i,1);

//i-- 和j--同理

i--;

}

}

return arr;

}

方法三:

原理:用一个空数组去存首次出现的元素
利用 indexOf 属性 indexOf是返回某个指定的字符在字符串中出现的位置,如果没有就会返回-1
因此我们可以很好的利用这个属性 当返回的是 -1时 就让其存入数组

1

2

3

4

5

6

7

8

9

function noRepeat2(arr){

var newArr = [];

for(var i = 0; i < arr.length; i++){

if(newArr.indexOf(arr[i]) == -1){

newArr.push(arr[i]);

}

}

return newArr;

}

方法四:

原理:利用对象的思想,如果对象里没有这个属性的话就会返回undefined
利用这个原理当返回的是undefined时让其放入数组然后在给这个属性赋值

1

2

3

4

5

6

7

8

9

10

11

function norepeat3(arr) {

var obj = {};

var newArr = [];

for(var i = 0; i < arr.length; i++) {

if(obj[arr[i]] == undefined) {

newArr.push(arr[i]);

obj[arr[i]] = 1;

}

}

return newArr;

}

方法五:

原理:循环比较如果相等的让后面的元素值为0,最后在输出的时候删除为0的这个前提是你的数据里不能有0,但是凡事可以变通你可以设置任何值替代这个0,这个方法是我当时想到实现的所以没有进行很好的优化。

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

var newArr = [];

//控制外循环

for(var i=0; i<arr.length-1;i++){

//内存循环 只比较后面的

for(j=i+1;j<arr.length;j++){

//如果相等就让其值等于0

if(arr[i]==arr[j]){

arr[j]=0;

}

}

//去除值为0的

if(arr[i]==0){

continue;

}else{

//放入新的数组

newArr.push(arr[i]);

}

}

推荐教程:《PHP视频教程》

以上就是数组去重的5种方法有哪些?的详细内容,更多请关注php中文网其它相关文章!

js中数组去重方法总结

1.es6有了Set,可以通过成员唯数漏一性去重

2.使用数组对象的lastIndexOf()方法。
(关于lastIndexOf():( https://www.jianshu.com/p/d75886bc6c75 )

3.定义新数组,存入原数组第一个元素,卖毕拦再将原数组元素和新数组元素比较,不同的继续push到新数组。

4.splice()方法从数组中添加/删除重复值。

5.使用includes()方法{ps:可搭配foreach()方法filter()方法;}。

6.采用indexOf()获取索引查询去重

7.利用对象属性存在与中胡否判断,这个方法没什么意思,但是也可行

分享到 :
相关推荐

图片懒加载怎么实现(vue图片懒加载的实现原理)

1、图片懒加载怎么实现图片懒加载是一种用于优化网页性能的技术。它的原理是在页面加载[...

js的splice方法三个参数代表什么

js的splice方法三个参数代表什么JavaScript中的splice()方法[...

google浏览器删除cookie(google浏览器删除历史记录里面没有删除浏览器数据)

1、google浏览器删除cookieGoogle浏览器(也称为Chrome浏览器[...

java锁机制的实现方式(java实现锁的几种方式)

1、java锁机制的实现方式Java中的锁机制是2、java实现锁的几种方式在[&h...

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注