JavaScript的数组去重方法
数组去重
●就是把一个数组中重复出现的数据只留下一个,没有重复出现的就不用管了
●最后的数组里面只有不重复的数据
方案一
●我们可以利用sort()方法进行排序
●让一样的数据挨着,后面我们就可以判断前一个和后一个是不是一样,
●如果一样就删掉一个
// 定义一个数组
var arr = [1, 2, 3, 4, 5, 1, 2, 3, 4, 5, 4, 5, 1, 2, 3,]
console.log('原始数组 : ', arr);
// 利用我们的sort()方法先进行排序
arr.sort()
// 循环遍历我们的数组
for (var i = 0; i < arr.length; i++) {
// 判断我们数组中的前一个和后面的一个数据是不是相等
if (arr[i] === arr[i + 1]) {
// 如果相等就删除掉一个
arr.splice(i, 1)
// 为了防止数组塌陷,我们执行i--
i--
}
}
方案二
●准备一个新的数组,我们可以判断新数组中的数据有没有和原始数组中数据一样的
●如果有,咱们就不添加,如果没有就可以添加到新数组中
// 定义一个数组
var arr = [1, 2, 3, 4, 5, 1, 2, 3, 4, 5, 4, 5, 1, 2, 3,]
console.log('原始数组 : ', arr);
var arr1 = []
// 遍历原始数组
for (var i = 0; i < arr.length; i++) {
// 判断新数组中有没有原始数组中的数据
if (arr1.indexOf(arr[i]) === -1) {
// 把没有的添加到新数组中
arr1.push(arr[i])
}
}
console.log('新数组 : ', arr1);
方案三
●我们可以利用双重循环的方式,让前一个数据和后面的每一个数据进行比较
●如果有一样的,我们就删掉一个
// 定义一个数组
var arr = [1, 2, 3, 4, 5, 1, 2, 3, 4, 5, 4, 5, 1, 2, 3,]
console.log('原始数组 : ', arr);
for (var i = 0; i < arr.length; i++) {
// 外层循环执行一次,里面的循环是不是要比较一轮啊
// 这里需要注意一下:内层循环还有必要从0开始吗
// 如果还是从0开始一定是相等的
for (var j = i + 1; j < arr.length; j++) {
// 判断前面数据和后面的每一个是不是一样
if (arr[i] === arr[j]) {
arr.splice(j, 1)
j--
}
}
}
方案四
●直接遍历数组,看看里面有没有重复的,有的话就直接删掉
// 定义一个数组
var arr = [1, 2, 3, 4, 5, 1, 2, 3, 4, 5, 4, 5, 1, 2, 3,]
console.log('原始数组 : ', arr);
for (var i = 0; i < arr.length; i++) {
// 判断有没有重复的
var index = arr.indexOf(arr[i], i + 1)
// 如果index的值不是-1 说明有重复的,我们就删除重复的
if (index !== -1) {
// 删掉重复的数据
arr.splice(index, 1)
// 阻止数组塌陷
i--
}
}
方案五
●我们知道对象里面的键名是不能重复的.如果有重复的就是相当于在修前一个的值
●所以我们可以利用这个点实现一下去重
// 定义一个数组
var arr = [1, 2, 3, 4, 5, 1, 2, 3, 4, 5, 4, 5, 1, 2, 3,]
console.log('原始数组 : ', arr);
// 定义一个空对象
// var obj = {}
// 循环遍历我们的原始数组,把我们数组中的数据作为我们对象的命名
for (var i = 0; i < arr.length; i++) {
// 这里我们是不是可以拿到我们数组内的每一个数据
console.log(arr[i]);
obj[arr[i]] = '你好'
}
// 我们看到我们的键名已经是不重复的原数组中的数据了
console.log(obj);
// 现在我们要做的就是把对象中的键名取出来
// 遍历我们的对象
// 创建一个新数组
var arr1 = []
for (var k in obj) {
// 我们的k 是可以拿到的 但是要添加到哪里呢? 需要我们外面新建一
console.log(k);
// 把 k 添加到新数组中
arr1.push(k - 0)
}
// 这个时候我们看到我们的新数组里面值是对的,但是类型不对
// 因为k就是一个字符串类型 所以我们-0就可以了
console.log('新数组 : ', arr1);
方案六
●可以使用 Set 数据结构来进行数组去重
Set 数据结构
●Set() 数据结构是 ES6 中出现的一个构造函数, 用来生成 Set 数据结构
●Set数据机构是一个 类似于 数组的数据结构
●Set函数可以接受一个数组作为参数
●特点: 所有元素都是唯一的,没有重复
●语法: var s = new Set([ 数据1, 数据2, 数据3, ... ])
// 原始的数组
var arr = [1, 2, 3, 4, 5, 1, 2, 3, 4, 5, 4, 5, 1, 2, 3,]
console.log('原始数组 : ', arr);
// 使用的时候我们需要使用 new Set()把我们去重的数组放进去
// 我们得到的返回值是一个 Set 数据结构
var mySet = new Set(arr)
console.log(mySet);
还原成数组
●Set 数据结构虽然可以去重, 但是去重完毕以后不再是数组了
●我们还需要把 Set 结构还原成数组
●方案1 :
// 准备一个 Set 数据结构
var arr = [1, 2, 3, 4, 5, 1, 2, 3, 4, 5, 4, 5, 1, 2, 3,]
var mySet = new Set(arr)
var res = [ ...mySet ]
cosnole.log(res)
●方案2 :
// 准备一个 Set 数据结构
var arr = [1, 2, 3, 4, 5, 1, 2, 3, 4, 5, 4, 5, 1, 2, 3,]
var mySet = new Set(arr)
var res = Array.from(mySet)
cosnole.log(res)
猜你喜欢LIKE
相关推荐HOT
更多>>servlet底层原理是什么?
1、ServletAPI核心类与接口2、Servlet类处理请求的流程创建servlet类的步骤:创建一个命名为TestServlet继承javax.servlet.http.HttpServlet类详情>>
2023-05-30 10:41:22多线程的优势与劣势分别是什么?
多线程是指在同一个程序中,同时运行多个线程,每个线程都可以独立执行不同的任务,相互之间不会干扰。多线程的优势和劣势如下:优势:提高程序...详情>>
2023-05-30 10:32:12设计模式之生产者与消费者的代码实现
本文主要讲述生产者和消费者模式,文中会使用通俗易懂的案例,使你更好地学习本章知识点并理解原理,做到有道无术。什么是生产者和消费者模式生...详情>>
2023-05-30 10:25:46从零开始学Java之interface接口
一.接口简介简介Java中的接口(interface)类似于是一种特殊的抽象类,它也是众多抽象方法的集合。接口的定义方式、组成部分都与抽象类相似,却比...详情>>
2023-05-29 11:26:17热门推荐
如何进行mysql数据备份?
沸什么是servlet的生命周期?servlet请求处理流程是怎样的?
热servlet底层原理是什么?
热怎样编写java程序?
新多线程的优势与劣势分别是什么?
ssm框架的作用与原理是什么?
设计模式之生产者与消费者的代码实现
接口和抽象类有什么区别?4个方面对比
从零开始学Java之interface接口
从零开始学Java之Java中的内部类是怎么回事?
一分钟带你了解MySQL——基础与介绍
在java中,super关键字怎样使用
什么是事件流以及事件流的传播机制 ?
弹性盒有哪些属性是在父元素身上?