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，这是预期的，因为a的值设置为前一行的数字。 但是，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'