JavaScript数组去重方法汇总
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数组去重方法汇总的更多相关文章
- JavaScript 数组去重 方法汇总
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...
- JavaScript数组去重方法及测试结果
最近看到一些人的去面试web前端,都说碰到过问JavaScript数组去重的问题,我也学习了一下做下总结. 实际上最有代表性也就三种方法:数组双重循环,对象哈希,排序后去重. 这三种方法我都做了性能测 ...
- JavaScript 数组去重方法总结
1.遍历数组法: 这应该是最简单的去重方法(实现思路:新建一新数组,遍历数组,值不在新数组就加入该新数组中) // 遍历数组去重法 function unique(arr){ var _arr = [ ...
- javaScript数组去重方法
在JAvascript平时项目开发中经常会用到数组去重的操作.这时候就要用到JS数组去重的方法了. demo1: 第一种:JS数组去重操作方法是利用遍历原数组,利用数组的indexOf()方法来来判断 ...
- js 数组去重方法汇总
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...
- JavaScript 数组(Array)方法汇总
数组(Array)常用方法; 数组常用的方法:concat(),every(), filter(), forEach(), indexOf(), join(), lastIndexOf(), map ...
- JavaScript数组去重方法总结
一.双重遍历去重 function onlyFigure(arr) { let newarr = []; const length = arr.length for (let i = 0; i < ...
- JavaScript实现数组去重方法
一.利用ES6 Set去重(ES6中最常用) function unique (arr) { return Array.from(new Set(arr)) } var arr = [1,1,'tru ...
- JavaScript数组去重的几种方法
这个老问题,网上普遍都有了,为什么要再写一遍呢,主要是为了记个笔记... 遍历时搜索结果数组 思路很明确,如下 新建一个数组存放结果 循环遍历原数组,对于每一个元素,在结果数组中搜索是否存在 若不存在 ...
随机推荐
- Spring - BeanPostProcessor接口(后处理器)讲解
概述: BeanPostProcessor接口是众多Spring提供给开发者的bean生命周期内自定义逻辑拓展接口中的一个,其他还有类似InitializingBean,DisposableBean, ...
- 我的Spring学习记录(一)
spring是一个框架,一个我理解为对象的大熔炉,它生产着各种bean,还可以对生产的对象进行加工. 这里有些概念需要理解一下,就是IOC和DI以及AOP,接下来,我们进入主题. spring简介 上 ...
- Chrome控制台选择器简介
Chrome的控制台是支持用$来获取元素的,这点可能是很多人不知道的.本篇文章将会简单介绍怎样更好的来使用这种快捷方式来获取元素. 判断当前窗口的$是来自谁的 我们知道jQ里面经常使用$来进行元素选择 ...
- HADOOP源码分析之RPC(1)
源码位于Hadoop-common ipc包下 abstract class Server 构造Server protected Server(String bindAddress, int port ...
- 『诡异的』VL10B创建外向交货单出错解决全过程
一直觉得SAP STO的业务模式配置起来还是挺简单的,无非就是关联一下采购单与交货单的关系,以及相应工厂的装运数据,其他像主数据的设置也没有什么特别的.相比ICS模式,它少了IDOC的配置,所以还是很 ...
- 【Learning】多项式乘法与快速傅里叶变换(FFT)
简介: FFT主要运用于快速卷积,其中一个例子就是如何将两个多项式相乘,或者高精度乘高精度的操作. 显然暴搞是$O(n^2)$的复杂度,然而FFT可以将其将为$O(n lg n)$. 这看起来十分玄学 ...
- C#仪器数据文件解析-RTF文件
RTF格式文件大家并不陌生,但RTF文件的编码.解码却很难,因为RTF文件是富文本格式的,即文件中除了包含文本内容,还包含文本的格式信息,而这些信息并没有像后来的docx等采用XML来隔离格式和内容, ...
- Django 1.10中文文档-聚合
Django 数据库抽象API 描述了使用Django 查询来增删查改单个对象的方法. 然而,有时候你要获取的值需要根据一组对象聚合后才能得到. 这个主题指南描述了如何使用Django的查询来生成和返 ...
- iOS开发注意事项(一)
1.OC的消息机制与C++等的函数(方法)有很大的不同,OC在运行时所执行的代码由运行环境来决定,而C++等则由编译器决定.如果调用的函数是多态的,C++在运行时要按照虚方法表来查出到底执行哪个函数, ...
- js 按条件 serialize() 对应标签
serialize 非常方便的帮我们创建 URL 编码文本字符串 输出的字符串格式为 a=1&b=2&c=3 直接可用于Url传参 下面介绍一下选择性的序列化某些标签的使用方法 将 ...