js中數組常用方法總結

前言

從事前端到現在也有快兩年了，平時也會收集整理一些筆記放在印象筆記，不過收集過之後就在沒有看過，經大佬指點，真正掌握一個知識點，最好的方式就是用自己的話把內容講明白，就開始將以前零散的東西整合一下，和各位道友一起提高。

操作數組

印象中數組有很多方法，系統的整理一下，放在自己家裡方便回頭查~

1. Array.map()

   此方法是將數組中的每個元素調用一個提供的函數，結果作為一個新的數組返回，並沒有改變原來的數組

   let arr = [1, 2, 3, 4, 5]
       let newArr = arr.map(x => x*2)
       //arr= [1, 2, 3, 4, 5]   原數組保持不變
       //newArr = [2, 4, 6, 8, 10] 返回新數組
   

   　　

2. Array.forEach()

   此方法是將數組中的每個元素執行傳進提供的函數，沒有返回值，直接改變原數組，註意和map方法區分

    let arr = [1, 2, 3, 4, 5]
       num.forEach(x => x*2)
       // arr = [2, 4, 6, 8, 10]  數組改變,註意和map區分
   

   　　

3. Array.filter()

   此方法是將所有元素進行判斷，將滿足條件的元素作為一個新的數組返回

   let arr = [1, 2, 3, 4, 5]
       const isBigEnough => value => value >= 3
       let newArr = arr.filter(isBigEnough )
       //newNum = [3, 4, 5] 滿足條件的元素返回為一個新的數組
   

   　　

4. Array.every()

   此方法是將所有元素進行判斷返回一個布爾值，如果所有元素都滿足判斷條件，則返回true，否則為false：

   let arr = [1, 2, 3, 4, 5]
       const isLessThan4 => value => value < 4
       const isLessThan6 => value => value < 6
       arr.every(isLessThan4 ) //false
       arr.every(isLessThan6 ) //true
   

   　　

5. Array.some()

    此方法是將所有元素進行判斷返回一個布爾值，如果存在元素都滿足判斷條件，則返回true，若所有元素都不滿足判斷條件，則返回false：

   let arr= [1, 2, 3, 4, 5]
       const isLessThan4 => value => value < 4
       const isLessThan6 => value => value > 6
       arr.some(isLessThan4 ) //true 
       arr.some(isLessThan6 ) //false 
   

   　　

6. Array.reduce()

    此方法是所有元素調用返回函數，返回值為最後結果,傳入的值必須是函數類型：

   let arr = [1, 2, 3, 4, 5]
      const add = (a, b) => a + b
      let sum = arr.reduce(add)
      //sum = 15  相當於累加的效果
      與之相對應的還有一個 Array.reduceRight() 方法，區別是這個是從右向左操作的
   

   　　

7. Array.push()

    此方法是在數組的後面添加新加元素，此方法改變了數組的長度：
      

8. Array.pop()

    此方法在數組後面刪除最後一個元素，並返回數組，此方法改變了數組的長度：

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

   　　

9. Array.shift()

    此方法在數組後面刪除第一個元素，並返回數組，此方法改變了數組的長度：

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

   　　

10. Array.unshift()

     此方法是將一個或多個元素添加到數組的開頭，並返回新數組的長度：

    let arr = [1, 2, 3, 4, 5]
        arr.unshift(6, 7)
        console.log(arr) //[6, 7, 2, 3, 4, 5]
        console.log(arr.length) //7  
    

    　　

11. Array.isArray()

     判斷一個對象是不是數組，返回的是布爾值
     

12. Array.concat()

     此方法是一個可以將多個數組拼接成一個數組：

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

    　　

13. Array.toString()

     此方法將數組轉化為字元串：

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

    　　

14. Array.join()

      此方法也是將數組轉化為字元串：

    let arr = [1, 2, 3, 4, 5];
       let str1 = arr.toString()
       let str2 = arr.toString(',')
       let str3 = arr.toString('##')
       console.log(str1)// 12345
       console.log(str2)// 1,2,3,4,5
       console.log(str3)// 1##2##3##4##5
    

    　　

    通過例子可以看出和toString的區別，可以設置元素之間的間隔~ 

　　15.Array.splice(開始位置， 刪除的個數，元素)

   　　　　萬能方法，可以實現增刪改：
　　　　　

let arr = [1, 2, 3, 4, 5];
     let arr1 = arr.splice(2, 0 'haha')
     let arr2 = arr.splice(2, 3)
     let arr1 = arr.splice(2, 1 'haha')
     console.log(arr1) //[1, 2, 'haha', 3, 4, 5]新增一個元素
     console.log(arr2) //[1, 2] 刪除三個元素
     console.log(arr3) //[1, 2, 'haha', 4, 5] 替換一個元素

結尾

第一次寫，都是很簡單的數組用法，千里之行始於足下，重新把基礎夯實一下，如果存在錯誤或者表達不當，還望及時告知，thx

參考

MDN語法還有很多好玩的方法可以去demo
《JavaScript高級權威指南 》數組操作