【JS数组的相关操作】-CSDN博客

前言

概述：本文主要记录开发中常用的JS数组的相关操作

提示：以下是本篇文章正文内容，下面案例可供参考

一、数组某元素出现次数【统计】

方法一: for循环

代码如下（示例）：

let arr = ['周杰伦','周杰伦', '陈奕迅', '周深', '张杰', '莫文蔚', '邓紫棋', '那英', '王菲']
var brr = []
for (let i = 0; i < arr.length; i++) {
    let key = arr[i]
    if (brr[key]) {
        brr[key]++
    }else{
        brr[key] = 1   
    }
   
}
console.log(brr) //[周杰伦: 2, 陈奕迅: 1, 周深: 1, 张杰: 1, 莫文蔚: 1, …]

方法二：reduce

代码如下（示例）：参考链接

let arr = ['周杰伦'，'陈奕迅'，'周深'，'张杰'，'莫文蔚'，'邓紫棋'，'那英'，'王菲']

let curnt = (arr) =>{
    let res = arr.reduce((preArr , curItem)=>{
        preArr[curItem] = preArr[curItem] ? preArr[curItem] + 1 : 1
        return preArr    
    },[])
    return res
}
console.log(curnt(arr)) //[周杰伦: 1, 陈奕迅: 1, 周深: 1, 张杰: 1, 莫文蔚: 1, …]

// redcue( 累加值,初始值,index,arr)
// 当设初始值为空 {} 值时，累加值的默认初始值curItem = 数组第一个值
// 累加器(第一个值，第二个值) ；
// 第一个值：上一次累加返回的值 ，第二个值：当前设置的初始值

二、数组去重的几种方式【去重】

方法一：new Set()、配合[...]、Array.from()

代码如下（示例）：参考链接

let arr = ['a', 'b', 'c', 'd', 'a', 'a', 'b', 'd', 'd', 'd', 'd', 'c', 'c', 'c']

function unique1(arr) {
    const res = new Set(arr);
    // return Array.from(res); 
    return [...res];
}
console.log(unique1(arr)) //['a', 'b', 'c', 'd']

方法二：重组法

代码如下（示例）：参考链接

let arr = ['a', 'b', 'c', 'd', 'a', 'a', 'b', 'd', 'h', 'f', 'd', 'f', 'e', 'c']


//从头找到尾，找不到的依次返回，组成新的数组
function unique2(arr) {
    const newArr = [];
    arr.forEach(item => {
        if (!newArr.includes(item)) newArr.push(item);
    })
    return res
}
console.log(unique2(arr)) //['a', 'b', 'c', 'd', 'h', 'f', 'e']

方法三： ES6 Map方法

代码如下（示例）：参考链接

let arr = ['a', 'a', 'a', 'd', 'a', 'a', 'b', 'd', 'c', 'f', 'd', 'f', 'c', 'c']

function unique3(arr) {
    const res = new Map()
    for (let item of arr) res.set(item)
    // return [...res].map(itemArr=>itemArr[0])
    return Array.from(res).map(itemArr => itemArr[0])
}
console.log(unique3(arr))//['a', 'd', 'b', 'c', 'f']

方法四：reduce

代码如下（示例）：参考链接

let arr = ['a', 'a', 'a', 'd', 'a', 'a', 'b', 'd', 'c']

function unique4(arr) {
    return arr.reduce((preArr, curArr) => {
        if (!preArr.includes(curArr)) preArr.push(curArr)
        return preArr
    }, [])
}
console.log(unique4(arr)) //['a', 'd', 'b', 'c']

方法五：filter 、indexOf

代码如下（示例）：参考链接

let arr = ['a', 'e', 'a', 'd', 'a', 'f', 'b', 'd', 'c']

function unique5(arr) {
    return arr.filter((item, index, arr) => arr.indexOf(item) === index)
}
console.log(unique5(arr)) //['a', 'e', 'd', 'f', 'b', 'c']