JS数组去重的实现
其实数组去重的实现就分为两大类
- 利用语法自身键不可重复性
- 利用循环(递归)和数组方法使用不同的api来处理。
注意️:下列封装成方法的要在函数开始增加类型检测,为了让去重的实现代码更加简单易懂,封装时我会省略类型检测
function noRepeat(){
if (!Array.isArray(arr)) {
console.log('type error!')
return
}
// XXX执行代码
}
利用键不可重复性
Set
原理:利用set存储的数据没有重复,结果为对象,需要再转换成数组
// 方法一
var arr = [1,1,2,1,3,4,5];
var set = new Set(arr);
console.log(Array.from(set))
// 方法二
[...new Set(arr)];
利用对象的属性
原理:利用对象的属性唯一(速度快,占空间多,用空间来换时间)
var res = [];
var obj = {};
for(var i=0; i<arr.length; i++){
if(!obj[arr[i]] ){
obj[arr[i]] = 1;
res.push(arr[i]);
}
}
Map
原理:利用map对象不重复,思路和对象属性一致。
function arrayNonRepeatfy(arr) {
let map = new Map();
let array = new Array(); // 数组用于返回结果
for (let i = 0; i < arr.length; i++) {
if(map .has(arr[i])) { // 如果有该key值
map .set(arr[i], true);
} else {
map .set(arr[i], false); // 如果没有该key值
array .push(arr[i]);
}
}
return array ;
}
利用数组下标不能重复(仅适用纯数字数组)
原理:利用数组下标不能重复。
function norepeat(arr){
var newArr = [];
var arrs = [];
for(var i=0;i<arr.length;i++){
var a = arr[i];
newArr[a] = 1;
}
for(var i in newArr){
arrs[arrs.length] = i;
console.log(i);
}
}
利用循环(递归)和数组方法使用不同的api
indexOf()
原理:利用indexOf检测新数组是否有当前元素,没有则添加。
方式一 检测新数组是否有当前元素
function norepeat(arr){
var newarr = [];
for(var i in arr) {
if(newarr.indexOf(arr[i]) == -1){
newarr.push(arr[i]);
}
}
return newarr;
} 方式二 检测当前元素第一次出现的位置和当前位置是否相等,相等则添加
function norepeat(arr){
var newarr = [arr[0]]; //默认加入第一个数 因为第一个数没比较的必要
for(var i =1;i<arr.length;i++){
if(arr.indexOf(arr[i])==i){
newarr.push(arr[i])
}
}
return newarr;
} 方式三 filter和indexOf
function unique(arr) {
return arr.filter(function(item, index, arr) {
//当前元素,在原始数组中的第一个索引==当前索引值,否则返回当前元素
return arr.indexOf(item, 0) === index;
});
}
includes()
原理:利用includes检测新数组中是否含有当前元素,没有则添加
方式一 利用普通for循环和includes
function norepeat(arr) {
var newarr =[];
for(var i = 0; i < arr.length; i++) {
if(!newarr.includes(arr[i])) { //includes 检测数组是否有某个值
newarr.push(arr[i]);
}
}
return array
} 方式二 利用reduce和includes
function norepeat(arr){
return arr.reduce((prev,cur) => prev.includes(cur) ? prev : [...prev,cur],[]);
}
注意️:indexOf和includes均可以和for循环,reduce配合使用
sort()
原理:先利用sort排序再比较相邻的是否相等
// 方法一 检测相邻相等则添加到新数组
function norepeat(arr) {
arr = arr.sort()
var arrry= [arr[0]];
for(var i = 1; i < arr.length; i++) {
if(arr[i] !== arr[i-1]) {
arrry.push(arr[i]);
}
}
return arrry;
} // 方式二 在原数组上检测,相邻元素相同则删除
function norepeat(arr) {
arr.sort(function (a, b) { return a - b; });
for (var i = 0; i < arr.length; i++) {
if (arr[i] == arr[i + 1]) {
arr.splice(i, 1);
i--;
}
}
return arr;
}
递归
原理:借用递归比较 index和index-1位是否相同,相同则删除
function noRepeat(arr) {
// 获取长度
var len = arr.length;
//对数组进行排序才能方便比较
arr.sort(function (a, b) {
return a - b;
})
// 用递归的方法进行去重
function loop(index) {
if (index >= 1) {
if (arr[index] === arr[index - 1]) {
arr.splice(index, 1);
}
loop(index - 1); //递归loop函数进行去重
}
}
loop(len - 1);
return arr;
};
JS数组去重的实现的更多相关文章
- js数组去重的4种方法
js数组去重,老生长谈,今天对其进行一番归纳,总结出来4种方法 贴入代码前 ,先对浏览器Array对象进行支持indexOf和forEach的polyfill Array.prototype.inde ...
- JS 数组去重(数组元素是对象的情况)
js数组去重有经典的 几种方法 但当数组元素是对象时,就不能简单地比较了,需要以某种方式遍历各值再判断是否已出现. 因为: 1.如果是哈希判断法,对象作哈希表的下标,就会自动转换成字符型类型,从而导致 ...
- js数组去重常用方法
js数组去重是面试中经常会碰到的问题,无论是前端还是node.js数组常见的有两种形式,一种是数组各元素均为基本数据类型,常见的为数组字符串格式,形如['a','b','c'];一种是数组各元素不定, ...
- js 数组去重小技巧
js 数组去重小技巧 Intro 今天遇到一个问题,需要对数据进行去重,想看一下有没有什么比较方便的方法,果然有些收获. Question 问题描述: 我有一个这样的数据: [ { "Pro ...
- JS数组去重的几种常见方法
JS数组去重的几种常见方法 一.简单的去重方法 // 最简单数组去重法 /* * 新建一新数组,遍历传入数组,值不在新数组就push进该新数组中 * IE8以下不支持数组的indexOf方法 * */ ...
- js数组去重五种方法
今天来聊一聊JS数组去重的一些方法,包括一些网上看到的和自己总结的,总共5种方法(ES5). 第一种:遍历数组法 这种方法最简单最直观,也最容易理解,代码如下: var arr = [2, 8, 5, ...
- js数组去重的方法(转)
JS数组去重的几种常见方法 一.简单的去重方法 // 最简单数组去重法 /* * 新建一新数组,遍历传入数组,值不在新数组就push进该新数组中 * IE8以下不支持数组的indexOf方法 * */ ...
- js 数组去重方法汇总
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...
- js数组去重 javascript版
//js数组去重 //思路: // 1.放入第一个元素 // 2.放入第n个元素,和第n个之前的元素就行比较,如果有重复,则跳过.没有重复就加入数组中 // 3.返回新的去重后数组 Array.pro ...
- js数组去重(多种方法)
// js数组去重 Array.prototype.fun1 = function(){ var arr = this, result = [], i, len = arr.length; for(i ...
随机推荐
- iptables看门狗
近来业内很多服务器因redis造成服务器被黑,这个攻击的防范重点在于防火墙!! 有时为了方便我们可能会将iptables临时关闭,方便完倘若忘记把它打开,黑客大摇大摆就走进来. 这时候,我们需要条看门 ...
- Java 开发者的编程噩梦,为什么你的代码总有 bug🐛?
文章已经收录在 Github.com/niumoo/JavaNotes ,更有 Java 程序员所需要掌握的核心知识,欢迎Star和指教. 欢迎关注我的公众号,文章每周更新. 很多 Java 初学者在 ...
- C++ 的字符串反转
C++ 的字符串反转 方法一: 使用 algorithm 中的 reverse 函数: // reverse 函数的定义(在 std 名称空间中) template<class BidirIt& ...
- Quartz.Net的基础使用方法,多任务执行
接着上面单任务执行的代码做一下简单的扩展 主要看下面这段代码,这是Quartz多任务调度的方法,主要就是围绕这个方法去扩展: // // 摘要: // Schedule all of the give ...
- CSS动画实例:旋转的圆角正方形
在页面中放置一个类名为container的层作为效果呈现容器,在该层中再定义十个名为shape的层层嵌套的子层,HTML代码描述如下: <div class="container&qu ...
- 【算法•日更•第三十期】区间动态规划:洛谷P4170 [CQOI2007]涂色题解
废话不多说,直接上题: P4170 [CQOI2007]涂色 题目描述 假设你有一条长度为5的木版,初始时没有涂过任何颜色.你希望把它的5个单位长度分别涂上红.绿.蓝.绿.红色,用一个长度为5的字符 ...
- Salesforce学习笔记之Actions and Recommendations
设置Actions and Recommendations(Salesforce提供的标准元素),Salesforce上的文档说有两种方法,即Deployment和Process Builder(通过 ...
- Ubuntu操作系统(文件传输)
首先选择Ubuntu版本为偶数版本--(系统比较稳定软件源比较齐全) Ubuntu和windows之间的文件传输首先在Windows上安装连接工具winscp 在Ubuntu开启SSH服务(https ...
- 结合Excel批量操作网页,模拟登陆
有这样一个场景,客户的一批账户密码保存在Excel中,需要逐一登录,进行某些操作 从头开始来的话很麻烦,读取Excel,安装Web控件,主要是控件操作没有很方便,有没有类似原始js调用.jqurey调 ...
- 多元线性回归检验t检验(P值),F检验,R方等参数的含义
做线性回归的时候,检验回归方程和各变量对因变量的解释参数很容易搞混乱,下面对这些参数进行一下说明: 1.t检验:t检验是对单个变量系数的显著性检验 一般看p值: 如果p值小于0.05表示该自 ...