javascript 基礎（作用域和閉包）

貓董發表於2018-11-08
JavaScript

JavaScript簡介

  1. 弱型別，大小寫敏感的指令碼語言
  2. 作用：
    • 網頁行為操作；
    • 驗證表單；
    • 瀏覽器資訊；
    • 建立cookies；
  3. 組成：
    • 邏輯處理的ECMAscirpt
    • DOM 操作
    • BOM 操作

需要注意的語法：

  1. 變數和資料型別：
    • 儲存直接量，直接存值；（直接量或者叫基本資料型別包括數字number，字串string，布林值Boolean）。
    • 儲存物件，存地址或者叫引用；（物件包括陣列Array，函式function，自定義物件）
  2. 資料型別轉換：
    • 檢視typeof()
    • 變成number：Number(a)
    • 變成string：String(a)和a.toString()
    • 強制資料型別轉換
  3. 流程控制語句if/switch/for/while
    • 需要注意break和continue的區別：
      • break 跳出迴圈到繼續執行迴圈後面的語句；
      • continue 跳出迴圈到迴圈開始的地方，繼續執行迴圈；

函式和作用域，預解析

  1. 設定初始值防止報錯的常用語句：var a = a||1; //假如未傳入形參a，則a預設為1
  2. 當傳入引數個數不定時，需要使用動態引數：
    function add(){
    for (i=0; i<=arguments.length; i++){ //使用函式自帶的引數陣列：arguments
        sum+=arguments[i];
    }
    return sum;
}
複製程式碼
  3. 作用域： js沒有塊作用域，只有用函式劃分作用域：
    • 函式外面宣告的變數為全域性作用域：生命週期為頁面存在的時間；
    • 函式裡面用var宣告的變數為區域性作用域：生命週期為函式執行的過程中；
    • 函式裡面未用var宣告的變數會被提升為全域性變數： 生命週期為頁面存在的時間；
    • 作用域鏈：函式內使用的未宣告的變數，會一層一層的向上查詢直到global；
  4. 預解析：
    • 瀏覽器拿到js檔案是會先進行預處理：將變數宣告（包括函式宣告）語句（注意不包括賦值語句）提到最前面；
    • 函式內部的區域性變數宣告（使用var 宣告）會提到函式體的最前面；
    • 函式內部的全域性變數宣告（未使用var）會在函式執行的時候提到js文件的前面；

閉包

  1. 簡介及產生：
    • 目的是為了解決變數私有化的問題：全域性變數易被汙染 與 區域性變數生命週期短 的衝突；
    • 閉包可以使函式內部變數既擁有全域性變數的生命週期又不能被外部訪問。
    • 典型的閉包及解析：
    function add(){
    var counter = 0;       //var宣告註定counter是一個區域性變數
    plus = function(){    //plus未用var宣告，所以暴露給外面使用；但需要add先執行來初始化；
        counter++;         //未使用var 宣告，使counter具有了全域性變數的宣告週期
        console.log(counter);
    }
}
add(); //執行add，初始化counter 和 plus()
plus(); //1
plus(); //2
console.log(counter); //報錯，因為是區域性變數
複製程式碼
    • 用匿名函式和立即執行函式簡化之後的閉包（更常用）：
    var plus = (function(){
    var counter = 0;
    return function(){
        counter++;
        console.log(counter);
    }
})();
plus(); //1
plus(); //2
console.log(counter); //報錯
複製程式碼

相關文章