JavaScript数组方法

JavaScript数组方法：

1. 推荐使用字面量方式声明数组，而不是 Array 构造函数
2. 实例方法 forEach 用于遍历数组，替代 for 循环 (重点)
3. 实例方法 filter 过滤数组单元值，生成新数组(重点)
4. 实例方法 map 迭代原数组，生成新数组(重点)
5. 实例方法 join 数组元素拼接为字符串，返回字符串(重点)
6. 实例方法 find 查找元素， 返回符合测试条件的第一个数组元素值，如果没有符合条件的则返回 undefined(重点)
7. 实例方法every 检测数组所有元素是否都符合指定条件，如果所有元素都通过检测返回 true，否则返回 false(重点)
8. 实例方法some 检测数组中的元素是否满足指定条件 如果数组中有元素满足条件返回 true，否则返回 false
9. 实例方法 concat 合并两个数组，返回生成新数组
10. 实例方法 sort 对原数组单元值排序
11. 实例方法 splice 删除或替换原数组单元
12. 实例方法 reverse 反转数组
13. 实例方法 findIndex 查找元素的索引值

JavaScript数组方法具体使用：

1. forEach（）遍历数组

注意：

1.forEach 主要是遍历数组

2.参数当前数组元素是必须要写的， 索引号可选

forEach 就是遍历  加强版的for循环  适合于遍历数组对象

const arr = ['red' , 'blue' , 'pink']
        const re = arr.forEach(function(ele , index){
            console.log(ele)  // 数组元素  red blue pink
            console.log(index) // 数组索引号
        })
        console.log(re)  // 返回值为 undefined

2. filter（）筛选数组

filter() 方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素

主要使用场景： 筛选数组符合条件的元素，并返回筛选之后元素的新数组

const arr = [10, 20, 30]
        const newArr = arr.filter(function (item , index) {
            console.log(item)
            console.log(index)
            return item >= 20
        })
        // 返回的符合条件的新数组
        console.log(newArr)  // [20 , 30]

3. some（）方法

实例方法 some 检测数组中的元素是否满足指定条件 如果数组中有元素满足条件返回 true，否则返回 false

some() 方法测试数组中是否至少有一个元素通过了被提供的函数测试。

返回值：Boolean类型的值

const arr = [1, 2, 3, 4, 5 ]
        const re = arr.some(function(ele , index){
            return ele === 3
        })
        console.log(re)  // true
        console.log(arr.some((ele , index) => ele > 5 )) // false

4. every（）方法

实例方法 every 检测数组所有元素是否都符合指定条件，如果所有元素都通过检测返回 true，否则返回 false(重点)

返回值：Boolean

const arr = [18 , 100 , 34 , 43, 90]
// 检测是否数组中所有的元素都大于 30
console.log(arr.every((ele , index) => ele > 30))  // false
// 检测是否数组中所有的元素都小于 188
console.log(arr.every((ele , index) => ele < 188))  // true

5. reduce（）方法

第一次执行回调函数时，不存在“上一次的计算结果”。如果需要回调函数从数组索引为 0 的元素开始执行，则需要传递初始值。否则，数组索引为 0 的元素将被作为初始值 initialValue，迭代器将从第二个元素开始执行（索引为 1 而不是 0）。

语法：arr.reduce(function(上一次值 ， 当前值) ， 初始值)

        // // 1. 没有初始值
        // const total = arr.reduce(function(prev , current) {
        //     return prev + current
        // } )
        // console.log(total)  // 20
        // 执行过程
        // 上一次值    当前值     返回值
        //   1          7          8
        // 上一次值    当前值     返回值
        //   8          9          17
        // 上一次值    当前值     返回值
        //   17         3         20

        // 2. 有初始值
        const total = arr.reduce(function(prev , current) {
            return prev + current
        } , 10)
        console.log(total)  // 30
        // 执行过程
        // 上一次值    当前值     返回值
        //   10         1         11
        // 上一次值    当前值     返回值
        //   11         7        18
        // 上一次值    当前值     返回值
        //   18         9         27
        // 上一次值    当前值     返回值
        //   27         3         30
        
       ** // 将二维数组转化为一维数组**
        let arr1 = [[1,2] , [3,4] , [5,6]].reduce(function(prev , current) {
            return prev.concat(current)
        } , [])
        console.log(arr1)

6. concat（）合并数组方法

concat() 方法用于合并两个或多个数组。此方法不会更改现有数组，而是返回一个新数组。

const array1 = [1, 2]
const array2 = [1, 2]
const array3 = array1.concat(array2)
console.log(array3) [1 , 2 , 1, 2]

// concat(value1 , value2)
const num1 = [1, 2, 3];
const num2 = [4, 5, 6];
const num3 = [7, 8, 9];
const numbers = num1.concat(num2, num3);
console.log(numbers);
// results in [1, 2, 3, 4, 5, 6, 7, 8, 9]

7. 数组map（）方法（重点）

map 可以遍历数组处理数据，并且返回新的数组

注意：

map 也称为映射。映射是个术语，指两个元素的集之间元素相互“对应”的关系。

map 重点在于有返回值，forEach没有返回值（undefined）

 const arr = ['red', 'blue', 'pink']
//  数组 map方法 处理数据并且 返回一个数组
 const newArr = arr.map(function (ele, index) {
// console.log(ele)  // 数组元素
// console.log(index) // 索引号
       return ele + '颜色'
})
console.log(newArr)  // 返回一个新数组

8. 数组join（）方法

join() 方法将一个数组（或一个类数组对象）的所有元素连接成一个字符串并返回这个字符串，用逗号或指定的分隔符字符串分隔。如果数组只有一个元素，那么将返回该元素而不使用分隔符。

返回值： 一个所有数组元素连接的字符串。如果 arr.length 为 0，则返回空字符串。

const arr = ['red', 'blue', 'pink']
// 数组join方法  把数组转换为字符串
// 小括号为空则逗号分割
console.log(arr.join())  // red,blue,pink
// 小括号是空字符串，则元素之间没有分隔符
console.log(arr.join(''))  //redbluepink
console.log(arr.join('|'))  //red|blue|pink