es6 的數組的方法


  es6 數組的拓展

  數組的類 Array 

  數組的定義:

    1. var arr=[];

    2. var arr=new Array(3)  // 3 代表有三個元素

      arr[0]=12;

      arr[1]=24;

      arr[2]=36;

    3. var arr=new Array("zhang","lisi","wang");

  [] 代表空數組  [empty] 代表一個空元素

    var arr=new Array("4");

    代表有一個元素 為 4 

  var arr=new Array(3) 與 var arr=new Array("3") 的區別?

  第一個的 3 代表,這個數組中有 3 個元素, 第二個的 3 代表,這個數組中有一個元素,為3

  數組的方法:

  1. of()   他是 Array 類上的方法

    var arr=Array.of(4);

    console.log(arr) // [4] 返回一個數組,里面有一個元素為 4 

  2. forEach()  他是原型的方法,用於對數組的遍歷,返回值 undefined

    案例:

    var arr=[12,23,56,96,105];

    var as = arr.forEach((item,index)=>{

       // item  代表元素  index 代表索引

       console.log(item) 

      console.log(index)

    })

    console.log(as) // undefined 

  3. map 原型上的方法,用於數組遍歷加工,  返回值:仍然是個新數組,  參數:回調函數  

    var arr=[12,36,85,96,102];

    var as = arr.map((item,index)=>{

      return item+3;  // 此方法一定要 return             

    })

  4. filter 過濾  從數組中找出所有的指定條件的元素,並返回成一個新的數組,不改變原有數組   return 返回值是 true 就保留,返回值是 false 就不保留

    var arr=[

      {name:"zhang",age:20},

      {name:"lisi",age:10}

    ];

    var as=arr.filter((item,index)=>{

      // item 元素  index 索引

      return item.age>15;    // 條件語句的返回值 true 和 false

    })

    console.log(as)  // 返回滿足條件的 {name:"zhang",age:20};

  5. find:查找,查找第一個滿足條件的元素  參數:回調函數  返回值:第一個滿足條件的元素

    var arr=[

      {name:"zhang",age:20},

      {name:"lisi",age:30},

      {name:"wang",age:15}

    ]

    var as=arr.find((item,index)=>{

      // item 元素  index 索引

      return item.age>18;  

    })

    console.log(as)  // 他的返回結果就只有一個,(對數組中逐個查找,當返回值為 true,說明找到,直接將結果返回,不在繼續查找)

  6. every:看數組中的每個是元素是否都滿足條件  參數:回調函數  返回值:布爾

    var arr=[

      {name:"zhang",age:20},

      {name:"lisi",age:10}

    ]

    var as=arr.every((item,index)=>{

      // item 元素  index 索引

      return item.age>5;

    })

    console.log(as)  // true   這種結果返回的 true,因為它的所有元素都滿足這個條件,但是只要有一個不滿足,返回值為 false 

  7. some: 看數組中的元素是否都滿足條件,只要有一個滿足,返回值是 true ,全部都不滿足這個條件,返回值為false   參數:回調函數

    var arr=[

      {name:"zhang",age:20},

      {name:"lisi",age:10}

    ]

    var as=arr.some((item,index)=>{

      // item 元素  index 索引

      return item.age>30;

    })

    console.log(as)  // false   所有的元素都不滿足他的條件,返回 false,但只要有一個滿足,返回 true

  8. reduce:迭代,在原有的基礎上繼續 

    var arr=[1,2,3,4,5,6,7,8,9,10];

    var as=arr.requce((prev,item,index)=>{

      //  prev  代表上一個的返回值(return 的返回值,就好比 item = 3 的時候,prev 代表上次返回的結果,return 1+2) 

        //  item 數組的元素,如果遍歷的話,默認從第二個元素開始, index 數組的索引 

      return prev+item  // return 的結果

    },0)  // 這個0 代表第一個返回的結果,最終目的是讓 item 從第一個元素開始

    上面的代碼翻譯為 var as=1+2+3+4+5+6+7+8+9+10

    console.log(as)  // 55   

   注意:

    1. 默認從第二個元素開始執行,第一個元素沒有上一個

    2. 第一次執行返回的是第一個元素,reduce 的參數 是一個回調函數,回調函數中有三個參數,第一個叫 prev 代表上一次 reduce 執行的返回值就,第二個叫 item 代表返回的元素

     第三個叫 index 返回的是當前的索引

    3. 如果想讓 reduce 從第一個元素開始執行,(默認從第二個),回調函數后面的參數,就是第一次執行的 prev

  1. 面試題

    將一個數組轉換成對象,屬性是數組的元素,屬性值是元素的個數

    解答;

      var arr=["item","tom",,"jack","item","jack"];
      var as=arr.reduce((prev,item)=>{
        if(item in prev){
          prev[item]++
        }
        else{
          prev[item]=1;
        }
        return prev
      },{})
      console.log(as);  // {tom:2,item:1,jack:2}


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM