目錄

1. 陣列方法

1.1 forEach

1.2 some遍歷 every遍歷比較

1.3 filter遍歷

1.4 map遍歷陣列

2.總結

1. 陣列方法

1.1 forEach

• 作用：讀取遍歷陣列

• 三個引數：

  value：每個陣列元素

  index：每個陣列元素的索引號

  array: 陣列本身

• 可以進行求和

        var array = [1, 2, 3, 4, 5];
         var Sum = 0;
         array.forEach(function (value, index, array) {
             console.log('每個陣列元素' + value);
             console.log('每個陣列元素的索引號' + index);
             console.log('陣列本身' + array);
             Sum += value;
         })
         console.log(Sum);

• 和for 遍歷的執行效率的比較

如下，可以復制下面的代碼去試試，發現for遍歷的時間，比forEach短，所以for 比 forEach遍歷的速度會更快

注意 console.time("test")和 console.timeEnd("test"),這是一個測驗程式執行時間的一個方法，配套使用，里面的引數可以任意，但是time和timeEnd的必須對應一致，

    // 測驗運行時間
         var array = [1, 2, 3, 4];
         var array2 = [1, 2, 3, 4];
         console.time('test');
         for (let i = 0; i < array.length; i++) {
             // some code
         }
         console.timeEnd('test');
 ?
         console.time('test');
         var sum = 0;
         array2.forEach(function (value) {
             sum += value;
         })
         console.timeEnd('test');
    // for 會比for each 更好

forEach 能否進行創建新陣列？

        var arr2 = arr.forEach(function (value, index, array) {
            return value > 2;
        })
        console.log(arr2); // undefined

列印出來是undefined，所以forEach不能夠直接創建陣列，當然里面可以用if進行值判斷，值再push進新陣列里面，但是這樣是間接啦，

1.2 some遍歷 every遍歷比較

every遍歷

回傳布林值

作用：

1. every用于測驗一個陣列內的資料 是否 都 滿足指定函式的條件

1. 如下面的代碼寫法1，先定義一個函式，array1.every(Test1)括號里面直接寫函式名，記得不加括號；只要有一個數沒有滿足條件，都是false

2. 注意寫法3，每一個元素都會進行遍歷，這個和some方法的寫法3不同，見下面some的解釋，

         // 1. 寫法1
         var array1 = [1, 30, 39, 29, 10, 13];
         function Test1(value) {
             return value >= 30;
         }
         console.log(array1.every(Test1)); // false
 ?
        // 寫法2：
         var arr2 = array1.every(function (value, index) {
             if (value >= 5) {
                 console.log('有資料大于5'); 
                 return;
             }
             console.log(index); 
         })
        // 寫法3：
         var arr3 = ['李', '李', '沈以誠'];
         var flag2 = arr3.every(function (e, f) {
             console.log(f); // 列印了一個索引就停止了
             return e === '李';
         })
         console.log(flag2);

some遍歷

回傳布林值

作用：

1.寫法1里面，只要array2有一個元素能被4整除，就是true，

2.寫法2里面，因為用了if陳述句，這里就是普通的遍歷，每一個元素都會進行判斷，列印如下

列印如下：

0 1 "有資料大于5" 3 4

3.寫法3，列印第一個索引就會停止，注意這個寫法下some的特性，找到一個數，就會停止遍歷后面的

列印0和true

        // 寫法1：
         var array4 = [2, 4, 5, 8, 10];
         function Test3(value) {
             return value % 4 === 0;
         }
         console.log(array4.some(Test3)); // true
       // 寫法2：
       var arr3 = array4.some(function (value, index) {
             if (value >= 5) {
                 console.log('有資料大于5'); 
                 return;
             }
             console.log(index); 
         })
       // 寫法3：
         var arr4 = ['李', '焦邁奇', '沈以誠'];
         var flag2 = arr4.some(function (e, f) {
             console.log(f); // 列印了一個索引就停止了
             return e === '李';
         })
         console.log(flag2);

1.3 filter遍歷

直接回傳新陣列

作用：進行資料的篩選，每一個值都會篩選一次，

如下面的代碼，滿足條件的值都會回傳到新的陣列里面去

         var arr = [1, 2, 3, 4];
         var newArr2 = newArr.filter(function (value) {
             return value >= 4;
         })
         console.log(newArr2); // [4,6,8]

1.4 map遍歷陣列

回傳一個新陣列

如下代碼，arr里面的每一個值都會執行里面回呼函式的執行體

同時map還能和filter結合玩出新花樣

         // // 1. map也能進行陣列的篩選 
         var arr = [1, 2, 3, 4];
         var newArr = arr.map(function (value) {
             return value * 2;
         })
         console.log(newArr); // [2,4,6,8]
 ?
 ?
         // 2. map和filter的結合
         var newArr2 = arr.map(function (value) {
             return value * 2;
         }).filter(function (value) {
             return value % 2 === 0;
         })
         console.log(newArr2);

2.總結

結尾：

學習id： 201903090124-39

現在是大三學生，學習到了vue階段，如有不對的地方，歡迎指正，一起努力呀，如有轉載請注明出處