1.运用数组的特性

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

  

  1. //第一版本数组去重
  2. function unique(arr){
  3. var res = [],
  4. len = arr.length;
  5. for(let i = 0;i < len; i++){
  6. var reslen = res.length;
  7. for(let j = 0;j < reslen; j++){ //遍历辅助数组
  8. if(arr[i] === res[j]){
  9. break;
  10. }
  11. }
  12. if(j === reslen){
  13. res.push(arr[i]); //没有就添加进去
  14. }
  15. }
  16. return res;
  17. }

  

  2.运用es5的indexOf方法

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

  

  3.如果数组已经排好序

  1. function unique(arr){
  2. var len = arr.length;
  3. last,
  4. res = [];
  5. for(let i = 0;i < len; i++){
  6. let val = arr[i];
  7. if(val !== last){ //用last存储上一次的值
  8. res.push(val);
  9. }
  10. last = val;
  11. }
  12. return res;
  13. }

  

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

  1. function unique(arr, isSort){
  2. var len = arr.length,
  3. res = [],
  4. last;
  5. if(isSort !== 'boolean'){
  6. isSort = false;
  7. }
  8. for(let i = 0;i < len; i++){
  9. var val = arr[i];
  10. if(isSort){
  11. if(!i || val!== last){
  12. res.push(val);
  13. }
  14. last = val;
  15. }else{
  16. if(res.indexOf(val) === -1){
  17. res.push(val);
  18. }
  19. }
  20. }
  21. return res;
  22. }

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

  1. function unique(arr, isSort, fn){
  2. var res = [],
  3. len = arr.length,
  4. newArr = [],
  5. last;
  6. for(let i = 0;i < len; i++){
  7. var val = arr[i],
  8. com = fn ? fn(val, i, arr) : val;
  9. if(isSort){
  10. if(!i || com === last){
  11. res.push(val);
  12. }
  13. last = com;
  14. }else if(fn){
  15. if(newArr.indexOf(com) === -1){
  16. newArr.push(com);
  17. res.push(val);
  18. }
  19. }else if(res.indexOf(val === -1)){
  20. res.push(val);
  21. }
  22. }
  23. return res;
  24. }

  6.用内部 filter 方法优化

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

2.运用对象的特性

  1.第一种方法

  1. function unique(arr){
  2. var obj = {},
  3. res = [],
  4. res = arr.filter(function (item, index, aee){
  5. return obj.hasOwnProperty(item) ? false : (obj[item] = true);
  6. });
  7. return res
  8. }

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

  2.第二种方法

 

  1. function unique(arr){
  2. var obj = {},
  3. res = [],
  4. len = arr.length;
  5. res = arr.filter(function (item, index, arr){
  6. return obj.hasOwnProperty(typeof item + item) ? false : (typeof item + item) = true;
  7. });
  8. return res;
  9. }

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

  3.第三种方法

  运用json方法进行优化。

  1. function unique(arr){
  2. var obj = {},
  3. res = [],
  4. len = arr.length;
  5. res = arr.filter(function (item, index, arr){
  6. return obj.hasOwnProperty(typeof item + JSON.stringify(item)) ? false : (typeof item + JSON.stringify(item)) = true;
  7. })
  8. return res;
  9. }

3.ES6中的Set()对象

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

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. kettle工具实现报表导出的初步搭建

    1.下载kettle 国外网站:http://kettle.pentaho.org/需要FQ,下载慢 2.下载完成启动(windows)-->spoon.bat 3.进入界面,两个主要的tab页 ...

  2. mysql、mariadb安装和多实例配置

    本文目录:1. mysql单实例安装 1.1 rpm安装mysql 1.2 通用二进制包安装mysql 1.2.1 初始化数据库 1.2.2 安装后的规范化操作 1.3 编译安装 1.3.1 编译安装 ...

  3. iOS蓝牙心得

    1.获取蓝牙mac地址 因为安卓不能得到uuid,所以,在要同步的时候要将uuid转换成mac地址,下面是转换方法 [peripheral discoverServices:@[[CBUUID UUI ...

  4. 15.linux-LCD层次分析(详解)

    如果我们的系统要用GUI(图形界面接口),这时LCD设备驱动程序就应该编写成frambuffer接口,而不是像之前那样只编写操作底层的LCD控制器接口. 什么是frambuffer设备? frambu ...

  5. 【重点突破】——Canvas技术绘制随机改变的验证码

    一.引言 本文主要是我在学习Canvas技术绘图时的一个小练习,绘制随机改变的验证码图片,虽然真正的项目里不这么做,但这个练习是一个掌握Canvas技术很好的综合练习.(真正的项目中验证码图片使用服务 ...

  6. JavaWeb(一)Servlet中的ServletConfig与ServletContext

    前言 前面我介绍了一下什么是servlet,它的生命周期,执行过程和它的原理.这里我们做一个简单的回顾! 什么是Servlet? servlet 是运行在 Web 服务器中的小型 Java 程序(即: ...

  7. OpenCV探索之路(二十六):如何去除票据上的印章

    最近在做票据的识别的编码工作时遇到一些问题,就是票据上往往会有一些红色印章把一些重要信息区域给覆盖了,比如一些开发票人员盖印章时比较随意,容易吧一些关键区域给遮蔽了,这让接下来的票据识别很困难,因此, ...

  8. 深入浅出AQS之组件概览

    之前分析了AQS中的独占锁,共享锁,条件队列三大模块,现在从结构上来看看AQS各个组件的情况. 原文地址:http://www.jianshu.com/p/49b86f9cd7ab 深入浅出AQS之独 ...

  9. JAVAEE企业级应用开发浅谈第二辑:MVC和三层架构

    上海尚学堂警句:一份信心,一份努力,一份成功:十分信心,十分努力,十分成功. Step1.情景概要 Hello,小伙伴们,昨天跟大家分享了JAVA EE 企业级应用开发中大家耳熟能详的概念-三层架构, ...

  10. sa账户和密码丢失如何找回

    来自:http://www.cnblogs.com/xred/archive/2012/03/09/2386185.html 在网上看了很多如何修改SQLServer2005的密码的方法.大多数都是转 ...