匿名函数 定义之后立即执行的疑问

Question

var i=0;
function isfun(){
    console.log(i);
    i++;
    if(i<5){
        setTimeout("isfun()", 1000);
    }
};

isfun();  //执行正常，每秒i的值递增显示

---

var i=0;
(function isfun(){
    console.log(i);
    i++;
    if(i<5){
        setTimeout("isfun()", 1000);
    }
})(); //执行不正常，只显示i的值为0

这两段代码的效果应该是一样的，但是为什么结果不一样?

Answer 1

两个知识点

1. 函数声明和函数表达式

2. setTimeout 字符串参数

先占位

---

首先是函数声明和函数表达式的区别：简而言之，函数表达式不会对当前作用域产生影响，看下面这段代码

// 函数声明
function a () { console.log('a') }

// 函数表达式
(function b () { console.log('b') })

a() // output a
b() // Uncaught ReferenceError: b is not defined

函数声明在作用域中注册了 a，而函数表达式却没有任何效果。函数表达式定义的函数名只在函数体中使用，方便函数递归。

既然函数表达式的函数名可以在函数体内访问，那么在其中使用 setTimeout 调用自身应当是可以的，这就涉及到另外一个问题，setTimeout 中使用字符串做为参数。当传递一个字符串做为 setTimeout 的参数时，该参数会被 eval 解析执行，并且执行上下文为全局也就是说，上面的代码其实等价如下代码：

(function isFun (){
  setTimeout(tempFunc, 1000)
})()

function tempFunc () { isFun() }

根据第一段代码，tempFunc 中是无法访问到 isFun 的，因此代码无法执行。

若要修改代码可以执行，可以直接传递函数给 setTimeout：

setTimeout(isFun, 1000)

这时就可以访问到 isFun 函数了。