js之数组内置方法

在前端开发中，我们要经常用到js中的数组的内置方法，在控制台中的打印中，我们可以看到数组中的内置方法。

1. Array.concat()
   该方法可以合并一个或者多个数组

   let arr = [1,2,3];
   let arr1 = [4,5,6];
   let arr2 = [7,8,9];
   let newArr = arr.concat(arr1);  //[1,2,3,4,5,6]
   let newArr1 = arr.concat(arr1,arr2);  //[1,2,3,4,5,6,7,8,9]

2. Array.copyWithin()
   该方法复制数组内的某些值到到另一个索引位置，用法arr.copyWithin(target,start,end)执行后，该数组发生改变，可以传三个参数
   target 是目标索引
   start 复制源索引的开始,可以忽略，默认为0，复制源包含该索引的值
   end 复制源索引的结束，可以忽略，默认为arr.length+1，复制源不包含该索引的值

   let arr = [1,2,3,4,5,6];
   let arr1 = [1,2,3,4,5,6];
   let arr2 = [1,2,3,4,5,6];
   let arr3 = [1,2,3,4,5,6];
   arr.copyWithin(0,2,3); //[3,2,3,4,5,6]
   arr1.copyWithin(0,2,4); //[3,4,3,4,5,6] 这里可以看到如果复制源为多个值,他也会替换掉目标索引后面的值
   arr2.copyWithin(3) //[1,2,3,1,2,3]  这里默认start=0，end=5，也就是整个数组都是复制源，从目标索引为3的位置开始复制，因为后面只有三个位置，所以复制源后面的4,5,6就没有再复制，也就是数组长度不会变
   arr3.copyWithin(3,-2,-4) //[1, 2, 3, 3, 4, 6] 负数的时候从右边开始算

3. Array.every()
   遍历数组，遍历的时候检测一旦有值不符合就返回false,他的使用arr.every(callback(item,index,array)，thisArg)，参数callback为一个函数，该函数可以传三个参数每项的值item，该值索引index以及原数组array，thisArg为执行callback时this指向，该方法不会改变原来数组。

   var arr = [2,5,6,7,4,5];
   var arr1 = [15,34,55,654,4343];
   arr.every(function(item,index.array){
     return item>5
   }) //false
   arr1.every(function(item,index,array){
     return item>5
   }) //true

4. Array.fill()
   向数组特定位置插入某个值，使用fill(value,start,end)；value要插入的值，start插入的开始索引，默认为0，end插入的结束索引，默认为array.length

   [1,2,3,4,5].fill(3) //[3,3,3,3,3]
   [1,2,3,4,5].fill(3,2) //[1,2,3,3,3]
   [1,2,3,4,5].fill(3,2,4) //[1,2,3,3,5]
   [1,2,3,4,5].fill(3,-5,-2) //[3, 3, 3, 4, 5]  start和end允许负值

5. Array.filter()
   通过遍历数组来过滤某些值，它的使用arr.fill(callback(item,index,array)，thisArg)，参数callback为一个函数，该函数可以传三个参数每项的值item，该值索引index以及原数组array，thisArg为执行callback时this指向,该方法不会改变原来数组。

   [null,1,2,3,4,null].filter(function(item,index,array){
    return item
   }) //[1,2,3,4]

6. Array.find()
   查找数组的第一次出现的值，它的使用arr.find(callback(item,index,array)，thisArg)，参数callback为一个函数，该函数可以传三个参数每项的值item，该值索引index以及原数组array，thisArg为执行callback时this指向,该方法不会改变原来数组。

   var arr= [
   {
   name:"教师1",
   teaid:1
   },
   {
   name:"教师2",
   teaid:2
   },
   {
   name:"教师1",
   teaid:3 
   }
   ]
   arr.find(function(item,index,array){
     return item.name=="教师1"
   })  // {name: "教师1", teaid: 1} 只返回找到的第一个值

7. Array.findIndex()
   查找数组的第一次出现的值的索引，没有找到返回-1，它的使用arr.findIndex(callback(item,index,array)，thisArg)，参数callback为一个函数，该函数可以传三个参数每项的值item，该值索引index以及原数组array，thisArg为执行callback时this指向,该方法不会改变原来数组。

    [1,2,3,4].findIndex(function(item,index,array){
       return item == 2
     }) //1
    [1,2,3,4].findIndex(function(item,index,array){
       return item == 25
     }) //-1

8. Array.flat()
   通过遍历可以将数组内的数组合并成为一个数组，用法arr.flat(deep) 参数deep为合并的层数，该方法会改变原数组

   [1,2,[3,4,[5,6]],7,8].flat() //[1,2,3,4,[5,6],7,8]
   [1,2,[3,4,[5,6]],7,8].flat(2) //[1,2,3,4,5,6,7,8]

9. Array.forEach()
   该方法可以遍历数组内的每一项，用法arr.forEach(callback(item,index,array),thisArg)，该方法不会改变数组本身

   var arr= [
   {
      name:"教师1",
      teaid:1
   },
   {
      name:"教师2",
      teaid:2   
   },
   {
      name:"教师1",
      teaid:3 
   }]
   arr.forEach((item,index,array)=>{
        console.log(item.name)
    })// 教师1 教师2 教师1

10. Array.includes()
    判断数组中是否含有某个值，如果有返回true，没有返回false，用法arr.includes(value,checkIndex),checkIndex表示数组从下标几开始查找。

    var arr=["hello","world"]
    arr.includes("hello") //true
    arr.includes("hello",1)//false

11. Array.indexOf()
    查找数组中是否含有某个值，如果有返回找到的第一个值的下标，没有返回-1,用法arr.includes(value,checkIndex),checkIndex表示数组从下标几开始查找

    var arr=[1,2,3,4,5]
    arr.indexOf(1)//0
    arr.indexOf(4)//3
    arr.indexOf(2,3)//-1

12. Array.join()
    将数组内的值全部拼成一个字符串,用法arr.join(partition),partition是指定某个字符将数组内的元素隔开，默认为","

    var arr=["hello","world"]
    arr.join(); //"hello,world"
    arr.join("-"); //"hello-world"
    arr.join(" "); //"hello world"

13. Array.lastIndexOf()
    和indexOf()相似，该方法会返回数组中最后一个值的下标,没有返回-1,只是checkIndex是从该下标开始逆向查找

    var arr=[1,2,1,4,5,4,2]
    arr.lastIndexOf(1)//2
    arr.lastIndexOf(6)//-1
    arr.lastIndexOf(2,3)//1

14. Array.map()
    遍历数组，并根据处理返回一个新的数组，但是不会改变原来数组，和forEach用法类似，与forEach区别是map()方法要有返回值；

    var arr=[1,2,3,4];
    var newArr=arr.map((item,index,array)=>{
                            return item+2
                       })
    arr //[1,2,3,4]
    newArr //[3,4,5,6]

15. Array.pop()
    删除数组最后一个值并返回数组最后一个值，该方法会改变原来数组

    var arr=[1,2,3,4,5]
    var lastNum=arr.pop();
    lastNum//5
    arr//[1,2,3,4]

16. Array.push()
    从数组尾部添加元素并返回数组改变后的数组长度，该方法会改变原来数组

     var arr=[1,2,3,4,5]
     var arrlength=arr.push(6);
     arr.push(6,7,8,9);
     arr //[1,2,3,4,5,6]
     arrlength //6

17. Array.reverse()
    将原数组反转，该方法会改变原数组

    var arr=[1,2,3,4,5]
    arr.reverse()
    arr// [5,4,3,2,1]

18. Array.shift()
    删除数组中的第一个元素，该方法会改变原数组

    var arr=[1,2,3,4,5]
    var shiftNum=arr.shift();
    shiftNum//1
    arr//[2,3,4,5]

19. Array.unshift()
    从数组开始位置添加数据，该方法会改变原数组

    var arr=[1,2,3,4,5]
    var length=arr.unshift(0);
    length//6
    arr//[0,1,2,3,4,5]

20. Array.slice()
    提取数组特定下标范围内的值，用法arr.slice(start,end)，start开始提取的下标值，end结束提取的下标值（提取出来的数组包含start下标的元素值，不包含end下标的元素值），该方法不会改变数组

    var arr=[1,2,3,4,5]
    var sliceArr=arr.slice(1,2)
    arr// [1,2,3,4,5]
    sliceArr//[2]

21. Array.some()
    遍历判断数组内是否符合要求的元素，只有有一个就返回true，没有就返回false，它的使用arr.some(callback(item,index,array)，thisArg)，参数callback为一个函数，该函数可以传三个参数当前处理的数组元素item，该值索引index以及原数组array，thisArg为执行callback时this指向,该方法不会改变原来数组。
    //判断是否有大于2的元素

    [null,1,2,3,4,null].some(function(item,index,array){
       return item>2
    })//true 

22. Array.sort()
    对数组进行排序，用法arr.sort(callback(compareFir,compareSed)),compareFir、compareSed分别是比较的第一个和第一个元素，该方法会改变原来数组排序；

    var arr=[1,56,2,54,776];
    arr.sort() // arr=[1,2,54,56,776]
     //也可以用于成绩排序之类的
    var stuScore=[
    {
       stuName:'job',
       score:45,
     },
     {
       stuName:'jack',
       score:4
     },
     {
       stuName:'tom',
       score:90,
     },
     {
       stuName:'alice',
       score:89,
      },
      {
       stuName:'lei',
       score:63,
      }
      ]
      stuScore.sort((firVal,sedVal)=>{
       if(firVal.score>sedVal.score){
          return 1
      }else{
          return -1
      }
      return 0
      })
      console.log(stuScore) //
      [
      {stuName: "jack", score: 4}
      {stuName: "job", score: 45}
      {stuName: "lei", score: 63}
      {stuName: "alice", score: 89}
      {stuName: "tom", score: 90}
      ]

23. Array.splice()
    该方法可以删除或者向数组内添加元素，用法arr.splice(start,deleteSum,item1,item2...),start表示开始删除或者添加开始的下标,deleteSum表示要删除元素的个数，要添加元素时，deleteSum应为0或者为负数，item1,item2...这些表示要添加的元素,该方法会修改原来数组。

    var arr=[1,2,3,4,5];
    var spliceArr=arr.splice(2,2) //此时arr为[1,2,5],spliceArr为[3,4]
    arr.splice(2,0,5,6) //此时arr为[1,2,5,6,3,4,5]

24. Array.toString()
    将数组转换成字符串，

    var arr = [1,2,3,4,5]
    arr.toString() //"1,2,3,4,5" 该方法不会改变原数组，arr依然是[1,2,3,4,5]