不卖关子,直入主题es6
数组去重,最早想到的即是依次遍历数组,在已遍历的元素中查找是否存在当前数组元素,重点是用什么存放已遍历的数组,以及如何区分当前元素是否已存在算法
因为下面会用到indexOf()的方法,它是ES5语法,低版本会存在兼容,先应添加对应的polyfillsegmentfault
Array.prototype.indexOf = Array.prototype.indexOf || function (searchElement, fromIndex) { var index = -1; fromIndex = fromIndex * 1 || 0; for (var k = 0, length = this.length; k < length; k++) { if (k >= fromIndex && this[k] === searchElement) { index = k; break; } } return index; };
1.数组存放,indexOf()判断数组
遍历数组,创建新数组,利用indexOf判断是否存在于新数组中,不存在则push到新数组,最后返回新数组函数
Array.prototype.unique = function() { var n = []; // 存放已遍历的知足条件的元素 for (var i = 0; i < this.length; i++) { // indexOf()判断当前元素是否已存在 if (n.indexOf(this[i]) == -1) n.push(this[i]); } return n; }
下面是一个思想基本相同的变相版本性能
Array.prototype.unique = function() { // 建立一个新的临时数组,而且把当前数组的第一元素存入到数组中 var n = [this[0]]; // 从第二项开始遍历 for (var i = 1; i < this.length; i++) { // 若是当前数组的第i项在当前数组中第一次出现的位置不是i,那么表示第i项是重复的,忽略掉,不然存入结果数组 if (this.indexOf(this[i]) == i) n.push(this[i]); } return n; }
JS引擎在实现indexOf()的时候会遍历数组直到找到目标为止,此函数会浪费掉不少时间。全部这两种方式都不是最优的解决方式this
// es5简化版 Array.prototype.unique = function() { return this.filter((v, i) => this.indexOf(v) === i) } // es6简化版 Array.prototype.unique = function() { return Array.from(new Set(this)); } // 或 Array.prototype.unique = function() { return [...new Set(this)]; }
2.对象存放,哈希算法(映射)判断es5
Array.prototype.unique = function() { // n为hash表,r为临时数组 var n = {}, r = []; for (var i = 0; i < this.length; i++) { // 若是hash表中没有当前项 if (!n[this[i]]) { // 存入hash表 n[this[i]] = true; // 把当前数组的当前项push到临时数组里面 r.push(this[i]); } } return r; }
但从耗时的角度来说,这是最优的一种解决方式。可是从内存占用角度来讲,这并非最优的,由于多了一个hash表。这就是所谓的空间换时间prototype
3.先排序,后比较code
这种方式最大的优点就是排序后的比较次数变少,可是排序的过程也有性能消耗,应权衡使用
Array.prototype.unique = function() { this.sort(); var re = [this[0]]; for (var i = 1; i < this.length; i++) { if (this[i] !== re[re.length - 1]) { re.push(this[i]); } } return re; }
这个方法的思路是先把数组排序,而后比较相邻的两个值。排序的时候用的JS原生的sort()方法,JS引擎内部应该是用的快速排序吧。这种方式比使用indexOf()的通常姿式要快,比使用hash表的最快姿式要慢,可是占用内存要少
主要内容来自:数组去重的正确编写姿式