JavaScript数组常用方法

前言

JavaScript数组处理方法是前端数据渲染前中间处理最常用的一个工具之一，无论搞前端还是搞后端如果能够熟练的使用它，都将给我们开发节省不少时间。

 

使用

1.ForEach方法

 forEach使我们数据遍历使用评率最高的一个。

Es5写法：

let arr = [1,2,3,4,5]
/**
  * value 值(必须)
  * index 数组下标
  * array 当前数组
  */
arr.forEach(function (value, index, array) {
        console.log(index,value)
})

Es6写法：

arr.forEach((value,index)=>{
        console.log(index,value)
})

2. map方法

map主要用于处理数组中的每个元素，返回处理后的数组，原数组不变。

Es5写法：

let arr = [1,2,3,4,5]
/**
  * value 值(必须)
  * index 数组下标
  * array 当前数组
  */
let arr10 = arr.map(function (value, index, array) {
        return value+1
})

Es6写法：

let arr1 = arr.map((value,index) => {
        return value+1
    })

3.filter方法

filter方法用于过滤数组，返回满足条件的 元素，原数组不变。

 

Es5写法：

let arr = [1,2,3,4,5]
/**
  * value 值(必须)
  * index 数组下标
  * array 当前数组
  */
let arr22 = arr.filter(function (value,index,arr) {
        return value>3
    })

 

Es6写法：

let arr2 = arr.filter(value => value>3)

 

4.reduce方法

reduce方法用于带变量去处理数组中的每一个值，原数组不变

Es5写法：

let reduceArr = [1,2,3,3]
/**
  * prev 中间变量（必须）
  * cur 当前遍历的值（必须）
  * arr 当前遍历的数组
  * 0    prev的初始值
  */
let sum = reduceArr.reduce(function (prev,cur,arr) {
return  prev +=cur
},0)

Es6写法：

let total = reduceArr.reduce(((prev, cur) => prev+cur))

5.sort方法

sort用于排序，在原数组上进行排序。

 

Es5写法：

let arr = [1,2,3,4,5]
arr.sort(function (a,b) {
       // 降序
       return b-a
})

 

Es6写法：

let arr3 = arr.sort(((a, b) => b-a))
    
    let peoples = [
        {"name":"zs","age":5},
        {"name":"ls","age":8},
        {"name":"ww","age":12},
        {"name":"tom","age":6},
        {"name":"lw","age":17},
    ]
    let newPeoples =  peoples.sort((people1,people2)=>people1.age-people2.age)

6.push和pop方法

push方法用于向数组末尾添加一个或多个元素返回数组长度，pop用于从数组末尾删除元素并返回

let arr = [1,2,3,4,5]
let length = arr.push(7) // length = 6 arr=[1,2,3,4,5,7]
let pop = arr.pop()  // pop = 7  arr=[1,2,3,4,5]

7.unshift和shift方法

unshift方法用于向数组头部添加一个或多个元素返回数组长度，shift用于删除并返回数组第一个元素

let arr = [1,2,3,4]
let length = arr.unshift(0) // length=5 arr=[0,1,2,3,4]
let shift = arr.shift()  // shift = 0   arr=[1,2,3,4]

8.join

join用于将数组拼接成字符串

let arr = [1,2,3,4]
let str = arr.join()  // str=1234
let str2 = arr.join("-") // str2=1-2-3-4

 

9.concat

concat用于合并一个或多个数组

let arr = [1,2,3,4]
let arr2 = arr.concat([5,6],[8,9])  // arr2=[1,2,3,4,5,6,8,9]

10.slice和 splice

 

slice用于数组中数组的截取，splice用于从数组中删除元素(也可以有选择性的添加元素)，返回删除的元素，原数组改变

let arr = [1,2,3,4,5,6]
let slice = arr.slice(0,3) // slice = [1,2,3]

let splice = arr.splice(1,2)  // 从下表为1开始删除2个元素 删除后 arr = [1,4,5,6]  splice = [2,3]

11.lastIndexOf和indexOf

indexOf(value)用于查找并返回value第一次出现的下标，lastIndexOf(value)用于查找并返回value最后一次出现的下标，如果没有找到都返回-1。

let arr = [1,2,3,4,5,2,3]
console.log(arr.lastIndexOf(2));  // 5
console.log(arr.indexOf(2));      // 1