前端规范（3）——js规范

JS语言特性(这里建议使用ES6规范)
[强制] 每个 let 只能声明一个变量。一个 let 声明多个变量，容易导致较长的行长度，并且在修改时容易造成逗号和分号的混淆。

let hangModules = [];
let missModules = [];
let visited = {};

[强制] 变量必须 即用即声明，不得在函数或其它形式的代码块起始位置统一声明所有变量。变量声明与使用的距离越远，出现的跨度越大，代码的阅读与维护成本越高。
[建议] 在 判断中使用类型严格的 ===。
[建议] 按执行频率排列判断或代码分支的顺序。
[建议] 如果函数或全局中的 else 块后没有任何语句，可以删除 else。

function getName() {
    if (name) {
        return name;
    }

    return 'unnamed';
}

[建议] 不要在循环体中包含函数表达式，事先将函数提取到循环体外。因为循环体中的函数表达式，运行过程中会生成循环次数个函数对象。

function clicker() {
    // ......
}
for (let i = 0, len = elements.length; i < len; i++) {
    let element = elements[i];
    addListener(element, "click", clicker);
}

[建议] 对循环内多次使用的不变值，在循环外用变量缓存。

let width = wrap.offsetWidth + 'px';
for (let i = 0, len = elements.length; i < len; i++) {
    let element = elements[i];
    element.style.width = width;
    // ......
}

[建议] 类型检测优先使用 typeof。对象类型检测使用 instanceof。null 或 undefined 的检测使用 == null。

// string
typeof variable === 'string'

// number
typeof variable === 'number'

// boolean
typeof variable === 'boolean'

// Function
typeof variable === 'function'

// Object
typeof variable === 'object'

// RegExp
variable instanceof RegExp

// Array
variable instanceof Array

// null
variable === null

// null or undefined
variable == null

// undefined
typeof variable === 'undefined'

[强制] 字符串开头和结束使用单引号 ‘。输入单引号不需要按住 shift，方便输入。实际使用中，字符串经常用来拼接 HTML。为方便 HTML 中包含双引号而不需要转义写法。
[建议] 不允许修改和扩展任何原生对象和宿主对象的原型。
[建议] 属性访问时，尽量使用 .。
[建议] 一个函数的长度控制在 50 行以内。将过多的逻辑单元混在一个大函数中，易导致难以维护。一个清晰易懂的函数应该完成单一的逻辑单元。复杂的操作应进一步抽取，通过函数的调用来体现流程。特定算法等不可分割的逻辑允许例外。

function syncViewStateOnUserAction() {
    if (x.checked) {
        y.checked = true;
        z.value = '';
    }
    else {
        y.checked = false;
    }

    if (a.value) {
        warning.innerText = '';
        submitButton.disabled = false;
    }
    else {
        warning.innerText = 'Please enter it';
        submitButton.disabled = true;
    }
}

// 直接阅读该函数会难以明确其主线逻辑，因此下方是一种更合理的表达方式：

function syncViewStateOnUserAction() {
    syncXStateToView();
    checkAAvailability();
}

function syncXStateToView() {
    y.checked = x.checked;

    if (x.checked) {
        z.value = '';
    }
}

function checkAAvailability() {
    if (a.value) {
        clearWarnignForA();
    }
    else {
        displayWarningForAMissing();
    }
}

[建议] 一个函数的参数控制在 6 个以内。
[建议] 属性在构造函数中声明，方法在原型中声明。

function TextNode(value, engine) {
    this.value = value;
    this.engine = engine;
}

TextNode.prototype.clone = function () {
    return this;
};