Js的必须掌握的数组方法

Mr李 • 2023-06-10 13:45 • 杂文

js数组的基础方法

（基础方法很好理解，就不做过多面描述）

Array.shift()

删除数组第一位元素

Array.unshift()

添加数组第一位元素

Array.pop()

删除数组最后一位元素

Array.push()

添加数组最后一位元素

Array.concat()

拼接数组 // arr1.concat(arr2)

Array.reverse(）

反转数组

Array.tostring()

数组转换成字符串

Array.join()

数组转换成字符串，并写的一个参数，拼接符

Array.slice()

截取数组

arr1.slice(1, 3)
slice(start, end)

Array.splice()

splice(start, end, ...)
开始位置，结束位置

删除
删除下标3之后的3位数组元素
arr1.splice(3, 3)
替换
将数组元素下标为2之后的两位数组元素，替换成'hello' 、 'word'
arr1.splice(2, 2, 'hello', 'word')
新增
新增了一个'new'
arr1.splice(2, 0, 'new')

Array.sort(callback)

sort排序： 正序和倒序,有返回值，a-b正序，b-a倒序
arr1.sort((a, b) =>{
 return a - b
})

ES5新增：

Array.indexOf(data, start)

查找指定字符在数组中第一次出现的地方

arr1.indexof('a', 1)
查找a，从下标为1的位置开始查找

Array.filter()

字如其名，筛选过滤有返回值，返回条件为true的元素

arr1.filter((ietm, index) => {
    return /条件为true/
})

Array.map()

遍历数组，有返回值

arr1.map((item，index)=>{
 return /值/
})

Array.forEach()

遍历数组没有返回值

arr1.forEach((item, index)=>{
 return /值/
})

Array.fill()

填充数组

let arr = new Array(5).fill(null).map((item)=>{
 console.log(item)
})
// arr1 => [null, null, null, null, null]

Array.find(callback)

查找数组，返回满足条件的第一个元素的值

arr = [1,2,3,4,5,6]
arr.find((item)=> item > 2)
=> 3

Array.reduce()

累加器，从左到右计算

let arr = [1,2,3,4,5,6]
let value = arr.reduce((a, b) => a += b)
原理： 
1、a是数组下标为0的元素，b是数组下标为1的元素
2、当a+b（1+2） = 3 ，这个时候数组下标0和1合并
3、这个时候a数组下标为0，值为三，原本下标为2的元素，现在下标为1 [3,3,4,5,6]
4、数组 a+b依次累加 ，直到数组全部累加

Array.reduceRight()

和reduce()相似，唯一的不同就是从右往左累加

Array.from()

转换为数组

可以将字符串转换为数组
可以将集合转换为数组
列：
let str = 'hello'
let arr = Array.from(str)
=> ['h', 'e', 'l', 'l', 'o']

Array.isArray()

判断是否是数组

let str = 'hello'
let arr = ['h', 'e', 'l', 'l', 'o']
用法：
let s = Array.isArray(str) // s => false
let s = Array.isArray(arr) // s => true

Array.keys()

迭代数组的下标

有next方法 或者使用for...of迭代
const array1 = ['a', 'b', 'c'];
const iterator = array1.keys();
    for (const i of iterator) {
        console.log(i) // => 0, 1, 2
    }

Array.values()

迭代数组的值

有next方法 或者使用for...of迭代
const array1 = ['a', 'b', 'c'];
const iterator = array1.values();
    for (const i of iterator) {
        console.log(i) // a, b, c
    }

Array.entries()

迭代数组
返回一个数组对象，每个数组元素的键/值对

const array1 = ['a', 'b', 'c'];
const iterator = array1.entries();
    for (const i of iterator) {
        console.log(i)
    }
// [0, 'a'], [1, 'b'], [2, 'c']

ES6新增：

Array.some()

数组有一个元素满足条件才返回true，反之false，会遍历数组

let arr = [1,2,3,4,5,6]
let bool = arr.some((item)=> item > 7) // false
let bool = arr.some((item)=> item > 7) // true

Array.every()