JavaScript函數作用域行為

Question

我遇到了我無法解釋的JS奇怪行為，希望有人可以提供幫助。 考慮以下代碼：

'use strict';

// no error
function f1(n){
    (function a(k){
        a = 5;
        console.log(a);
        if(k<n)
            a(++k);
    })(1);
}

// error!!
function f2(n){
    function a(k){
        a = 5;
        console.log(a);
        if(k<n)
            a(++k);
    };
    a(1);
}

//no error
function f3(n){
    var a = function a(k){
        a = 5;
        console.log(a);
        if(k<n)
        a(++k);
    };
    a(1);
}

f2(3)調用在a(++k)行上產生錯誤，該錯誤表示number is not a function預期number is not a function ，因為a的值設置為number早於第一行。 但是， f1(3)和f3(3)不會顯示任何錯誤，並且會在控制台中打印函數的toString結果！ 我發現這很奇怪，因為代碼是在嚴格模式下執行的，如果未聲明變量a ，則代碼將產生錯誤，就像a is not defined一樣。 這樣就定義a ，當然它是對函數本身的引用，但是以某種方式設置其值在f1和f3代碼中無效！

我唯一的猜測是函數表達式是否以某種方式保護了對自身的引用免於重寫，但是如何實現它尚不十分清楚...

Answer 1

使用匿名函數保留全局變量的值

 function asyncFunction(callback) { setTimeout(callback,200); } var color = 'blue'; (function(color){ asyncFunction(function() { console.log(`this is color :${color}`); }) }) (color); console.log(color); color = 'green'