`

javascript数组去重

 
阅读更多

转自:http://stylechen.com/array-distinct.html

 

有时会碰上这种需求,需要将数组中重复的元素删除掉,而只保留一个。最先想到的办法很可能就是用2个for循环来做比较然后去除掉重复的元素,代码如下所示:

方法1:

Array.prototype.distinct = function(){
	var arr = [],
	     len = this.length;

	for ( var i = 0; i < len; i++ ){
		for( var j = i+1; j < len; j++ ){
			if( this[i] === this[j] ){
				j = ++i;
			}
		}
		arr.push( this[i] );
	}
	return arr;
};

 

 

使用方法1如果碰到数据比较多时性能上会差很多。那么请继续看下面的方法。

方法2:

 

Array.prototype.distinct = function(){
	
	var self = this,
		arr = self.concat().sort(); // 创建一个新数组并排序
	
	arr.sort(function( a, b ){
		if( a === b ){
			var n = self.indexOf( a ); //获取索引值
			self.splice( n, 1 );
		}
	});
		
	return self;
	
};

 

方法2使用了 sort 的自定义回调函数,也用到了 indexOf 这个IE6/7/8不支持的方法。当然,indexOf可以自己模拟,但是更大的问题是IE6/7/8的sort方法和标准浏览器之间也有差别。在IE6/7/8中使用 sort 方法的自定义回调函数陷阱比较多,上面的自定义 sort 的回调函数的代码在IE6/7/8中会直接报“缺少数字”的错误,回调函数的返回是NaN的话就会报这个错,因为理论上 sort 的回调函数只能返回整数。就算忽略返回值的问题还是有其他问题,最后也没有过多的去纠结了,方法2在IE6/7/8中行不通。

愚人码头那里看来了方法3,下面是他的代码:

方法3:

 

Array.prototype.delRepeat=function(){
	var newArray=[];
	var provisionalTable = {};
	for (var i = 0, item; (item= this[i]) != null; i++) {
        if (!provisionalTable[item]) {
            newArray.push(item);
            provisionalTable[item] = true;
        }
    }
    return newArray;
};

 方法3使用了一个临时的对象来存储数组的元素,如果碰上重复的数组元素,将会忽略掉。但是,如果碰到下面这种数组:

 

var arr = [ 'firefox', 1, '1' ];

 

上面的数组如果用方法3会误将 1 和 “1” 当成重复元素而删除掉,于是有将方法3做了一点点的小修改,可以解决这个BUG。

方法3的修改版:

 

Array.prototype.distinct = function(){
	var arr = [],
		obj = {},
		i = 0,
		len = this.length,
		result;

	for( ; i < len; i++ ){
		result = this[i];
		if( obj[result] !== result ){
			arr.push( result );
			obj[result] = result;
		}
	}

	return arr;
};

 之后又看了愚人码头文章后面的评论,该方法和Rekey提供的方法是一样的,但是这个方法也有BUG,如果碰到这样的2B数组就杯具了:

 

var arr = [ 'firefox', 1, '1', 1 ];

 

上面的数组用方法3的修改版,将不会删除后3个元素,不过这种数组有点极端了,如果碰到字符串字面量和数字相同的数据应该预先处理下以规避这种BUG。使用临时对象的方法比 sort 在标准浏览器中略快,sort 方法在各浏览器中的算法应该也有区别。

原载于:雨夜带刀's Blog
本文链接:http://stylechen.com/array-distinct.html
 
我也补个JSON的例子:
 
 
var json = {1: 'a',2:'b',3:'c',1:'a'};
  var displayArr = [];
  var hash = {};
  for(var site in json){   
       if(!hash[site]){
           displayArr.push(site);
           hash[site] = true;
       }
  }
  alert(displayArr);
 
 

 

 

 

 

分享到:
评论

相关推荐

    JavaScript数组去重功能的设计与实现.pdf

    JavaScript数组去重功能的设计与实现 本文主要讨论了JavaScript数组去重功能的设计与实现,以解决在数据处理过程中产生大量重复数据的问题。文章首先介绍了JavaScript的基本概念,包括ECMAScript、DOM、BOM三个部分...

    php数组去重和js数组去重最简方法

    对于JavaScript数组去重,有多种简单的方法。首先是使用ES6的Set对象,Set类似于数组,但不允许重复值: ```javascript let uniqueArray = [...new Set(array)]; ``` 这段代码首先创建一个Set,然后使用扩展运算符`...

    JavaScript数组去重1

    JavaScript数组去重是编程中常见的需求,特别是在处理数据集合时,确保数据的唯一性非常重要。以下将详细讲解几种常见的JavaScript数组去重方法。 1. **新建数组法**: 这是最基础的方法,通过创建一个新的空数组...

    javascript数组去重小结_.docx

    JavaScript数组去重是编程面试中常见的算法问题,主要目的是消除数组中的重复元素,确保每个元素在结果数组中只出现一次。本文将总结四种常见的JavaScript数组去重方法,并分析它们的优缺点。 首先,我们来看**循环...

    【JavaScript源代码】JavaScript数组去重问题的深入研究.docx

    ### JavaScript数组去重技术深入研究 #### 前言 数组去重是在处理大量数据时经常遇到的问题之一。为了提高程序效率以及代码的可读性和维护性,掌握多种不同的数组去重方法至关重要。 #### 最初的方法:双层循环 ...

    JavaScript Array数组去重源码下载

    JavaScript Array数组去重源码下载

    JavaScript数组去重的方法总结【12种方法,号称史上最全】

    本文实例总结了JavaScript数组去重的方法。分享给大家供大家参考,具体如下: 数组去重,一般都是在面试的时候才会碰到,一般是要求手写数组去重方法的代码。如果是被提问到,数组去重的方法有哪些?你能答出其中的...

    javascript实现数组去重的多种方法_.docx

    javascript 实现数组去重的多种方法_ javascript 实现数组去重的多种方法是指使用javascript 语言实现数组去重的多种方法。数组去重是指将数组中重复的元素删除,得到一个没有重复元素的新数组。下面将介绍多种实现...

    JavaScript数组去重的几种方法

    本文将从几个不同的角度介绍JavaScript数组去重的方法,旨在帮助读者掌握数组去重的技巧。 首先,数组去重的核心思想可以分为两大类。一是通过遍历数组,比较数组内部元素,然后将唯一的元素添加到新的数组中;二是...

    JavaScript 数组去重并统计重复元素出现的次数实例

    通过对数组去重以及统计重复元素出现次数的实现,能够帮助开发者更好地了解JavaScript数组操作。本文提供的两种方法各有优劣,方法一虽然较为繁琐,但兼容性好,适用于低版本的JavaScript环境;方法二简洁高效,但需...

    javascript数组去重3种方法的性能测试与比较

    本文将探讨三种不同的JavaScript数组去重方法,并对它们的性能进行测试和比较。 首先,我们来看第一种方法,这种方法是通过创建一个对象来存储数组元素作为键,利用JavaScript对象的特性,相同的键值不会被覆盖,...

    JavaScript数组去重的6个方法

    本文将介绍6种不同的方法来实现JavaScript数组去重,这些方法适用于不同的场景和需求。 1. **基础方法(O(n^2)**: 这是最直观的方法,通过两层循环检查元素是否存在。首先,创建一个新的空数组`res`,然后遍历原...

    JavaScript学习笔记之数组去重_.docx

    本文将详细介绍几种常见的JavaScript数组去重方法,并通过示例代码展示其实现过程。 #### 二、双重循环去重 ##### 2.1 方法概述 双重循环去重是最直观的一种方法。它的基本思想是使用两个嵌套循环来检查数组中的...

    JavaScript数组去重算法实例小结

    JavaScript数组去重是前端开发中常见的问题之一,尤其是在处理数据时,为了保证数据的唯一性,常常需要去除数组中的重复元素。本文将针对JavaScript数组去重算法进行详细讲解,并通过实例分析去重操作涉及的读写、...

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

    JavaScript数组去重是前端面试酷爱的问题,问题简单而又能看出程序员对计算机程序执行过程的理解如何。数组去重的方法有很多,到底哪种是最理想的我不清楚。于是我测试了下数组去重的效率。测试二十万个数据,随着...

    javascript数组去重方法分析

    本文将详细解析两种JavaScript数组去重的方法,并提供一些额外的在线工具供参考。 ### 方法一:使用`indexOf()`方法 这种方法基于`indexOf()`函数来检测数组中的元素是否已经存在。`indexOf()`返回指定元素在数组...

    JavaScript数组去重的五种方法

    JavaScript数组去重是一个常见的编程问题,特别是在处理数据集合时。以下将详细介绍五种常见的JavaScript数组去重方法: 1. **删除后面重复的**: ```javascript function ov(arr) { for (var i = 0; i ; i++) {...

Global site tag (gtag.js) - Google Analytics