<javaScript> 数组去重的方法总结(2017年)
现在要求去重下面这个数组:
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年)的更多相关文章
- javascript 数组去重的方法
前言:这是笔者学习之后自己的理解与整理.如果有错误或者疑问的地方,请大家指正,我会持续更新! 方法一 //注意有一个元素是空的 var test1 = [0, 0, 1, 1, 2, 'sss', 2 ...
- JavaScript数组去重方法及测试结果
最近看到一些人的去面试web前端,都说碰到过问JavaScript数组去重的问题,我也学习了一下做下总结. 实际上最有代表性也就三种方法:数组双重循环,对象哈希,排序后去重. 这三种方法我都做了性能测 ...
- javaScript数组去重方法
在JAvascript平时项目开发中经常会用到数组去重的操作.这时候就要用到JS数组去重的方法了. demo1: 第一种:JS数组去重操作方法是利用遍历原数组,利用数组的indexOf()方法来来判断 ...
- JavaScript 数组去重方法总结
1.遍历数组法: 这应该是最简单的去重方法(实现思路:新建一新数组,遍历数组,值不在新数组就加入该新数组中) // 遍历数组去重法 function unique(arr){ var _arr = [ ...
- JavaScript 数组去重 方法汇总
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...
- javascript数组去重的三种常用方法,及其性能比较
在进行数组操作时往往会遇到去掉重复项的问题,下面简单介绍下数组去重的方法,以及其执行效率 方法一 采用两次循环 原理:拿当前的和他后面的比,如果后面的有重复的就干掉 ...
- [转] JavaScript数组去重(12种方法)
数组去重,一般都是在面试的时候才会碰到,一般是要求手写数组去重方法的代码.如果是被提问到,数组去重的方法有哪些?你能答出其中的10种,面试官很有可能对你刮目相看.在真实的项目中碰到的数组去重,一般都是 ...
- 也谈面试必备问题之 JavaScript 数组去重
Why underscore (觉得这部分眼熟的可以直接跳到下一段了...) 最近开始看 underscore.js 源码,并将 underscore.js 源码解读 放在了我的 2016 计划中. ...
- javascript数组 去重
数组去重的方法有很多,到底哪种是最理想的,自己不清楚.于是自己测试了下数组去重的效果和性能.测试十万个数据,代码和所耗大概时间如下. 到底采用哪种方法,根据实际情况而定吧. /*方法一: 1,'1' ...
随机推荐
- 于普通用户启动UAC问题
在VS中设置UAC级别操作如下: 项目属性-配置属性-连接器-清单文件 1.UAC执行级别: aslnvoker: 权限级别最低,不需要管理员身份. highestAvailable:获取最高权限执行 ...
- Nuget Server 搭建
每个女人都有很多包包:其实男人也有,但只有会写程序的男人才有 -- 代码世界中的大"包"小"包".这些大包小包,有花钱买的,有从开源市场淘的,也有自己或同事亲手 ...
- 使用arcpy.mapping模块批量出图
出图是项目里常见的任务,有的项目甚至会要上百张图片,所以批量出土工具很有必要.arcpy.mapping就是ArcGIS里的出图模块,能快速完成一个出图工具. arcpy.mapping模块里常用 ...
- synchronized关键字
最近重新梳理了下java的synchronized相关内容,希望能帮助到有需要的朋友们. 主要阐述以下几个问题: 1.非static方法前加synchronized class Demo{ synch ...
- 关于VO中的Attribute的问题
对于新手来说,有些时候会遇到VO中的Attribute的各种问题; 总结如下:1,你页面上输入了值,但是点击保存之后值并不能存到数据库,这个是因为该字段在VO中不是基于EO的 2,你将一个VO中的E ...
- div内部元素居中
要让div内部元素垂直居中,则给div加上此css样式: .div-vertical-middle{ height:200px; width:304px; line-height:50px; ...
- 【Hexo】(一)使用HEXO配置环境,创建Hello World
现场直播,呵呵,就是我完成一步,就记录一下: 一.配置环境 1.安装 Node 下载地址:Node.js 2.安装 Git(win环境下) 下载地址:Git Git 绑定 GitHub账户: ①打开G ...
- web中关于垃圾回收的一些观点
感觉dom大神的解惑 关于引用计数法,注意引用的方向性就行. A.addEventListner(B.func), 那么是增加了A对B的引用.如果A是不可回收的对象,比如全局的Stage,或者单例. ...
- React+ES6+Webpack环境配置
转自http://www.cnblogs.com/chenziyu-blog/p/5675086.html 参考http://www.tuicool.com/articles/BrAVv2y Reac ...
- Android系统结构
从上图中可以看出,Android系统架构为四层结构,从上层到下层分别是应用程序层.应用程序框架层.系统运行库层以及Linux内核层,分别介绍如下: (1)Appliacation Android平台不 ...