《编写可维护的JavaScript》笔记

基本的格式化

1. 缩进层级

使用制表符进行缩进

每一个缩进层级都用单独的制表符表示（通常一个制表符长度相当于4个字符）

使用空格符进行缩进

每个缩进层级由多个空格字符组成。

2个，4个或8个空格表示一个缩进。

2.语句结尾

JavaScript的语句要么独占一行，要么以分号结尾。

3.行的长度

可将行长度限定在80个字符。

4.换行

当一行长度达到了单行最大字符数限制时，就需要手动将一行拆成两行。通常我们会在运算符后换行，下一行会增加两个层级的缩进。

例外：当给变量赋值时，第二行的位置应当和赋值运算符保持对齐。
eg.

var result = something + anotherThing + yetAnotherThing +
             somethingElse;

5.空行

有时一段代码的语义和另一段代码不相关，这时就应该使用空行将它们分隔，确保语义有关联的代码展现在一起。

一般可在如下场景中添加空行：

• 在方法之间
• 在方法中的局部变量和第一条语句之间
• 在多行或单行注释之前
• 在方法内的逻辑片段之间插入空行，提高可读性。

6.命名

小驼峰式大小写：由小写字母开始，后续每个单词首字母都大写。
大驼峰式大小写：由大写字母开始，后续每个单词首字母都大写。
eg.（小驼峰式）

var thisIsMyname;
var anotherVariable;

变量名前缀应当是名词，函数名前缀应当是动词以名词，这样可以让变量和函数区分开来。
eg.

var count=10;
function getName(){
    return myname;
}

为了区分普通的变量和常量，可用大写字母和下划线来命名常量，下划线用以分隔单词。
eg.

var MAX_COUNT=10;

在JavaScript中，构造函数只不过是前面冠以new运算符的函数，用来创建对象。构造函数的命名遵照大驼峰命名法。
构造函数的命名也常常是名词，因为它们是用来创建某个类型的实例的。
eg.

function Person(name) {
    this.name=name;
}

Person.prototype.sayname=function() {
    alert(this.name);
};

var me=new Person("Nicholas");

在以大驼峰命名法命名的函数如果是名词的话，前面一定会有new运算符。

7.直接量

在JavaScript中，字符串可以用双引号括起来，也可以用单引号括起来。

创建多行字符串：使用字符串连接符（+）将字符串分成多份。
eg.

var longString="Here's the story,of a man "+
               "named Brady.";

在JavaScript中的数字类型只有一种。(八进制写法已被弃用)
eg.

//整数
var count=10;

//小数
var price=10.0;
var price=10.00;

//十六进制写法
var num=0xA2;

//科学计数法
var num=1e23;

使用null的情况：

• 用来初始化一个变量，这个变量可能赋值为一个对象。

var person=null;

• 用来和一个已经初始化的变量比较，这个变量可以是也可以不是一个对象。

var person=getPerson();
if(person!==null) {
    doSomething();
}

• 当函数的参数期望是对象时，用作参数传入。
• 当函数的返回值期望是对象时，用作返回值传出。

 function getPerson() {
     if(condition) {
        return new person("Nicholas");
    } else {
        return null;
    }
}

• 不要使用null来检测是否传入了某参数。

function doSomething(arg1,arg2,arg3,arg4) {
    if(arg4!=null) {
        doSomethingElse();
    }
}           //不好

• 不要用null来检测一个未初始化的变量。

var person;
if(person!=null) {
    doSomething();
}

那些没有被初始化的变量都有一个初始值，即undefined，表示这个变量等待被赋值。
尽量避免在代码中使用undefined。可以有效地确保只在一种情况下typeof才会返回“undefined”：当变量未声明时。
typeof运算符运算null的类型时返回“object”。

对象直接量

允许将所有的属性都括在一对花括号内。
eg.

var book= {
    title:"Maintainable JavaScript",
    author:"Nicholas C.Zakas"
};

数组直接量
eg.

var colors=["red","green","blue"];
var numbers=[1,2,3,4];

var numbers = new Array(1,2,3,4);
//不好

注释

1.单行注释

//这是一句单行注释

• 独占一行的注释，用来解释下一行代码。这行注释之前总是有一个空行，且缩进层级和下一行代码保持一致。
• 在代码行的尾部的注释。代码结束到注释之间至少有一个缩进。不应超过单行最大字符数限制。
• 被注释掉的大段代码。

2.多行注释

/*多行
注释*/

/*
 *另一段注释
 *这段注释包含两行文本
 */

出现在将要描述的代码前。

注释前有一个空行，缩进层级与代码一致，星号后有空格。
代码尾部注释不要用多行注释。

3.使用注释

在需要让代码变得更清晰时添加注释。

• 难于理解的代码
• 可能被误认为错误的代码
• 浏览器特性hack
• 文档注释
  多行注释以/**开始，接下来是描述信息，其中使用@符号来表示一个或多个属性。
• 所有的方法
• 所有的构造函数
• 所有包含文档化方法的对象

语句和表达式

不论块语句包含多行代码还是单行代码，都应当总是使用花括号。
所有的块语句都应使用花括号：

• if
• for
• while
• do…while
• try…catch…finally

1.花括号的对齐方式

• 将左花括号放置在块语句中第一句代码的末尾

if (condition) {
    doSomething();
} else {
    doSomethingElse();
}

• 将左花括号放置于块语句首行的下一行

if (condition)
{
    doSomething();
}
else
{
    doSomethingElse();
}

2.块语句间隔

在语句名，圆括号，左花括号之间的空格问题。if(
eg.

if(condition){
    doSomething();
}

if (condition) {
    doSomething();
}                      *

if ( condition ) {
    doSomething();
}

3.switch语句

switch语句中可以使用任意类型值，任何表达式都可合法地用于case从句。

缩进

• 每条case语句相对于switch关键字都缩进一个层级。
  从第二条case语句开始，每条case语句前后各有一个空行。
  eg.

switch (condition) {
    case 1:
        //代码
        break;

    case 1:
        //代码
        break;

    default:
        //代码
}

• case关键字保持和switch左对齐
  在语句中并没有空行的存在

default

可在没有默认行为且写了注释的情况下省略default。

4.with语句

在严格模式中，with语句是被明确禁止的。
尽量避免使用with语句。

5.for循环

传统的for循环往往用于遍历数组成员

var values=[1,2,3,4,5,6,7],
    i,len;
for(i=0,len=values.length;i<len;i++) {
    process(values[i]);
}

可用break，continue更改循环的执行过程
continue语句可用条件语句代替（尽可能避免使用continue语句）

6.for-in循环

用来遍历对象属性。它不仅遍历对象的实例属性，同样还遍历从原型继承来的属性。所以最好使用hasOwnProperty()方法来为for-in循环过滤出实例属性。

var prop;

for(prop in object) {
    if(object.hasOwnProperty(prop)) {
        console.log("Property name is "+prop);
        console.log("Property value is "+object[prop]);
    }
}

想要找原型链。而不使用hasOwnProperty时，应当补充注释。

变量、函数和运算符

1.变量声明

不论var语句是否真正会被执行，所有的var语句都提前到包含这段逻辑的函数的顶部执行。

function doSomething() {

    var result=10+value;
    var value=10;
    return result;
}

用到变量value时，它的值是一个特殊值undefined,resultde 的值就是NaN（非数字）。在那之后value才最终赋值为10。

在函数内部任意地方定义变量和在函数顶部定义变量是完全一样的。

可将所有的var语句合并为一个语句，每个变量的初始化独占一行。赋值运算符应当对齐。对于那些没有初始值的变量应放在var语句的尾部。
eg.

var value = 10,
   result = value + 10,
   i,
   len;

2.函数声明

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

推荐先声明函数然后再使用。

函数内部的局部函数应当紧接着变量声明之后声明。

函数声明不应出现在语句块之内。

3.函数调用间隔

推荐：在函数名和左括号之间没有空格。

4.立即调用的函数

JavaScript中允许声明匿名函数（本身没有命名的函数），并将匿名函数赋值给变量或者属性。
为了让立即执行的函数被一眼看出来，可以将函数用一对圆括号包裹起来。

var value=(function() {
    //函数体

    return {
        message:"Hi"
    }
}())；

5.严格模式

通过使用如下指令脚本以严格模式执行。

"use strict";

这条编译指令不仅用于全局，也适用于局部。但是最好不要在全局作用域中使用“use strict”

function doSomething() {
    "use strict";
    //代码
}

6.相等

当要比较的两个值的类型不同时，==和！=这两个运算符都会有强制类型转换。

• 将数字和字符串进行比较，字符串会首先转换为数字，然后执行比较。
• 一个布尔值和数字比较，布尔值会首先转换为数字，然后进行比较。false值变为0，true变为1.
• 如果其中一个值是对象而另一个不是，则会首先调用对象的valueOf()方法，得到原始类型值再进行比较。如果没有定义valueOf(),则调用toString()。
• null和undefined这两个特殊值被认为是相等的。

由于强制类型转换的缘故，我们应当使用===和！==。比较不会涉及强制类型转换。