建立陣列

JS 中建立陣列有兩種方式：

• 利用 new 建立陣列

  var 陣列名 = new Array() ；
  var arr = new Array();   // 建立一個新的空陣列

  注意 Array () ，A 要大寫

• 利用陣列字面量建立陣列

  //1. 使用陣列字面量方式建立空的陣列
  var  陣列名 = []；
  //2. 使用陣列字面量方式建立帶初始值的陣列
  var  陣列名 = ['小白','小黑','大黃','瑞奇'];

  • 陣列的字面量是方括號 [ ]

  • 宣告陣列並賦值稱為陣列的初始化

  • 這種字面量方式也是我們以後最多使用的方式

• 陣列元素的型別

  陣列中可以存放任意型別的資料，例如字串，數字，布林值等。

  var arrStus = ['小白',12,true,28.9];

獲取陣列中的元素

索引 (下標) ：用來訪問陣列元素的序號（陣列下標從 0 開始）。

陣列可以通過索引來訪問、設定、修改對應的陣列元素，可以通過“陣列名[索引]”的形式來獲取陣列中的元素。

// 定義陣列
var arrStus = [1,2,3];
// 獲取陣列中的第2個元素
alert(arrStus[1]);  

注意：如果訪問時陣列沒有和索引值對應的元素，則得到的值是undefined

1.4 遍歷陣列**

• 把陣列中的每個元素從頭到尾都訪問一次（類似學生的點名），可以通過 for 迴圈索引遍歷陣列中的每一項

var arr = ['red','green', 'blue'];
for(var i = 0; i < arr.length; i++){
    console.log(arrStus[i]);
}

• 陣列的長度

  陣列的長度：預設情況下表示陣列中元素的個數

  使用“陣列名.length”可以訪問陣列元素的數量（陣列長度）。

  var arrStus = [1,2,3];
  alert(arrStus.length);  // 3

  注意：

  • 此處陣列的長度是陣列元素的個數 ，不要和陣列的索引號混淆。

• 當我們數組裡面的元素個數發生了變化，這個 length 屬性跟著一起變化

  • 陣列的length屬性可以被修改：

• 如果設定的length屬性值大於陣列的元素個數，則會在陣列末尾出現空白元素；

  • 如果設定的length屬性值小於陣列的元素個數，則會把超過該值的陣列元素刪除

1.5 陣列中新增元素*

陣列中可以通過以下方式在陣列的末尾插入新元素：

 陣列[ 陣列.length ] = 新資料;

2 - 函式

2.1 函式的概念

在 JS 裡面，可能會定義非常多的相同程式碼或者功能相似的程式碼，這些程式碼可能需要大量重複使用。雖然 for迴圈語句也能實現一些簡單的重複操作，但是比較具有侷限性，此時我們就可以使用 JS 中的函式。

函式：就是封裝了一段可被重複呼叫執行的程式碼塊。通過此程式碼塊可以實現大量程式碼的重複使用。

2.2 函式的使用

宣告函式

// 宣告函式
function 函式名() {
    //函式體程式碼
}

• function 是宣告函式的關鍵字,必須小寫

• 由於函式一般是為了實現某個功能才定義的， 所以通常我們將函式名命名為動詞，比如 getSum

呼叫函式

// 呼叫函式
函式名(); // 通過呼叫函式名來執行函式體程式碼

• 呼叫的時候千萬不要忘記新增小括號

• 口訣：函式不呼叫，自己不執行

  注意：宣告函式本身並不會執行程式碼，只有呼叫函式時才會執行函式體程式碼。

函式的封裝

• 函式的封裝是把一個或者多個功能通過函式的方式封裝起來，對外只提供一個簡單的函式介面

• 簡單理解：封裝類似於將電腦配件整合組裝到機箱中 ( 類似快遞打包）

  例子：封裝計算1-100累加和

  ​
  /* 
     計算1-100之間值的函式
  */
  // 宣告函式
  function getSum(){
    var sumNum = 0;// 準備一個變數，儲存數字和
    for (var i = 1; i <= 100; i++) {
      sumNum += i;// 把每個數值 都累加 到變數中
    }
    alert(sumNum);
  }
  // 呼叫函式
  getSum();

2.3 函式的引數

函式引數語法

• 形參：函式定義時設定接收呼叫時傳入

• 實參：函式呼叫時傳入小括號內的真實資料

  引數的作用 : 在函式內部某些值不能固定，我們可以通過引數在呼叫函式時傳遞不同的值進去。

  函式引數的運用：

  // 帶引數的函式宣告
  function 函式名(形參1, 形參2 , 形參3...) { // 可以定義任意多的引數，用逗號分隔
    // 函式體
  }
  // 帶引數的函式呼叫
  函式名(實參1, 實參2, 實參3...); 

  1. 呼叫的時候實參值是傳遞給形參的

  2. 形參簡單理解為：不用宣告的變數

  3. 實參和形參的多個引數之間用逗號（,）分隔

函式形參和實引數量不匹配時

注意：在JavaScript中，形參的預設值是undefined。

小結***：

• 函式可以帶引數也可以不帶引數

• 宣告函式的時候，函式名括號裡面的是形參，形參的預設值為 undefined

• 呼叫函式的時候，函式名括號裡面的是實參

• 多個引數中間用逗號分隔

• 形參的個數可以和實參個數不匹配，但是結果不可預計，我們儘量要匹配

2.4 函式的返回值

return 語句

返回值：函式呼叫整體代表的資料；函式執行完成後可以通過return語句將指定資料返回 。

// 宣告函式
function 函式名（）{
    ...
    return  需要返回的值；
}
// 呼叫函式
函式名();    // 此時呼叫函式就可以得到函式體內return 後面的值

• 在使用 return 語句時，函式會停止執行，並返回指定的值

• 如果函式沒有 return ，返回的值是 undefined

break ,continue ,return 的區別***

• break ：結束當前的迴圈體（如 for、while）

• continue ：跳出本次迴圈，繼續執行下次迴圈（如 for、while）

• return ：不僅可以退出迴圈，還能夠返回 return 語句中的值，同時還可以結束當前的函式體內的程式碼

2.5 arguments的使用

當不確定有多少個引數傳遞的時候，可以用 arguments 來獲取。JavaScript 中，arguments實際上它是當前函式的一個內建物件。所有函式都內建了一個 arguments 物件，arguments 物件中儲存了傳遞的所有實參。arguments展示形式是一個偽陣列，因此可以進行遍歷。偽陣列具有以下特點：

• 具有 length 屬性

• 按索引方式儲存資料

• 不具有陣列的 push , pop 等方法

  注意：在函式內部使用該物件，用此物件獲取函式呼叫時傳的實參。

2.6 函式案例

    函式內部可以呼叫另一個函式，在同一作用域程式碼中，函式名即代表封裝的操作，使用函式名加括號即可以將封裝的操作執行。

2.7 函式的兩種宣告方式

• 自定義函式方式(命名函式)

  利用函式關鍵字 function 自定義函式方式

  // 宣告定義方式
  function fn() {...}
  // 呼叫  
  fn();  

  • 因為有名字，所以也被稱為命名函式

  • 呼叫函式的程式碼既可以放到宣告函式的前面，也可以放在宣告函式的後面

• 函式表示式方式(匿名函式）

  利用函式表示式方式的寫法如下：

  // 這是函式表示式寫法，匿名函式後面跟分號結束
  var fn = function(){...}；
  // 呼叫的方式，函式呼叫必須寫到函式體下面
  fn();

  • 因為函式沒有名字，所以也被稱為匿名函式

  • 這個fn 裡面儲存的是一個函式

  • 函式表示式方式原理跟宣告變數方式是一致的

  • 函式呼叫的程式碼必須寫到函式體後面