作用域的理解

weixin_33806914發表於2016-04-06

變數作用域

全域性變數 擁有全域性作用域,在Javascript程式碼中的任何地方都是有定義的。
然而在 函式內 宣告的變數只在函式體內有定義。它們是區域性變數,作用域是有區域性性的。函式引數也是區域性變數,它們只在函式體內有定義。

函式體內,區域性變數的優先順序高於同名的全域性變數。如果在函式內宣告的一個區域性變數或者函式引數中帶有的變數和全域性變數重名,那麼全域性變數就被區域性變數所覆蓋。

    var scope = "global";   //宣告一個全域性變數
    function fn() {
        var scope = "local";    //宣告一個同名的區域性變數
        return scope;       //返回區域性變數的值
    }
    fn();   //  "local"

Javascript裡沒有塊級作用域,但是有函式作用域
也就是:變數在宣告它們的函式體 以及 這個函式體巢狀的任意函式體內都是有定義的。

函式定義是可以巢狀的。由於每個函式都有它自己的作用域,因此會出現幾個區域性作用域巢狀的情況

    var scope = "global scope";     //全域性變數
    
    function checkscope() {
        var scope = "local scope";  //區域性變數

        function nested() {
            var scope = "nested scope";//巢狀作用域內的區域性變數
            return scope;   //返回當前作用域內的值
        }

        return nested();
    }

    checkscope();   //巢狀作用域

出現了一個坑爹的地方,我之前竟然一直存在這個誤區:就是函式以宣告的方式定義,裡面有各種程式碼,各種執行,但沒什麼鳥用!因為它只會進行:函式宣告提升!!!

真正執行函式內程式碼的時候,是在呼叫該函式的時候!!!

一個坑爹的例項

    function fn() {
        console.log(n);
    }

    /*---------------*/
    function fn2() {
        var n = 3;
        fn();
    }
    /*---------------*/

    fn2();  // undefined 

    var n = 3;
    
    解釋上面這段程式碼:
    1.fn、fn2、n 先宣告提升(籠統的說);
    2.預編譯(也就是宣告提升)後,程式碼從上到下開始執行,直到執行到 fn2()時,這時n還沒有被賦值
    3.從上到下,知道遇到fn2()-->然後進入fn2()-->遇到fn(),發現fn2作用域內沒有fn-->跳轉到 fn 裡面-->fn裡面沒有 n,所以跳到全域性環境中找n,發現 只有一個 var n;所以列印出了undefined; 
      
      

    function fn() {
        console.log(n);
    }

    var n = 1;

    /*---------------*/
    function fn2() {
        var n = 3;
        fn();
    }
    /*---------------*/

    fn2();  // 1

    這段程式碼 var n=1 是在fn2的上面,所以會被找到,可以參考上面的解釋 

還有一點,像if...for...這樣的迴圈語句 是不能構成作用域的。也就是說只要在一個函式體內,迴圈語句裡面的變數,在該函式體內都是可以訪問到的

相關文章