1. 程式人生 > >【JavaScript】變數提升以及var對變數提升的

【JavaScript】變數提升以及var對變數提升的

JavaScript宣告過的變數提升往往會影響到我們對變數的正常獲取,所以特寫此文,以便以後翻閱。

什麼是變數提升

//變數宣告提升
function test() {
    var a = "1";
    var f = function(){};
    var b = "2";
    var c = "3";
}

//上述程式碼等價於
function test() {
    var a,f,b,c;
    a = "1";
    f = function(){};
    b = "2";
    c = "3";
}

js中定義變數有兩種情況:(注意在方法外不加var是不能定義變數的,出現xx is not defined)

  1. 都加var,在方法內則是區域性變數,在方法外則是全域性變數。
  2. 在方法內,加var為區域性變數,不加var則是全域性變數(在執行當前方法之後)

變數提升案例

案例1

由於test1函式裡面定義了變數a,由於

var a = 'I\'m a in all'

function test1 () {
    console.log(a)
    console.log(window.a)

    var a = 'I\'m a in test1'
    console.log(a)
}
    
test1()

上述程式碼相當於

var a = 'I\'m a in all'

function
test1 () { var a console.log(a) // undefined console.log(window.a) // I'm a in all(因為window指的是全域性環境) a = 'I\'m a in test1' console.log(a) // I'm a in test1 } test1()

案例2

var a = 'I\'m a in all'

function test2 () {
    console.log(a) // I'm a in all

    a = 'I\'m a in test2' // 這裡本來就是賦值,所以上邊的a會輸出全域性變數
console.log(a) // I'm a in test2 } test2()

案例3

function test3_1 () {
    console.log(a) // 報錯(Uncaught ReferenceError: a is not defined),阻斷以下程式碼的執行

    a = 'I\'m a in test3'
    console.log(a) // 不輸出
}
console.log(a)
test3_1()

console.log(a) // 不輸出
function test3_2 () {
    a = 'I\'m a in test3' // 全域性變數(但是在方法執行後生效)
    console.log(a) // I'm a in test3
}

// console.log(a) // 如果在方法執行前列印,還是會報錯(Uncaught ReferenceError: a is not defined),阻斷以下程式碼的執行

test3_2()

console.log(a) // I'm a in test3(本來沒有全域性變數a,當test3執行時,定義了一個全域性變數a,所以這裡會輸出)

個人部落格:午後南雜