这里有新鲜出炉的 Javascript 教程,程序狗速度看过来!
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
这篇文章主要介绍了四种常见的声明循环变量的书写方式, 对其进行简单的分析和比较,需要的朋友可以参考下
Javascript 中的循环变量声明,到底应该放在哪儿?
习惯 1:不声明直接使用
- function loop(arr) {
- for (i = 0; i < arr.length; i++) {
- // do something
- }
- }
非常危险的使用习惯,一般情况下循环变量将成为 window 对象上的一个属性被全局使用,极有可能影响程序的正常逻辑实现。 需要着重提一下的是,在 strict 模式下,未声明变量而直接赋值的使用方式会直接抛出异常,早就该这么做啦!引用一下 ecma-262 标准附录 C 中的一段话: "Assignment to an undeclared identifier or otherwise unresolvable reference does not create a property in the global object. When a simple assignment occurs within strict mode code, its LeftHandSide must not evaluate to an unresolvable Reference. If it does a ReferenceError exception is thrown (6.2.3.2)." 换言之,如果再使用未经声明的变量的话,ReferenceError 异常会被抛出。
习惯 2:放在 for 循环初始语句块中并反复声明
- function loop(arr) {
- for (var i = 0; i < arr.length; i++ ){
- // do someting
- }
- // console.log(i);
- for (var i = 0; i < arr.length; i++ ){
- // do something else
- }
- }
这种方式看似最安全规范,很多从 C 和 Java 转到前端开发的同学都偏爱这样的写法,事实上,这也许是由于对 Javascript 中一个重要概念有所 误解造成的——变量作用域。不同于 C 和 Java,Javascript 并不具备真正的块级作用域,也就是说,在第一个循环结束之 后,console.log(i) 并不会打印 undefined 或者抛出 ReferenceError 异常,而是会正常打印出 arr.length。 当然,这样的写法虽然除了美观以外意义不大,但是长久以来兼容性良好且没有违反任何规范——ecma 标准中并没有禁止在某一个作用域内对于同一变量的重复声明。
习惯 3:在函数顶部和其他变量一起集中定义
- function loop(arr) {
- var var1;
- var var2;
- var i;
- for (i = 0; i < arr.length; i++) {
- // do something
- }
- }
这种 c89-like 式的变量定义方式在 Javascript 中几乎无可挑剔,既不会造成 Javascript 支持块级作用域的误解,又不会污染全 局 scope,还不违反任何标准和规范,主要缺点就是循环变量的声明和循环体可能会隔开比较远。在不借助更多代码的前提下,除了等待各大主流浏览器厂商实现 ECMAScript 6 中的 let 关键字以外,这个问题似乎找不到更好的解决方案。
习惯 4:将循环代码封装到 IIFE 中
- function loop(arr) {
- (function () {
- for (var i = 0; i < arr.length; i++) {
- // do something
- }
- })();
- }
最后一种习惯是前端程序员们熟悉的 IIFE(Immediately-Invoked Function Expression),即立即执行函数。此种方法的主要缺点是书写相对麻烦,且有多余的性能损耗(很小),但在兼容性、对各标准规范的遵循上表现良好。 如果不嫌麻烦,开发者可以采取这种方式。
以上就是对 Javascript 中四种常见循环变量定义书写习惯的简单介绍和分析,各有利弊,读者可以结合自己的需求择优使用。
来源: http://www.phperz.com/article/17/0420/269142.html