变量、函数和运算符

在讨论过基本的JavaScript书写格式化之后,接下来关注如何使用函数、变量和运算符来减少复杂度和增强可读性就显得十分重要了。

变量声明

变量声明是通过var语句来完成的。var语句几乎可以用在JavaScript脚本中的任意地方。不论var语句是否真正会被执行,所有的var语句都提前到包含这段逻辑的函数顶部执行。比如:

function doSomething() {
var result = 10 + value;
var value = 10;
return result;
}

在这段代码中,变量value在声明之前就参与了运算,这是完全合法的,尽管这会造成result的计算结果是一个特殊值NaN。这段代码被JavaScript理解成如下模样:

function doSomething() {
var result;
var value; result = 10 + value;
value = 10; return result;
}

在第六行用到变量value的时候,它的值是undefined,因此result的值是NaN(非数字)。在那之后value才最终赋值为10。

一种流行的风格是将所有变量声明放在函数顶部而不是散落在各个角落。简言之,依照这种风格写出的代码逻辑和JavaScript引擎解析这段代码的习惯是非常相似的。建议总是将局部变量的定义作为函数内第一条语句。Crockford 的编程规范、SproutCore 编程风格指南和Dojo 编程风格指南也推荐这样做。

Crockford 还进一步推荐在函数顶部使用单var语句。

Dojo 编程风格指南规定,只有当变量之间有关联时,才允许使用单var语句。

我个人倾向于将所有的var语句合并为一个语句,每个变量的初始化独占一行,赋值运算符应当对齐。对于那些没有初始值的变量来说,它们应当出现在var语句的尾部。比如:

function doSomething(items) {
var value = 10,
result = value+10,
i,
len; for(i=0, len=items.length; i<len; i++){
doSomethingElse(items[i]);
}
}

函数声明

和变量声明一样,函数声明也会被JavaScript引擎提前。因此,在代码中函数的调用可以出现在函数的声明之前。

但我们推荐总是先声明JavaScript函数然后使用函数。

此外,函数声明不应当出现在语句块之内。函数声明应当在条件语句的外部使用。

严格模式

ECMAScript5 引入了“严格模式”(strict mode),希望通过这种方式来谨慎地解析执行JavaScript,以减少错误。通过使用如下指令脚本以严格模式执行。

"use strict";

尽管这看起来像是一个没有赋值给变量的字符串,但ECMAScript5 JavaScript引擎还是会将其识别为一条指令,以严格模式来解析代码。这条编译指令不仅用于全局,也适用于局部,比如一个函数内。不推荐将"use strict"用在全局作用域中,因为当你将11个文件连接合并成一个文件时,当其中一个文件在全局作用域中启用了严格模式,则所有的代码都将以严格模式解析。因此,最好不要在全局作用域中使用"use strict"。

//好的写法
function doSomething(){
"use strict";
//代码
}

如果你希望在多个函数中应用严格模式而不必写很多行"use strict"的话,可以使用立即执行的函数。

//好的写法
(function(){
"use strict";
function doSomething(){
//代码
}
function doSomethingElse(){
//代码
}
})();

相等 

由于JavaScript具有强制类型转换机制,JavaScript中的判断相等操作是很微妙的。

发生强制类型转换最常见的场景就是,使用了判断相等运算符==和!=的时候。当要比较的两个值的类型不同时,这两个运算符都会有强制类型转换。但在很多实际情况中,代码并不按照我所期望的方式运行。

由于强制类型转换的缘故,我们推荐使用===和!==。用这些运算符作比较不会涉及强制类型转换。

<!--

作者:纤锐
出处:http://www.cnblogs.com/beginner2014
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接。谢谢合作。

-->

《编写可维护的JavaScript》——JavaScript编码规范(六)的更多相关文章

  1. 如何编写可维护的面向对象JavaScript代码

    能够写出可维护的面向对象JavaScript代 码不仅可以节约金钱,还能让你很受欢迎.不信?有可能你自己或者其他什么人有一天会回来重用你的代码.如果能尽量让这个经历不那么痛苦,就可以节省不少时 间.地 ...

  2. [转]JavaScript程序编码规范

    原文:http://javascript.crockford.com/code.html 作者:Douglas Crockford 译文:http://www.yeeyan.com/articles/ ...

  3. 转发一个javascript的编码规范

    google出品:http://chajn.org/jsguide/javascriptguide.html

  4. 浅谈 JavaScript 编程语言的编码规范

    对于熟悉 C/C++ 或 Java 语言的工程师来说,JavaScript 显得灵活,简单易懂,对代码的格式的要求也相对松散.很容易学习,并运用到自己的代码中.也正因为这样,JavaScript 的编 ...

  5. 【转发】网易邮箱前端技术分享之javascript编码规范

    网易邮箱前端技术分享之javascript编码规范 发布日期:2013-11-26 10:06 来源:网易邮箱前端技术中心 作者:网易邮箱 点击:533 网易邮箱是国内最早使用ajax技术的邮箱.早在 ...

  6. 网易前端JavaScript编码规范

    在多年开发邮箱webmail过程中,网易邮箱前端团队积累了不少心得体会,我们开发了很多基础js库,实现了大量前端效果组件,开发了成熟的opoa框架以及api组件,在此向大家做一些分享.今天想先和大家聊 ...

  7. 网易邮箱前端Javascript编码规范:基础规范

    在多年开发邮箱webmail过程中,网易邮箱前端团队积累了不少心得体会,我们开发了很多基础js库,实现了大量前端效果组件,开发了成熟的opoa框架以及api组件,在此向大家做一些分享.今天想先和大家聊 ...

  8. Java 编码规范有感

    应小组要求,开发测试都需要考阿里编码规范,因此,相当于是突击了一下关于编码规范方面的知识,目前做的项目后期需要进行项目迁移,数据迁移,功能迁移... 各种迁移... 阿里巴巴编码规范(Java)考试地 ...

  9. 《编写可维护的JavaScript》——JavaScript编码规范(一)

    缩进层级 代码如何缩进通常有两种主张: 使用制表符缩进 每一个缩进层级都用单独的制表符表示.这种方法的主要缺点是:系统对制表符的解释不一致.这些差异会导致不同的开发者对同一段代码有不同的看法的,这正是 ...

  10. 《编写可维护的 Javascript》读书笔记(附录 A 部分):Javascript 编码风格指南(1)原始值

    记录一下比较有用的编码规范(该指南是基于 Java 语言编码规范和 Javascript 编程规范,同时结合作者 Nicholos Zakas 的个人经验和喜好). 一些关于格式(包括缩进.行的长度. ...

随机推荐

  1. 总结-computer

    常见问题 1.任务栏位置:%AppData%\Microsoft\Internet Explorer\Quick Launch\User Pinned\TaskBar 2.锁定到任务栏的图标不见了: ...

  2. MYSQL 多行转多列

    mysql 行变列(多行变成一行/多行合并成一行/多行合并成多列/合并行),我觉得这都是一个意思 数据库结构如图: 而我想让同一个人的不同成绩变成此人在这一行不同列上显示出来,此时分为2中展现: 第一 ...

  3. Execel(导出新方法):

    #region 新方法 //var sbHtml = new StringBuilder(); //sbHtml.Append("<table border='1' cellspaci ...

  4. php 获取数组第一个元素 以及最后一个元素 && 最后一个元素的键名

    1. current() 函数返回数组中的当前元素的值. 每个数组中都有一个内部的指针指向它的"当前"元素,初始指向插入到数组中的第一个元素. end() - 将内部指针指向数组中 ...

  5. GridView实现方块布局

    效果如下: 先创建一个BaseViewHolder package com.example.griddemo; import android.util.SparseArray; import andr ...

  6. angularJs之内置服务

  7. Python之路-python(css、JavaScript)

    css JavaScript 一.CSS 分层: position: fixed;(固定到页面的具体位置) 例如:返回顶部 <!DOCTYPE html> <html lang=&q ...

  8. 在 Apache Ant中设置Proxy服务器

    <target name="proxy"> <property name="proxy.host" value="https://m ...

  9. 按钮点击,打开qq,用做联系客服

    给按钮做链接 <a target=blank href=tencent://message/?uin=这里写QQ号&Site=某某&Menu=yes><img bor ...

  10. Response.End抛出ThreadAbortException 异常

    最近在写程序过程中遇到了一个匪夷所思的错误:Response.End()方法抛出了ThreadAbortException异常,我的代码如下: public void doResponse(){ st ...