1.运用数组的特性

  1.遍历数组,也遍历辅助数组,找出两个数组中是否有相同的项,若有则break,没有的话就push进去。

  

//第一版本数组去重
function unique(arr){
var res = [],
len = arr.length;
for(let i = 0;i < len; i++){
var reslen = res.length;
for(let j = 0;j < reslen; j++){ //遍历辅助数组
if(arr[i] === res[j]){
break;
}
}
if(j === reslen){
res.push(arr[i]); //没有就添加进去
}
}
return res;
}

  

  2.运用es5的indexOf方法

//第二版本数组去重 es5语法, IE8不能用
function unique(arr){
var len = arr.length,
res = [];
for( let i = 0; i < len ; i++){
let val = arr[i];
if(res.indexOf(val) === -1){ //找不到返回-1
res.push(arr[i]);
}
}
return res;
}

  

  3.如果数组已经排好序

function unique(arr){
var len = arr.length;
last,
res = [];
for(let i = 0;i < len; i++){
let val = arr[i];
if(val !== last){ //用last存储上一次的值
res.push(val);
}
last = val;
}
return res;
}

  

  4.留一个接口,传一个参数判断数组是否已经排好序

function unique(arr, isSort){
var len = arr.length,
res = [],
last;
if(isSort !== 'boolean'){
isSort = false;
}
for(let i = 0;i < len; i++){
var val = arr[i];
if(isSort){
if(!i || val!== last){
res.push(val);
}
last = val;
}else{
if(res.indexOf(val) === -1){
res.push(val);
}
}
}
return res;
}

  5.如果有特殊需求的话,留一个接口,更灵活

function unique(arr, isSort, fn){
var res = [],
len = arr.length,
newArr = [],
last;
for(let i = 0;i < len; i++){
var val = arr[i],
com = fn ? fn(val, i, arr) : val;
if(isSort){
if(!i || com === last){
res.push(val);
}
last = com;
}else if(fn){
if(newArr.indexOf(com) === -1){
newArr.push(com);
res.push(val);
}
}else if(res.indexOf(val === -1)){
res.push(val);
}
}
return res;
}

  6.用内部 filter 方法优化

function unique(arr){
var res = [],
res = arr.filter(function(item, index, arr){
return res.indexOf(item) === index; //返回true则添加到数组res,否则不添加
});
return res;
}

2.运用对象的特性

  1.第一种方法

function unique(arr){
var obj = {},
res = [],
res = arr.filter(function (item, index, aee){
return obj.hasOwnProperty(item) ? false : (obj[item] = true);
});
return res
}

  注意: 有一个Bug,var  = [ 1,1,"1",2],不能识别number类型的和string类型,添加到对象中都会转化为string。

  2.第二种方法

 

function unique(arr){
var obj = {},
res = [],
len = arr.length;
res = arr.filter(function (item, index, arr){
return obj.hasOwnProperty(typeof item + item) ? false : (typeof item + item) = true;
});
return res;
}

  注意:这里也有bug,因为typeof的返回类型,检测不了对象。

  3.第三种方法

  运用json方法进行优化。

function unique(arr){
var obj = {},
res = [],
len = arr.length;
res = arr.filter(function (item, index, arr){
return obj.hasOwnProperty(typeof item + JSON.stringify(item)) ? false : (typeof item + JSON.stringify(item)) = true;
})
return res;
}

3.ES6中的Set()对象

function unique(arr){
return [...new Set(arr)];
}

JavaScript数组去重方法汇总的更多相关文章

  1. JavaScript 数组去重 方法汇总

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...

  2. JavaScript数组去重方法及测试结果

    最近看到一些人的去面试web前端,都说碰到过问JavaScript数组去重的问题,我也学习了一下做下总结. 实际上最有代表性也就三种方法:数组双重循环,对象哈希,排序后去重. 这三种方法我都做了性能测 ...

  3. JavaScript 数组去重方法总结

    1.遍历数组法: 这应该是最简单的去重方法(实现思路:新建一新数组,遍历数组,值不在新数组就加入该新数组中) // 遍历数组去重法 function unique(arr){ var _arr = [ ...

  4. javaScript数组去重方法

    在JAvascript平时项目开发中经常会用到数组去重的操作.这时候就要用到JS数组去重的方法了. demo1: 第一种:JS数组去重操作方法是利用遍历原数组,利用数组的indexOf()方法来来判断 ...

  5. js 数组去重方法汇总

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...

  6. JavaScript 数组(Array)方法汇总

    数组(Array)常用方法; 数组常用的方法:concat(),every(), filter(), forEach(),  indexOf(), join(), lastIndexOf(), map ...

  7. JavaScript数组去重方法总结

    一.双重遍历去重 function onlyFigure(arr) { let newarr = []; const length = arr.length for (let i = 0; i < ...

  8. JavaScript实现数组去重方法

    一.利用ES6 Set去重(ES6中最常用) function unique (arr) { return Array.from(new Set(arr)) } var arr = [1,1,'tru ...

  9. JavaScript数组去重的几种方法

    这个老问题,网上普遍都有了,为什么要再写一遍呢,主要是为了记个笔记... 遍历时搜索结果数组 思路很明确,如下 新建一个数组存放结果 循环遍历原数组,对于每一个元素,在结果数组中搜索是否存在 若不存在 ...

随机推荐

  1. 检测Linux硬盘IO数据

    首先安装sysstat(有些系统会预装): apt install sysstat 然后使用命令: iostat -x -k 2 x选项用于显示和io有关的扩展数据 k某些使用block为单位的字段改 ...

  2. Lucene 搜索的初步探究

    搜索应用程序和 Lucene 之间的关系 一般的搜索引擎都会采用这样的 Lucene 采用的是一种称为反向索引(inverted index)的机制.反向索引就是说我们维护了一个词 / 短语表,对于这 ...

  3. maven 项目出现 java.lang.ClassNotFoundException: org.springframework.web.context.ContextLoaderListener

    maven 导入项目中经常出现这个问题 严重: Error configuring application listener of class org.springframework.web.cont ...

  4. gephi安装后无法打开

    具体解决的方法是找到gephi.conf文件(在“gephi安装目录\etc”中)文件,添加下面的一行,指定jdkhome的路径. jdkhome="C:\Program Files (x8 ...

  5. 【BBED】BBED模拟并修复ORA-08102错误

    [BBED]BBED模拟并修复ORA-08102错误 1.1  BLOG文档结构图 1.2  前言部分 1.2.1  导读和注意事项 各位技术爱好者,看完本文后,你可以掌握如下的技能,也可以学到一些其 ...

  6. String类的一些常见的比较方法(4)

    1:boolean equals(Object obj); //比较字符穿的内容是否相同 区分大小写的 2:boolean equalsIgnoreCase(String str); //比较字符穿的 ...

  7. 初次就这么给了你(Django-rest-framework)

    Django-Rest-Framework Django-Rest框架是构建Web API强大而灵活的工具包. 简单粗暴,直奔主题. pip install django pip install dj ...

  8. B树、B+树、B*树

    二叉搜索树 即二叉搜索树: 1.所有非叶子结点至多拥有两个儿子(Left和Right): 2.所有结点存储一个关键字: 3.非叶子结点的左指针指向小于其关键字的子树,右指针指向大于其关键字的子树: 如 ...

  9. Android 导入引用第三方项目

    环境:Android Studio 1.4 1 以源工程形式导入 第一步,导入项目 File--New--Import Module--->设置导入后的项目名称 第二部,在自己工程中添加Depe ...

  10. C#下的两种加密方式MD5和DEC

    md5加密 /// <summary>    /// MD5加密    /// </summary>    /// <param name="toCryStri ...