其实数组去重的实现就分为两大类

  • 利用语法自身键不可重复性
  • 利用循环(递归)和数组方法使用不同的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数组去重的实现的更多相关文章

  1. js数组去重的4种方法

    js数组去重,老生长谈,今天对其进行一番归纳,总结出来4种方法 贴入代码前 ,先对浏览器Array对象进行支持indexOf和forEach的polyfill Array.prototype.inde ...

  2. JS 数组去重(数组元素是对象的情况)

    js数组去重有经典的 几种方法 但当数组元素是对象时,就不能简单地比较了,需要以某种方式遍历各值再判断是否已出现. 因为: 1.如果是哈希判断法,对象作哈希表的下标,就会自动转换成字符型类型,从而导致 ...

  3. js数组去重常用方法

    js数组去重是面试中经常会碰到的问题,无论是前端还是node.js数组常见的有两种形式,一种是数组各元素均为基本数据类型,常见的为数组字符串格式,形如['a','b','c'];一种是数组各元素不定, ...

  4. js 数组去重小技巧

    js 数组去重小技巧 Intro 今天遇到一个问题,需要对数据进行去重,想看一下有没有什么比较方便的方法,果然有些收获. Question 问题描述: 我有一个这样的数据: [ { "Pro ...

  5. JS数组去重的几种常见方法

    JS数组去重的几种常见方法 一.简单的去重方法 // 最简单数组去重法 /* * 新建一新数组,遍历传入数组,值不在新数组就push进该新数组中 * IE8以下不支持数组的indexOf方法 * */ ...

  6. js数组去重五种方法

    今天来聊一聊JS数组去重的一些方法,包括一些网上看到的和自己总结的,总共5种方法(ES5). 第一种:遍历数组法 这种方法最简单最直观,也最容易理解,代码如下: var arr = [2, 8, 5, ...

  7. js数组去重的方法(转)

    JS数组去重的几种常见方法 一.简单的去重方法 // 最简单数组去重法 /* * 新建一新数组,遍历传入数组,值不在新数组就push进该新数组中 * IE8以下不支持数组的indexOf方法 * */ ...

  8. js 数组去重方法汇总

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

  9. js数组去重 javascript版

    //js数组去重 //思路: // 1.放入第一个元素 // 2.放入第n个元素,和第n个之前的元素就行比较,如果有重复,则跳过.没有重复就加入数组中 // 3.返回新的去重后数组 Array.pro ...

  10. js数组去重(多种方法)

    // js数组去重 Array.prototype.fun1 = function(){ var arr = this, result = [], i, len = arr.length; for(i ...

随机推荐

  1. 《Spanner: Google’s Globally-Distributed Database》论文总结

    Spanner 总结 说明:本文为论文 <Spanner: Google's Globally-Distributed Database> 的个人理解,难免有理解不到位之处,欢迎交流与指正 ...

  2. Elasticsearch第一篇:在 Windows 上的环境搭建

    本文介绍如何在 windows 10 ,64位操作系统上安装最新版本 Elasticsearch.以及相关插件.之前看了不少园友的文章,用到的版本都比较低,尤其是插件的版本要和ES的版本相对应等这些问 ...

  3. C#LeetCode刷题之#717-1比特与2比特字符( 1-bit and 2-bit Characters)

    问题 该文章的最新版本已迁移至个人博客[比特飞],单击链接 https://www.byteflying.com/archives/3740 访问. 有两种特殊字符.第一种字符可以用一比特0来表示.第 ...

  4. Node学习基础之安装node以及配置环境变量

    第一步去node官网下载nodejs 我放在D盘 接着在cmd输入node -v 就能得到node的版本号 还有npm -v 下来进入安装好的目录 nodejs目录 创建两个文件夹 node_cach ...

  5. 在GitHub上删除仓库 or 项目,基操!!

    创建错误或者想要抛弃某个仓库or项目,点击选择项目,选择Setting页面,左侧方框Option页拉到底: 你就可以看到一个红色的危险域,called Danger Zone,这不禁让我想到了黑子篮球 ...

  6. SpringSecurity权限管理系统实战—七、处理一些问题

    目录 SpringSecurity权限管理系统实战-一.项目简介和开发环境准备 SpringSecurity权限管理系统实战-二.日志.接口文档等实现 SpringSecurity权限管理系统实战-三 ...

  7. golang复杂数据结构

    1.数组 数组是一个由固定长度的特定类型元素组成的序列,一个数组可以由零个或多个元素组成.因为数组的长度是固定的,因此在Go语言中很少直接使用数组. 数组的每个元素可以通过索引下标来访问,索引下标的范 ...

  8. 安国AU6989主控 + K9GBG08U0A(NAND) 制作4GB闪存驱动器

    文档标识符:AU6989_FLASH-DRIVE_D-P8 作者:DLHC 最后修改日期:2020.8.22 本文链接: https://www.cnblogs.com/DLHC-TECH/p/AU6 ...

  9. 3分钟教会你如何发布Qt程序

    导读:Qt程序编写好以后该如何发布.本文教你使用Qt自带工具windeployqt来进行操作. 本文字数:500,阅读时长大约:3分钟 (1)编写一个简单的程序 我们先做一个简单的窗口,添加一个图片资 ...

  10. Struts+Servlet+JDBC网上手机销售系统

    项目描述 Hi,大家好,今天给大家分享一个<网上手机销售系统>.本系统一共分为前台和后台两大模块,两个模块之间虽然在表面上是相互独立的,但是在对数据库的访问上是紧密相连的,各个模块访问的是 ...