js数组的方法

Array.push()

<script>
    let arr1 = [1,2,3,4,5]
    arr1.push(6)
    console.log(arr1);  //[1, 2, 3, 4, 5, 6]
</script>
// 作用：在原数组末尾添加对应的元素，然后返回数组的新长度。此方法将修改你现有的数组。

Array.pop()

<script>
    let arr8 = ['张三', '李四', '王五']
    console.log(arr8.pop());  //王五
</script>
//作用：用于删除数组的最后一个元素并返回删除的元素。

Array.unshift()

<script>
    let arr5 = [1, 2, 3]
    arr5.unshift(0)
    console.log(arr5);  //[0, 1, 2, 3]
</script>
// 作用：在原数组开头添加对应的元素，并返回数组的新长度。此方法将修改你现有的数组。

Array.shift()

<script>
    let arr9 = ['张三', '李四', '王五']
    console.log(arr8.shift());  //张三
</script>
//作用：用于把数组的第一个元素从其中删除，并返回第一个元素的值。

Array.concat()

<script>
    let arr2 = [1,2,3]
    let arr3 = [4,5,6]
    console.log(arr2.concat(arr3));   //[1, 2, 3, 4, 5, 6]
</script>
 // 作用：可以将两个或多个数组合并为一个新数组。它不会修改现有数组，而是创建一个新数组。

Array.join()

<script>
    let arr4 = [1,2,3]
    console.log(arr4.join());           //1,2,3
    console.log(arr4.join(' and '));    //1 and 2 and 3
</script>
// 作用：将数组转为字符串，用逗号分隔。结果放在一个字符串中。可以指定分隔符。
// 如果数组里面是对象，则不能用此方法

Array.sort()

<script>
    let arr6 = [3,1,5,6,2,4]
    console.log(arr6.sort((a,b)=> a-b));   //[1, 2, 3, 4, 5, 6]
    console.log(arr6.sort((a,b)=> b-a));   //[6, 5, 4, 3, 2, 1]
</script>
// 作用：对数组进行排序，接受两个参数 a b    a-b升序  b-a降序

Array.reverse()

<script>
    let arr7 = [10,20,30]
    console.log(arr7.reverse());  //[30, 20, 10]
</script>
// 作用：用于反转数组中元素的顺序。注意：不会反转数组的内容只会反转顺序本身。

Array.slice()

 <script>
    let arr10 = [1,2,3,4,5,6]
    console.log(arr10.slice(1));     //[2, 3, 4, 5, 6]
    console.log(arr10.slice(1,4));  //[2, 3, 4]
</script>
//作用：返回从原数组中指定开始下标到结束下标之间的项组成的新数组。
//slice()方法接受一或两个参数，即要返回项的起始和结束位置。
//只有一个参数的情况下， slice()方法返回从该参数指定位置开始到当前数组末尾的所有项。
//如果有两个参数，该方法返回起始和结束位置之间的项，但不包括结束位置的项。

Array.splice()

<script>
    let arr11A = [1, 2, 3, 4, 5, 6]
    let arr11B = [1, 2, 3, 4, 5, 6]
    let arr11C = [1, 2, 3, 4, 5, 6]
    //1、删除元素,并返回删除的元素
    console.log(arr11A.splice(0, 2)); //[1,2]
    // 作用：可以删除任意数量的项，只需2个参数：要删除的第一项的位置和要删除的项数。例如：        
    splice(0, 2)会删除数组中的前两项。
    //2、向指定索引处添加元素
    arr11B.splice(1, 0, 7, 8) //从1的位置开始插入 7 和 8
    console.log(arr11B);  //[1, 7, 8, 2, 3, 4, 5, 6]
    // 作用：可以向指定位置插入任意数量的项，只需3个参数：起始位置 0（要删除的项数）和要插入的项
    //3、替换指定索引位置的元素
    arr11C.splice(1, 1, 7) //从1的位置将2替换为7
    console.log(arr11C);  //[1, 7, 3, 4, 5, 6]
    // 作用：可以向指定位置插入任意数量的项，且同时删除任意数量的项，只需3个参数：起始位置、要删除的项数和要插入的任意数量的项。插入的项数不必与删除的项数相等
</script>

Array.indexOf()和Array.lastIndexOf()

<script>
    let arr12A = [1,3,5,7,9]
    let arr12B = [2,4,6,8,10]
    console.log(arr12A.indexOf(1)); //0
    console.log(arr12B.lastIndexOf(2)); //0
    console.log(arr12A.indexOf(0)); //-1
    console.log(arr12B.lastIndexOf(0)); //-1
</script>
//作用：这两个方法都返回要查找的项在数组中的下标，没找到的情况下返回-1。
//区别：indexOf：从数组的开头开始向后查找        lastIndexOf：从数组的末尾开始向前查找。

Array.filter()

<script>
    let arr13 = [1,2,3,4,5,6]
    let arr13A = arr13.filter((item,index)=>{   //item每一项  index每一项的下标
      return item >= 3
    })
    console.log(arr13A);  //[3, 4, 5, 6]
</script>
//作用：过滤功能，遍历数组中每一项，返回满足过滤条件组成的数组。

Array.fill()

<script>
    let arr14A = [1,'1','数字','字符串']
    let arr14B = [1, '1', '数字', '字符串']
    let arr14C = [1, '1', '数字', '字符串']
    console.log(arr14A.fill(0));  //[0, 0, 0, 0]              一个参数时
    console.log(arr14B.fill(0,2));//[1, '1', 0, 0]            两个参数时
    console.log(arr14C.fill(0,2,3));//[1, '1', 0, '字符串']    三个参数时
</script>
//作用：一个参数时会用该参数的值填充整个数组  两个参数时从某个位置开始填充数组  三个参数时从开始位置到结束位置填充数组

Array.every()

<script>
   let arr15 = [1,2,3]
   let arr15A = arr15.every((item)=>{   //item每一项
      return item > 0
   })
   let arr15B = arr15.every((item) => {   //item每一项
      return item > 1
   })
   console.log(arr15A);//true
   console.log(arr15B);//false
</script>
//作用：判断数组中每一项都是否满足条件，只有所有项都满足条件，才会返回 true，否则返回false

Array.some()

<script>
    let arr16 = [1, 2, 3]
    let arr16A = arr16.some((item) => {   //item每一项
      return item < 2
    })
    let arr16B = arr16.some((item) => {   //item每一项
      return item < 0
    })
    console.log(arr16A);//true
    console.log(arr16B);//false
</script>
//作用：判断数组中是否存在满足条件的项，只要有一项满足条件，就会返回 true，否则返回false

Array.reduce()和Array.reduceRight()

<script>
    let arr17 = [1,2,3]
    let arr17A = arr17.reduce((prev, item, index, array)=>{  //四个参数分别是前一个值、当前值、项的索引和数组对象
      return prev + item     //公式10+1+2+3
    },10)//数组一开始加了一个初始值10,可以不设默认0
    let arr17B = arr17.reduceRight((prev, item, index, array) => {  //四个参数分别是前一个值、当前值、项的索引和数组对象
      return prev + item     //公式0+1+2+3
    })
    console.log(arr17A);  //16
    console.log(arr17B);  //6
</script>
//作用：这两个方法都用于迭代数组的所有项(即累加器)，然后构建一个最终返回的值。
//区别：reduce()方法从数组的第一项开始，逐个遍历到最后          reduceRight()则从数组的最后一项开始，向前遍历到第一项

Array.toLocaleString()和Array.toString()

<script>
    let arr18A = [0, 1, 2]
    let arr18B = [0, 1, 2]
    console.log(arr18A.toLocaleString());   //0,1,2
    console.log(arr18B.toString());         //0,1,2
</script>
//作用：将数组转换为字符串

Array.find()和Array.findIndex()

<script>
    let arr19 = [1,2,3]
    console.log(arr19.find(((item,index,arr)=>{  //item每一项  index每一项的下标   arr原数组
      return item > 1
    }))); //2
    console.log(arr19.findIndex(((item, index, arr) => {  //item每一项  index每一项的下标   arr原数组
      return item > 1
    }))); //1
</script>
//作用：find()查找一个数组中符合条件的第一项     findIndex()查找一个数组中符合条件的第一项的下标
//区别：find()方法返回匹配的值      findIndex()返回匹配位置的下标

Array.copyWithin()

<script>
    let arr20 = [1, 2, 3, 'copy', 4, 5, 6];
    //从索引3的位置开始粘贴
    //从索引0的位置开始复制
    //遇到索引3时停止复制
    arr20.copyWithin(3, 0, 3);
    console.log(arr20);//[1, 2, 3, 1, 2, 3, 6]
</script>
//作用：用于从数组的指定位置拷贝元素到数组的另一个指定位置中。

Array.flat()和Array.flatMap()

<script>
    let arr21A = [0, 1, 2, [3, 4]]
    let arr21B = [0, 1, 2, [[[3, 4]]]]
    let arr21C = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]]
    let arr21D = [1, 2, , 4, 5]
    console.log(arr21A.flat());//[0, 1, 2, 3, 4]
    console.log(arr21B.flat(2));//[0, 1, 2, [3, 4]]
    console.log(arr21C.flat(Infinity));//[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]     使用 Infinity可展开任意深度的嵌套数组
    console.log(arr21D.flat());//[1, 2, 4, 5]       扁平化数组空项,如果原数组有空位，flat()方法会跳过空位
    
    console.log([2, 3, 4].flatMap((x) => [x, x * 2]));//[2, 4, 3, 6, 4, 8]    相当于 [[2, 4], [3, 6], [4, 8]].flat()
</script>
// flat()参数：指定要提取嵌套数组的结构深度，默认值为 1
//flat()作用：方法会按照一个可指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。

//flatMap()作用：方法对原数组的每个成员执行一个函数，相当于执行Array.prototype.map(),然后对返回值组成的数组执行flat()方法。该方法返回一个新数组，不改变原数组。  

Array.includes()

<script>
    var arr1 = [1,2,3,4,5,6]
    var arr2 = [{id:1},{id:2}]
    var str1 = 'Hello world'

    console.log(arr1.includes(1));    //true
    console.log(arr1.includes(7));    //false

    console.log(JSON.stringify(arr2));    //'[{"id":1},{"id":2}]'
    console.log(JSON.stringify(arr2).includes(2));    //true

    console.log(str1.includes('world'));    //true
    console.log(str1.includes(''));         //true
    console.log(str1.includes('hi'));         //false
</script>
//作用：用来判断一个数组是否包含一个指定的值，根据情况，如果包含则返回 true，否则返回 false

Array.map()

<script> 
    var arr = [1, 2, 3, 4, 5];
    var arr2 = arr.map(function(item){
       return item*item;
    });
    console.log(arr2);  //[1, 4, 9, 16, 25]
</script>
//作用：返回一个新数组，循环遍历数组的每一项，该方法不会改变原数组，支持return数据
//可以用来判断一个数组是否包含一个指定的值

Array.forEach()

<script> 
    var arr = [11, 22, 33, 44, 55];
    arr.forEach(function(x, index, a){
      console.log(x +  |  + index +  |  + (a === arr));
    });
    //输出为：
    //11|0|true
    //22|1|true
    //33|2|true
    //44|3|true
    //55|4|true
</script>
//作用：对数组进行遍历循环，这个方法没有返回值。
//参数分别为：遍历的数组内容；第对应的数组索引，数组本身

注：本人前端小白 ，如有不对的地方还请多多指教