js数组去重的三种方式的比较

时间:2023-01-30 08:32:18

做前端的,一般实现功能是主要的,但是重中之重却是在做到功能完善的情况下提高性能。

1、遍历数组法

实现的思路:构建一个新的数组存放结果,for循环中每次从原数组中取出一个元素,用这个元素循环与结果数组对比,若结果数组中没有该元素,则存到结果数组中

<script>
 Array.prototype.unique1 = function(){
 var res = [this[0]];
 for(var i = 1; i < this.length; i++){
  var repeat = false;
  for(var j = 0; j < res.length; j++){
   if(this[i] == res[j]){
    repeat = true;
    break;
   }
  }
  if(!repeat){
   res.push(this[i]);
  }
 }
 return res;
}
var arr = [1, 'a', 'a', 'b', 'd', 'e', 'e', 1, 0]
alert(arr.unique1());
</script>

结果截图

js数组去重的三种方式的比较

2、排序后相邻去除法

实现思路:

思路:先将原数组进行排序,检查原数组中的第i个元素 与 结果数组中的最后一个元素是否相同,因为已经排序,所以重复元素会在相邻位置。如果不相同,则将该元素存入结果数组中

 

function unique4(array){ 
array.sort(); 
var re=[array[0]]; 
for(var i = 1; i < array.length; i++){ 
if( array[i] !== re[re.length-1]){ 
  re.push(array[i]); 
 } 
 } 
 return re; 
} 
var arr = [1, 'a', 'a', 'b', 'd', 'e', 'e', 1, 0];
alert(unique4(arr));
</script>

结果截图:

js数组去重的三种方式的比较

 

3、对象键值对法

实现思路:

创建一个新的数组存放结果创建一个空对象;for循环时,每次取出一个元素与对象进行对比,如果这个元素不重复,则把它存放到结果数组中,同时把这个元素的内容作为对象的一个属性,并赋值为1,存入到第2步建立的对象中。

 

// 速度最快, 占空间最多
Array.prototype.unique3 = function(){ var res = []; var json = {}; for(var i = 0; i < this.length; i++){ if(!json[this[i]]){ res.push(this[i]); json[this[i]] = 1; } } return res; } var arr = [112,112,34,'你好',112,112,34,'你好','str','str1']; alert(arr.unique3());

结果截图:

js数组去重的三种方式的比较