★文章內容學習來源：拉勾教育大前端就業集訓營

本篇學習目標：
1.掌握陣列的基本語法，
2.掌握陣列相關操作：獲取/遍歷等，

一、概念

1.為什么學習陣列？

• 之前學習的資料型別，只能存盤一個值（比如：Number/String），
• 那如果我們想存盤班級中所有學生的成績，此時該如何存盤？

2.陣列概念

(1) 概念

• 所謂陣列（Array），就是將多個元素（通常是同一型別） 按一定順序排列放到一個集合中，那么這個集合我們就稱之為陣列，

(2) 注意事項

• 陣列是一組有序的資料集合；
• 陣列內部可以存放多個資料，不限制資料型別；
• 陣列的長度可以動態的調整，

(3) 定義/創建

• 創建陣列最簡單的方式就是陣列字面量方式，
• 陣列的字面量：[ ]
• 一般將陣列字面量賦值給一個變數，方便后期對陣列進行操作，
• 如果存放多個資料，每個資料之間用逗號分隔，最后一個后面不需要加逗號，

        //字面量方式創建了一個空陣列arr
        var arr = [];
        //字面量方式創建了一個陣列arr1,其中儲存著相同資料型別的一組數字
        var arr1 = [ 1, 2, 3, 4];
        //字面量方式創建了一個陣列arr2,其中儲存著不同型別的資料
        var arr2 = [1， true, 0 , undefined, null ,"haha"];
       //在控制臺輸出
        console.log(arr);
        console.log(arr1);
        console.log(arr2);

二、獲取陣列元素

1.方法：通過索引值、下標

• 陣列可以通過一個 index（索引值、下標）去獲取對應的某一項的資料，進行下一步操作，
• index：從 0 開始，按照整數排序往后順序排序，例如 0,1,2,3……

      // 獲取陣列arr2中下標為0的項
      console.log(arr2[0]);  //true

2.使用或者更改陣列項的值

• 可以通過index 獲取某一項值之后，使用或者更改陣列項的值，
• 呼叫資料：利用陣列變數名后面直接加 [index] 方式，

       //呼叫/使用
       var a = arr2[4];  //變數名后面直接加 [index]
       console.log(a); //null

• 更改資料：arr[index] 呼叫這一項資料，后面等號賦值更改資料，

       //更改資料
       arr2[4] = 5;
       console.log(arr2[4]);//5

3.注意

• 如果索引值超過了陣列最大項數，相當于這一項沒有賦值，內部存盤的就是undefined，

       //注意，如果索引值超過陣列最大項數
       console.log(arr2[6]); //undefined
       //最大項數是5，所以只能呼叫出來undefined

三、陣列的長度

1.獲取陣列長度方法

• 陣列有一個length 的屬性，記錄的是陣列的資料的總長度，
• 使用方法：變數名.length

       //獲取陣列長度方法
       console.log(arr.legth); //undefined
       console.log(arr1.length); //4
       console.log(arr2.length); //6

2.陣列的長度與陣列下標關系

• 陣列的長度與陣列最后一項的下標存在關系，最后一項的下標等于陣列的 length-1，
  獲取最后一項的資料時，可以這樣書寫：

       //獲取最后一項資料方法
       console.log(arr1[arr1.length-1]); //4
       console.log(arr2[arr2.length-1]); //haha

3.改變陣列長度

• 陣列的長度不是固定不變的，可以發生更改，

(1) 增加

• ①直接給陣列length 屬性賦一個大于原來長度的值，賦值方式使用等號賦值，

       //增長①給陣列length屬性等號賦值比之前大的數
       arr.length = 1;
       console.log(arr.length);
       console.log(arr);

       //增長①給陣列length屬性等號賦值比之前大的數
       arr1.length = 12;
       console.log(arr1.length);
       console.log(arr1);

• ②或者，可以給一個大于最大下標的項直接賦值，也可以強制拉長陣列，

       //增長②給大于最大下標的項直接賦值
       arr2[10] = "增加一項" ;
       console.log(arr2.length);
       console.log(arr2);

(2) 縮短

• ①強制給 length 屬性賦值，后面資料被會直接洗掉，洗掉是不可逆的，

       //縮短，強制給length屬性賦值，后面資料會被直接刪掉，不可逆
       arr2.length = 3;
       console.log(arr2.length);
       console.log(arr2);

四、陣列遍歷

1.方法

• 遍歷：遍及所有，對陣列的每一個元素都訪問一次就叫遍歷，
• 利用 for 回圈，將陣列中的每一項單獨拿出來，進行一些操作，
• 根據下標在 0 到 arr.length-1 之間，進行 for 回圈遍歷，

2.舉例

舉例1：定義一個陣列并且陣列遍歷，

       //定義一個陣列
       var arr3 = [1,2,3,4,5,6,7,8];
       //陣列遍歷，利用for回圈
       for (i = 0 ; i <= arr3.length-1 ; i++) {
           console.log(arr3[i]);
       }

舉例2：定義一個陣列，并且讓這個陣列中每項都加5，

       //定義一個陣列
       var arr3 = [1,2,3,4,5,6,7,8];
       //給陣列中的每個數加5
       //遍歷的時候限制條件可以利用<= 與 <之間的差距，直接設定 i < arr3.length 即可
       for (i = 0 ; i < arr3.length ; i++) { 
           arr3[i] += 5;
       }
       console.log(arr3);  //輸出條件注意是在for回圈外的后面的，直接輸出最終結果即可

五、案例

求一組數中的所有數的和以及平均值，

       //案例：求一組數中的所有數的和以及平均值，
       var arr4 = [2,4,6,8,12,14,47] ;
       sum = 0;
       for (i = 0; i < arr4.length; i++ ) {
           sum += arr4[i];
       }
       console.log("陣列arr4中每一項總和為" + sum);
       var s = arr4.length ;
       var a = sum / s;
       console.log("平均值為" + a);

下篇繼續：【72】JS(6)——函式①基礎