首页 > 代码库 > CoffeeScript中的外部变量与局部变量的屏蔽
CoffeeScript中的外部变量与局部变量的屏蔽
刚接触CoffeeScript时,一直不清楚它存在的意义,搜索过部分资料,可以总结为两点:①语法糖,减少代码量增加可读性②增强js代码的合法性,编译之后的js代码跟手动写的相比基本没语法错误。
其实自我感觉代码量确实减少了,但是也并不是很可观,语法糖确实使用起来很方便,而语法错误这一点,个人感觉只要是对js有一定了解的人不一定会比他差,差也差不太多,个人感觉。
说一下在使用过程中遇到的比较头疼的一点,就是外部变量与局部变量的屏蔽机制。
如下代码:
a = (callback) -> setTimeout callback, 0
a ()-> console.log "#{temp} in the callback" temp = 3temp = 1;console.log "#{temp} out the callback"
在这句输出语句中 console.log "#{temp} in the callback",temp一直是undefined,众所周知在coffee的编译中会自动将代码中出现的变量放在函数开头进行声明,而在js中如下代码:
var a, temp;a = function(callback) { return setTimeout(callback, 0);};a(function() { console.log("" + temp + " in the callback"); return temp = 3;});temp = 1;console.log("" + temp + " out the callback");
上述代码中的输出应该是 “1 out the callback", "1 in the callback"
在callback中是能读取到外部的temp变量的,而在coffee中却读取不到,什么情况呢,于是将编译后的代码仔细阅读一遍发现(看过好几次,奈何项目中该函数内变量太多一直没看到,囧),编译后的代码是
var a, temp;a = function(callback) { return setTimeout(callback, 0);};a(function() { var temp;//注意此处,重新声明了temp变量 console.log("" + temp + " in the callback"); return temp = 3;});temp = 1;console.log("" + temp + " out the callback");
发现在callback中又重新声明了temp变量将外部变量给屏蔽掉了,如何解决这个问题呢,我们只需将temp = 1的赋值提到callback的定义之前即可。
还记得在一开始接触coffee时,网上有同学问过coffee中如何写出下面的语句:
var a = 1;function b () { var a = 2;}
现在有解决方案了,我们只需要将a=1的赋值放在函数b下面即可:
b = ()-> a = 2a = 1
还有一点需要注意的是,coffee中‘’与”“的编译结果也会不一样的,如:
a = 1‘a is #{a}‘ //输出 a is #{a}"a is #{a}" //输出 a is 1
事后仔细想了想,或许可能一开始就对coffee带有一种排斥心理,因此也没好好看过官方文档,带来各种”莫名其妙“的错误
俗话说的好,存在即合理,任何语言都有自己存在的意义,自己去思考吧,不过我一直觉得它的可读性也没有js强啊...╯□╰
CoffeeScript中的外部变量与局部变量的屏蔽