现在要求去重下面这个数组:

const arr = [1, 2, 3, 3, 3, '0', '1', '2', '测试', '重复', '重复', NaN, NaN, false, false];

方法一:ES6 Set()

let arr = [1, 2, 3, 3, 3, '0', '1', '2', '测试', '重复', '重复', NaN, NaN, false, false];
arr = [...new Set(arr)]; //去重后: [ 1, 2, 3, '0', '1', '2', '测试', '重复', NaN, false ]

Set 是ES6新加的集合,集合中的值不会重复。   ...操作符 会将可遍历对象,转换为数组.

方法二:利用对象

let arr = [1, 2, 3, 3, 3, '0', '1', '2', '测试', '重复', '重复', NaN, NaN, false, false];
let obj = {};
let temp = [];
for (let i = 0; i < arr.length; i++) {
let type = Object.prototype.toString.call(arr[i]); // 不加类型 分不清 1 '1' 若用typeof 只有5种类型 无法区分nu
if ( !obj[arr[i] + type] ) {
temp.push( arr[i] );
obj[ arr[i] + type ] = true; //这里给true 利于代码阅读和判断。 如果给 0,'' ,false ,undefined 都会在if那里判断为 false 不利于代码阅读
}
}
console.log(temp)  //去重后:  [ 1, 2, 3, '0', '1', '2', '测试', '重复', NaN, false ]

方法三:sort排序后 在去重

let arr = [1, 2, 3, 3, 3, '0', '1', '2', '测试', '重复', '重复', NaN, NaN, false, false];
arr = arr.sort();
let temp = [];
while (arr.length > 0) {
if ( Object.is(arr[0], arr[1]) ) { //Object.is() 用于比较2个值, 比===更靠谱 例如 Object.is(NaN,NaN) 会判断true
arr.shift();
} else {
temp.push( arr.shift() );
}
}
//此方法会清空原数组, 你可以复制个数组,在去进行操作
console.log(temp) //去重后:  [ '0', 1, '1', '2', 2, 3, NaN, false, '测试', '重复' ]

方法四:for in 

let arr = [1, 2, 3, 3, 3, '0', '1', '2', '测试', '重复', '重复', NaN, NaN, false, false];
let temp = [];
for (let i = 0; i < arr.length; i++) {
if ( !temp.includes(arr[i]) ) { //includes 检测数组是否有某个值 内部调用Object.is() 利用判断NaN
temp.push(arr[i]);
}
}
console.log(temp); //去重后: [ 1, 2, 3, '0', '1', '2', '测试', '重复', NaN, false ]

以上方法 在最新版本谷歌浏览器全部正常运行;    建议大家都用谷歌浏览器~~

但是还是要用Babel去转译这些代码 ,不然低级浏览器没法运行。

欢迎大家一起讨论, 提出新的去重方法。

由任何错误,请在评论指出。  谢谢大家。

<javaScript> 数组去重的方法总结(2017年)的更多相关文章

  1. javascript 数组去重的方法

    前言:这是笔者学习之后自己的理解与整理.如果有错误或者疑问的地方,请大家指正,我会持续更新! 方法一 //注意有一个元素是空的 var test1 = [0, 0, 1, 1, 2, 'sss', 2 ...

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

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

  3. javaScript数组去重方法

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

  4. JavaScript 数组去重方法总结

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

  5. JavaScript 数组去重 方法汇总

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

  6. javascript数组去重的三种常用方法,及其性能比较

    在进行数组操作时往往会遇到去掉重复项的问题,下面简单介绍下数组去重的方法,以及其执行效率 方法一        采用两次循环        原理:拿当前的和他后面的比,如果后面的有重复的就干掉     ...

  7. [转] JavaScript数组去重(12种方法)

    数组去重,一般都是在面试的时候才会碰到,一般是要求手写数组去重方法的代码.如果是被提问到,数组去重的方法有哪些?你能答出其中的10种,面试官很有可能对你刮目相看.在真实的项目中碰到的数组去重,一般都是 ...

  8. 也谈面试必备问题之 JavaScript 数组去重

    Why underscore (觉得这部分眼熟的可以直接跳到下一段了...) 最近开始看 underscore.js 源码,并将 underscore.js 源码解读 放在了我的 2016 计划中. ...

  9. javascript数组 去重

    数组去重的方法有很多,到底哪种是最理想的,自己不清楚.于是自己测试了下数组去重的效果和性能.测试十万个数据,代码和所耗大概时间如下. 到底采用哪种方法,根据实际情况而定吧. /*方法一: 1,'1' ...

随机推荐

  1. 如何使用ArcGIS发布LiDAR 点云

    LiDAR--Light Detection And Ranging,即激光探测与测量技术. 下面将介绍如何使用ARCGIS来发布LiDAR的成果点云数据. LiDAR的点云数据一般格式为LAS.在A ...

  2. ie11强制兼容模式打开

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

  3. python实现mysql的读写分离及负载均衡

    Oracle数据库有其公司开发的配套rac来实现负载均衡,目前已知的最大节点数能到128个,但是其带来的维护成本无疑是很高的,并且rac的稳定性也并不是特别理想,尤其是节点很多的时候. 但是,相对my ...

  4. 分布式文件管理系统_FastDFS集群

    简单介绍 1,client storage tracker的关系 先用一幅图来解释用户如何访问一个通过DFS管理的文件 一般来说,一台服务器只有一个storage server,多个storage s ...

  5. VMware workstation转到vsphere解决办法

    一.前因 上一篇http://www.cnblogs.com/cuncunjun/p/6611837.html 中提到,我想把本地的vmware workstation的虚拟机拷贝到服务器上,因为鄙人 ...

  6. hive 动态分区数设置

    当对hive分区未做设置时,报错如下: Caused by: org.apache.hadoop.hive.ql.metadata.HiveFatalException: [Error 20004]: ...

  7. 使用cocapods报错 [!] Your Podfile has had smart quotes sanitised. To avoid issues in the future, you should not use TextEdit for editing it. If you are not using TextEdit, you should turn off smart quotes

    从github上下载的工程大部分都使用了cocapods,在install的时候可能会报错. 报错原因: 1.不要使用文本编辑去编辑Podfile文件,使用Xcode编辑,或者使用终端敲命令去编辑. ...

  8. HTML基础学习(二)—CSS

    一.CSS概述     CSS(Cascading Stytle Sheets)层叠样式表,用来定义网页的显示效果.可以解决HTNL代码对样式定义的重复,提高了后期样式代码的可维护性,并增强了网页的显 ...

  9. quartus ii有符号数的问题(待完善)

    1.有符号数是以补码的形式存储的,在modelsim仿真时,补码自动转换为有符号的十进制数. 2.关于截位的问题: 当只取寄存器中的其中m位时,这时候取得的数是按照无符号位来处理的? 3.reg型数据 ...

  10. linux_cmd_list_0

    一.文件 touch file # 创建空白文件 rm -rf 目录名 # 不提示删除非空目录(-r:递归删除 -f强制) dos2unix # windows文本转linux文本 unix2dos ...