面试必备：数组的常用方法

什么是数组？

        数组（Array）是一种有序的元素序列，用于存储多个相同类型的数据集合。在计算机科学中，数组是一种数据结构，由相同类型的元素组成，并分配一块连续的内存空间。数组的定义包括有序的元素序列，数组名用于命名由有限个相同类型变量组成的集合。每个变量称为数组的分量或元素。数组提供了一个统一的数组名和不同的下标来确定数组中的元素。通过下标，我们可以访问数组中特定位置的元素。数组是一种最简单的复合数据类型，可用于存储字符串、数字、对象等多种数据类型。总体而言，数组在编程中是一种重要的数据结构，用于有效地组织和存储数据。数组的方法有很多种，我们在开发中常用有以下这些，我把它分为了几类：

数组的常用方法

修改数组：

        1.新增：

              push(): 在数组的末尾添加一个或多个元素，并返回新的数组长度。

let arr = [1,2,3,4,5]
let res = arr.push(6,7,8)
console.log(res) //8  表示arr的长度
console.log(arr) //[1,2,3,4,5,6,7,8] push方法直接操作原数组，会改变原数组

             unshift(): 在数组的开头添加一个或多个元素，并返回新的数组长度。

let arr = [3,4,5]
let res = arr.unshift(1,2)
console.log(res) //5  表示arr的长度
console.log(arr) //[1,2,3,4,5] push方法直接操作原数组，会改变原数组

        2.移除（删除）：

                pop(): 移除数组的最后一个元素，并返回该元素的值。

let arr = [1,2,3]
let res = arr.pop()
console.log(res) //3  pop方法会返回我们删除的元素
console.log(arr) //[1,2] pop方法直接操作原数组，会改变原数组

                shift():移除数组的第一个元素，并返回该元素的值。

let arr = [1,2,3]
let res = arr.unshift()
console.log(res) //1  unshift方法会返回我们删除的元素
console.log(arr) //[2,3] unshift方法直接操作原数组，会改变原数组

                splice()： 删除数组中的指定元素，使用splice()会影响到原数组，会将指定元素从原数组中删除，同时splice方法还可以新增、替换。

                splice()的参数：第一个：表示开始位置的索引 、第二个：表示删除的数量、 第三个及以后.. ：可以传递一些新的元素，这些元素将会自动插入到开始位置索引前边

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

// 添加
let res = arr.splice(0,0,0); // [] 如果删除一个元素，则返回一个元素的数组。 如果未删除任何元素，则返回空数组
console.log(arr); //[0,1,2,3,4,5]

// 修改
let res = arr.splice(0,1,23);//  [1]
console.log(arr); //[23,2,3,4,5]

// 删除
let res = arr.splice(0,1);// [1]
console.log(arr);  //[2,3,4,5] 

我们在开发中需要根据实际的情况选择使用哪种方法进行新增或则删除

访问数组元素

        1.通过索引访问数组元素。

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

        2.slice(start, end):返回一个新数组，包含原数组中从 索引start到 end（不包括 end）的元素。如果该参数为负数，则表示从原数组中的倒数第几个元素开始提取

let arr= [1,2, 3, 4, 5];
let myBest = arr.slice(1,2); 
console.log(myBest ) // [2]
let myBest = arr.slice(-3,-1); // 截取倒数第三个（包含）到倒数第一个（不包含）的两个元素
console.log(myBest ) // [3,4]
let myBest = arr.slice(-3);  // 截取最后三个元素
console.log(myBest) //[3, 4, 5]

        3.indexOf()方法用于查找数组中给定元素的第一个索引，如果存在即返回该元素的索引号，否则返回-1。

 const arr = [1, 2, 3, 2]
    console.log(arr.indexOf(2)); // 1

         4.lastIndexOf()方法用于查找数组中给定元素的最后一个索引，如果存在即返回该元素的索引号，否则返回-1。

const arr = [1, 2, 1]
    console.log(arr.lastIndexOf(1)); // 2

        5.findIndex()用于判断一个数组中是否存在某个元素符合条件，符合则返回数组中的该元素的索引，不符合则返回-1。

let arr = [1, 2, 3]
let i = arr.findIndex(function (item) {
      return item == 3
    })
    console.log(i); // 2

 数组翻转、排序

         1.reverse()翻转数组，返回新的数组

let arr = [1, 2, 3]
newArr = arr.reverse()
console.log(newArr); // [3, 2, 1]

        2.sort()数组排序，类似冒泡排序的效果，返回值为一个新的数组。

let arr = [3, 1, 2]
let newArr = arr.sort(function (a, b) {
      return a - b
    })
console.log(newArr); //[1, 2, 3]

遍历数组

        1.forEach(callback): 对数组的每个元素执行提供的回调函数

let arr= [1,2, 3, 4, 5];
        arr.forEach(function(item,index){
            console.log(item); //每一项
            console.log(index);//每项对应的索引
        })

        2.map(callback): 创建一个新数组，其结果是原数组中每个元素调用回调函数的返回值。

 
// 被遍历数组.filter(function(当前数组元素，当前数组元素索引（可省略）) {return 处理内容（例：item+10）})
    const arr = [1, 2, 3, 4, 5]
    arr1 = arr.map(item => item * 10)
    console.log(arr1); // [10, 20, 30, 40, 50]

过滤、查找、合并

        1.filter(callback): 创建一个新数组（不会影响原数组），其中包含通过指定函数实现的测试的所有元素。如果没有符合条件的，返回空数组。

被遍历数组.filter(function(当前数组元素，当前数组元素索引（可省略）) {return 筛选条件})

let arr = [1, 2, 3, 4, 5]
let newArr= arr.filter(item => item >= 2)
console.log(newArr); //[2, 3, 4, 5]

        2.find(callback): 返回数组中通过测试提供的函数的第一个元素的值。arr.find(function (item) {return item == '查找条件'})

let arr = [1, 2, 3, 4]
let newArr= arr.find(item => item > 3)
console.log(newArr); // 4

        3.every()方法用于检测数组所有元素是否都符合指定条件，如果都符合返回 true ，否则返回false。 数组.every(function (item) {return 指定条件(例：item >= 20)}) // true或false

    let arr = [1, 2, 3, 4]
    let newArr = arr.every(item => item > 2)
    console.log(newArr); //false

        4.some()方法用于检测数组中的元素是否满足指定条件，只要有一个元素满足条件返回 true ，否则返回false. 数组.some(function (item) {return 指定条件(例：item >= 20)}) // true或false

    let arr = [1, 2, 3, 4]
    let newArr= arr.some(item => item > 3)
    console.log(newArr); // true

        5.concat()方法用于合并两个数组，返回生成新数组，利用展开运算符也可达到合并数组的效果

const arr1 = [1, 2, 3]
const arr2 = [4, 5]
console.log(arr1.concat(arr2)); // [1, 2, 3, 4, 5]

伪数组转换真数组

数组的静态方法Array.from()，可用于把伪数组转换为真数组。

let arr= [1,2, 3, 4, 5];
console.log(new Set(arr)); //Set(5) {1, 2, 3, 4, 5}
let newArr = Array.from(new Set(arr))
console.log(newArr); //(5) [1, 2, 3, 4, 5]

数组转字符串

        1.toString()方法用于把数组转换成字符串，逗号分割每一项，返回值为一个字符串。

const arr = [1, 2, 3]
    console.log(arr.toString()); // 1,2,3

         2.join(‘分隔符’)用于把数组的所有元素转换为一个字符串，join方法如果不传入参数，则默认按照‘，’拼接元素，返回值为一个字符串。

const arr = [1, 2, 3]
    console.log(arr.join('-')); // 1-2-3

求累计值（求和）

   reduce(callback,initialValue) 方法对数组中的每个元素按序执行一个提供的 reducer 函数，每一次运行 reducer 会将先前元素的计算结果作为参数传入，最后将其结果汇总为单个返回值。第一次执行回调函数时，不存在“上一次的计算结果”。如果需要回调函数从数组索引为 0 的元素开始执行，则需要传递初始值。否则，数组索引为 0 的元素将被用作初始值，迭代器将从第二个元素开始执行（即从索引为 1 而不是 0 的位置开始）

参数一：callback（accumulator, currentValue,currentValue ,array)

        accumulator：上一次调用 callback 的结果。在第一次调用时，如果指定了 initialValue 则为指定的值，否则为 array[0] 的值

        currentValue：当前元素的值。在第一次调用时，如果指定了 initialValue，则为 array[0] 的值，否则为 array[1]

        currentValue: 在数组中的索引位置。在第一次调用时，如果指定了 initialValue 则为 0，否则为 1

   array:调用了 reduce() 的数组本身

参数二：initialValue ：第一次调用回调时初始化 accumulator 的值。

         如果指定了 initialValue，则 callback 从数组中的第一个值作为 currentValue 开始执行。如果没有指定 initialValue，则 accumulator 初始化为数组中的第一个值，并且 callback 从数组中的第二个值作为 currentValue 开始执行。在这种情况下，如果数组为空（没有第一个值可以作为 accumulator 返回），则会抛出错误。

const array1 = [1, 2, 3, 4];
const initialValue = 0;
const sumWithInitial = array1.reduce(
  (accumulator, currentValue) => accumulator + currentValue,
  initialValue,
);

console.log(sumWithInitial); //10

        像 reduce() 这样的递归函数可能非常强大，但有时可能很难理解，特别是对于缺乏经验的 JavaScript 开发人员。如果使用其他数组方法可以使代码更清晰，则开发人员必须权衡代码可读性与使用 reduce() 带来的好处。如果 reduce() 确实是最佳选择，应该通过良好的文档和语义化的变量命名来提高代码的可读性。

        总体而言，选择使用哪些方法还是取决于具体的需求。通常情况下，数组的方法中有些是可以互换使用，但在一些特殊情境中还是要根据具体的需求来进行选择使用。

总结：

面试官： 数组的常用方法有哪些？

我们可以这样回答：

        数组的方法有很多种，我们在开发中常用有以下这些，我把它分为了几类：

修改数组：

        1.新增：

                push(): 在数组的末尾添加一个或多个元素，并返回新的数组长度。

                unshift(): 在数组的开头添加一个或多个元素，并返回新的数组长度。

        2.移除：

                pop(): 移除数组的最后一个元素，并返回该元素的值。

                shift():移除数组的第一个元素，并返回该元素的值。

                splice()： 删除数组中的指定元素，使用splice()会影响到原数组，会将指定元素从原数组中删除。splice()的参数：第一个：表示开始位置的索引 、第二个：表示删除的数量、 第三个及以后.. ：可以传递一些新的元素，这些元素将会自动插入到开始位置索引前边。我们在开发中需要根据实际的情况选择使用哪种方法进行新增或则删除

访问数组元素

        1.通过索引访问数组元素。

        2.slice(start, end):返回一个新数组，包含原数组中从 索引start到 end（不包括 end）的元素。

遍历数组

        1.forEach(callback): 对数组的每个元素执行提供的回调函数

        2.map(callback): 创建一个新数组，其结果是原数组中每个元素调用回调函数的返回值。

过滤和查找

        1.filter(callback): 创建一个新数组，其中包含通过指定函数实现的测试的所有元素。

        2.find(callback): 返回数组中通过测试提供的函数的第一个元素的值。

        这些只是数组方法的一部分，JavaScript 数组还有很多其他方法可供使用。这些方法在不同的情境中发挥作用，可以根据实际需求选择合适的方法。比如我们可能需要拼接数组可以使用concat() 连接两个或多个数组（不会影响原数组），可以使用 join() 把数组转字符串，使用reverse() 反转数组，使用sort() 数组进行排序，使用reduce()方法进行求和操作等等。总体而言，选择使用哪些方法还是取决于具体的需求。通常情况下，数组的方法中有些是可以互换使用，比如使用 reduce() 来替代 .filter().map()方法，但在一些特殊情境中还是要根据具体的需求来进行选择使用。