大家有没有想过，js数组为什么会有这么多的方法，没错，就是为了不同场景下处理数据的需要，就像设计模式一样，都是为了能更好的处理当前场景的需要。

首先怎么创建一个数组呢，

// 两种方式

// 1,构造函数模式 （Array,是浏览器引擎自动创建的构造函数，js 所有直接可用的东西都是浏览器默认创建的，各个浏览器厂商根据ECMAScript的标准去默认支持）

let arr = new Array()

// 2，字面量表示法

let arr2 = []

console.log(arr,'arr')

console.log(arr2,'arr2')

1,基本方法 判断数组 数组的增删改查 转换成字符串 合并数组

1.1 判断是否是一个数组 isArray

// Array.isArray()  返回 boolean 值

let arr = [1,2]

let isArr =  Array.isArray(arr)

console.log(isArr)

// true

// 可以看到，arr是一个数组，如果不是，返回false

1.2 向数组里添加数据 push unshift

// 从数组后面添加数据 push

let arr = [1,2]

arr.push(3) //可以push 一个或多个如 arr.push(3,4)

console.log(arr) // [1,2,3]

// 从数据前面添加数据 unshift

let arr2 = [1,2]

arr2.unshift(0);

console.log(arr2); //[0,1,2]

1.3 从数组里删除数据 pop shift

// 删除数组最后一位数据 pop

let arr = [1,2,3]

arr.pop()

console.log(arr) // [1,2]

// 删除数组第一位数据 shift

let arr2 = [1,2,3]

arr2.shift()

console.log(arr2) // [2,3]

1.4 改变数组数据 splice

// splice(index,num,data) // index => 数组下标 num => 删除的数量 data => 插入的数据

let arr = [1,2,3]

//示例 替换数组第二个元素数字2为数字4

arr.splice(1,1,4)

console.log(arr) // [1,4,3]

1.5 查找数组中的数据 indexOf lastIndexOf includes

//indexOf(data,index) lastIndexOf(data,index); data=> 要查找的数据，index（可选项） 从那个下标开始查

//indexOf()从数组的开头（位置0）开始向后查找，lastIndexOf()方法则从数组的末尾开始向前查找,返回找到的下标 没有找到返回 -1

// includes,意思包含包括，判断是否包含，返回boolean值

let arr = [1,2,3]

let index = arr.indexOf(1)

let index2= arr.indexOf(7)

console.log(index) // 0

console.log(index2) // -1

let arr2 = [1,2,3,4]

let index3 = arr.lastIndexOf(3)

let index4 = arr.lastIndexOf(8)

console.log(index3) // 2

console.log(index4) // -1

let arr3 = [1,2,3,4]

let index5 = arr.includes(3)

console.log(index5) // true

1.6 数组转换成字符串 join(str)

// join(str)  // 默认以逗号 , 连接，可以指定连接符

let arr = [1,2,3]

let str =  arr.join('-')

console.log(str) // 1-2-3

1.7 数组合并（扩展）concat

// join  // 默认以逗号 , 连接，可以指定连接符

let arr = [1,2,3]

let arr2 = [4,5,6]

let arr3 = arr.concat(arr2)

console.log(arr)

console.log(arr2)

console.log(arr3)

// [1, 2, 3]

// [4, 5, 6]

// [1, 2, 3, 4, 5, 6]

// 可以看到原数组都没变，concat之后返回一个新数组

// es6 数组的扩展 (... 扩展运算符)

let arr4 = [1,2,3]

arr5 = [...arr4,4,5,6]

console.log(arr4)

console.log(arr5)

// [1, 2, 3]

// [1, 2, 3, 4, 5, 6]

2.数组的迭代方法 什么是迭代，对于js数组来说，就是通过遍历原数组执行callback的过程

2.1 Array.every(callback) 遍历数组 执行callback函数的条件 返回 Boolean 值

let arr = [1,2,3,5,6]

let data = arr.every((item,index)=> {

    console.log(item,index)

    return item < 3

})

console.log(data,'data')

// 1,0

// 2,1

// 3,2

// false data

// 可以看到，当循环到第一个不符合条件时，终止遍历，同时返回 boolean

2.2 Array.some(callback) 遍历数组 执行callback函数的条件 返回 Boolean 值

let arr = [1,2,3,5,6]

let data = arr.some((item,index)=> {

    console.log(item,index)

    return item < 3

})

console.log(data,'data')

// 1,0

// true data

// 当有一个符合，终止遍历，同时返回 boolean

2.3 Array.filter(callback) 遍历数组 执行callback函数的条件 返回 符合条件的新数组

let arr = [1,2,3,5,6]

let data = arr.filter((item,index)=> {

    console.log(item,index)

    return item < 3

})

console.log(data,'data') // [1,2]

// filter 过滤，每一项都参与了循环

2.4 Array.map(callback) 遍历数组 执行callback函数的条件 全部执行后返回新的数组

let arr = [1,2,3,5,6]

let data = arr.map((item,index)=> {

    console.log(item,index)

    return item*2

})

console.log(data,'data') //  [2, 4, 6, 10, 12]

// map 映射，每一项都参与了循环，通过callback函数后 返回新的数组

2.5 Array.reduce(callback(previousValue,currentValue,index,array))

//callback （执行数组中每个值的函数，包含四个参数）

// 1、previousValue  上一次调用回调返回的值，或者是提供的初始值（initialValue）

// 2、currentValue  数组中当前被处理的元素

// 3、index  当前元素在数组中的索引）

// 4、array  调用 reduce 的数组

// 注：如果是第一次调用 callback，previousValue 为第一个元素的值,currentValue 是第二个元素的值

let arr = [1,2,3,5,6]

let data = arr.reduce((previousValue,currentValue,index)=> {

    console.log(previousValue,currentValue,index)

    return previousValue +  currentValue

})

console.log(data,'data') //  [2, 4, 6, 10, 12]

// 1 2 1

// 3 3 2

// 6 5 3

// 11 6 4

// 17 'data'

// 可以看出来，第一次执行callback的时候，是执行数组的第二个元素，其中 previousValue 为第一个元素的值,currentValue 是第二个元素的值

// 注：不管 reduce 作为累加累乘还是取最大值，其都是 拿callback的值和下一个元素再去执行callback,大家记住这一点就可以

2.6 Array.forEach(callback) 遍历数组 执行callback 不返回新值，只是遍历操作

let arr = [1,2,3,5,6]

let arr2 = []

arr.forEach((item,index)=> {

    console.log(item,index)

    arr2.push(item*2)

})

console.log(arr2,'data') //  [2, 4, 6, 10, 12]

// forEach 遍历循环，每一项都参与了循环，执行callback函数

2.7 Array.find(callback) 遍历数组 找到符合callback的项，中断循环并返回，没有找到返回 underfined

let arr = [1,2,3,5,6]

let item =  arr.find((item,index)=> {

    console.log(item,index)

    return item > 4

})

console.log(item,'data')

// 1 0

// 2 1

// 3 2

// 5 3

// 5 'data' 元素

// 可以看到，当遍历到 5时，跳出了循环

2.8 Array.findIndex(callback) 遍历数组，返回数组中第一个满足条件的索引(从0开始), 不满足返回-1

let arr = [1,2,3,5,6]

let item =  arr.findIndex((item,index)=> {

    console.log(item,index)

    return item > 4

})

console.log(item,'data')

// 1 0

// 2 1

// 3 2

// 5 3

// 3 'data' 下标3

// 可以看到，当遍历到下标3时，跳出了循环

上面是开发中常用的数组的方法，基本能够满足开发中绝大部分的场景