<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' ...
随机推荐
- iwebshop两表联查
$tb_goods = new IQuery('goods as g'); $tb_goods->join='left join miao as m on m.goods_id=g.id'; $ ...
- 【前端调试手机页面】分享一款便捷的调试工具--spy-debugger
spy-debugger : 微信调试,各种WebView样式调试.手机浏览器的页面真机调试.便捷的远程调试手机页面.抓包工具,支持:HTTP/HTTPS,无需USB连接设备. github地址: ...
- 自适应的tab菜单栏
代码部分: Css代码:*{ margin:0px; padding:0px; font-size:62.5%;}body{ background-color:#FFFFFF;}.zw-test-ti ...
- 关于js参数传递矛盾新理解
之前看了很多人的解释,说js中,函数的参数传递都是值传递中不理解. 他们无非举了两个例子 在这两个例子中,第二个例子可以看出参数是由值传递的.因为函数内对象的变化没有影响到函数外对象的变化.但是在第一 ...
- XJOI1680阿猫的实验
阿猫的实验 阿猫很喜欢生物学.他还在今年的全国中学生生物学联赛中获得了一等奖.一天,阿猫在实验室听说了这样一种繁殖能力很强的老鼠.这种老鼠在出生后的第一个月,可以生出a 对老鼠:第二个月,可以生出b ...
- 程序员的基本功之Java集合的实现细节
1.Set集合与Map 仔细对比观察上面Set下和Map下的接口名,不难发现它们如此的相似,必有原因 如果只考察Map的Key会发现,它们不可以重复,没有顺序,也就是说把Map的所有的Key集中起来就 ...
- Zookeeper的安装和初步使用
1. Zookeeper集群角色 Zookeeper集群的角色: Leader 和 follower (Observer) zk集群最好配成奇数个节点 只要集群中有半数以上节点存活,集群就能提供 ...
- WPF 杂谈——开篇简言。
这俩年多来笔者一直在从事关于WPF的开发.虽然不能说是专家级别的.但是对于WPF的应用还是有一定的了解.论他的灵活性决对不在WinForm之下.WPF的出现更是引发一段热议.他的何去何从更是让很多人感 ...
- day001-html知识点总结(-)块级。行内元素区分
-.行内元素和块级元素的区别与转换: 区别: 1.从形式上看,在标准文档流中,行内元素会水平方向呈线性排列,而块级元素会各占一行,垂着方向排列. 2.在结构使用上,块级元素可以包含行内元素和块级元素, ...
- [HAOI2006]受欢迎的牛
洛谷传送门 直接tarjan求scc,然后统计出度为0的缩点,如果多余1个就输出0,只有一个就输出这个缩点里的点. --代码 #include <cstdio> #include < ...