定时器setTimeout/setInterval中变量报错:not defined 的解决方法

Posted 2020-11-01 Juneling

首先声明本人资质尚浅，如有错误，欢迎指正、共同提高。

-----------------------------------------------------------------------------------

首先声明：本文不重点讨论this作用域，而是讨论普通变量在定时器中容易报错的情况；

 

setTimeout的基本用法不再重述，

详见：http://www.w3school.com.cn/htmldom/met_win_settimeout.asp

 

bug：

　　setTimeout的第一个参数有两种形式： 

　　1） 字符串code;　　

　　function test (){

　　　　var a=1;

　　　　setTimeout("a++",100);//a is not defined;

　　}

　　test();

 

　　2) 函数形式；

　　function test (){

　　　　var a=1;

　　　　setTimeout(function(){

　　　　　　a++;

　　　　　　console.log(a); //正常运行，却打印出结果2；

　　　　},100);

　　}

　　test();

 

为什么第一种情况容易出错呢？

我们知道，setTimeout方法是挂在window对象下的。《javascript高级程序设计》第二版中，写到：“超时调用的代码都是在全局作用域中执行的，因此函数中this的值在非严格模式下指向window对象，在严格模式下是undefined”。在这里，我们只讨论非严格模式。

因而对于第一种形式（string code）的情况，定时器汇总调用的是全局变量a,而上下文中定义的变量是局部变量，所以会报错；

对于第二种形式（函数形式）可以这么理解：在这里匿名函数的使用形成了一个闭包，从而能访问到外层函数的局部变量。只是这种闭包，跟常见的闭包不同，因为函数式放在setTimeout里面。

 

 

-------------------------------------------------------------------------------

如有错误，欢迎评论指正、共同提高。[握手]    

欢迎转载，转载请注明：转载自[ http://www.cnblogs.com/juneling ]