IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> **数组去重的方法** -> 正文阅读

[JavaScript知识库]**数组去重的方法**

1.利用ES6 Set去重(ES6中最常用)

let arr = [1,5,4,1,5,3,8,0]
function unique (arr) {
  return Array.from(new Set(arr)) // Array.from()方法就是将一个类数组对象或者可遍历对象转换成一个真正的数组
}
console.log(unique(arr))
或者
console.log([...new Set(arr)])

2.利用for嵌套for 然后splice去重(ES5中最常用)

let arr = [1,5,6,0,7,3,0,5,9,5,5]
function unique (arr) {
  for (let i = 0, len = arr.length; i < len; i++) {
    for (let j = i + 1, len = arr.length; j < len; j++) {
      if (arr[i] === arr[j]) {
        arr.splice(j,1) // arr删除重复元素
        j-- // 每删除一个数j的值就减1
      }
    }
  }
  return arr
}
console.log(unique(arr)) // [1,5,6,0,7,3,9]

3.利用indexOf去重

let arr = [1,-5,-4,0,-4,7,7,3]
function unique (arr) {
  let arr1 = []
  for (let i = 0, len = arr.length; i < len ; i++) {
    if (arr1.indexOf(arr[i]) === -1) {
      arr1.push(arr[i])
    }
  }
  return arr1
}
console.log(unique(arr))

4.利用sort()

let arr = [5,7,1,8,1,8,3,4,9,7]
function unique (arr) {
  arr = arr.sort()
  console.log('arr', arr)
  let arr1 = [arr[0]] // 赋初始值
  for (let i = 1; i < arr.length; i++) {
    if (arr[i] !== arr[i-1]) {
      arr1.push(arr[i])
    }
  }
  return arr1
}
console.log(unique(arr))

5.利用filter(过滤器)

// 结合indexOf方法,indexOf返回在数组中可以找到一个给定元素的第一个索引
let arr = [1,2,2,4,null,null]
let newArr = arr.filter((item,index,arr) => {
  return arr.indexOf(item) === index // 找到在arr中有的对应item,并返回
})
console.log(newArr)

6.利用递归去重

let arr = [1,1,5,6,0,9,3,0,6]
function unique (arr) {
  let arr1 = arr;
  let len = arr.length;
  arr1.sort((a,b) => {
    return a-b // 从小到大排序
  })
  function loop (index) {
    if (index >= 1) {
       if (arr1[index] === arr1[index-1]) {
          arr1.splice(index,1)
        }
        loop(index - 1)
    }
  }
  loop(len - 1) // index初始值为len-1,倒序
  return arr1
}
console.log(unique(arr))

7.利用Map数据结构去重

/*
创建一个空Map数据结构,遍历需要去重的数组,把数组的每一个元素作为key存到Map中。由于Map中不会出现相同的key值,所以最终得到的就是去重后的结果。
*/
let arr = [1,0,8,3,-9,1,0,-9,7]
function unique (arr) {
  let map = new Map()
  console.log(map)
  let arr1 = []
  for (let i = 0, len = arr.length; i < len; i ++) {
    if (map.has(arr[i])) { // 判断map是否存在该key值
      map.set(arr[i], true)
      console.log('map1', map) // {1:true, 0: true, 8: false, 3:false, -9: true, 7:false}
    } else {
      map.set(arr[i], false)
      console.log('map2', map) // {1:false, 0: false, 8: false, 3:false, -9: false, 7:false}
      arr1.push(arr[i])
    }
  }
  return arr1
}
console.log(unique(arr))

  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2021-12-14 15:50:58  更:2021-12-14 15:52:46 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2025年1日历 -2025/1/8 2:00:05-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码