[译] Google JavaScript 风格指南中 13 个值得注意的细节

原文地址：13 Noteworthy Points from Google’s JavaScript Style Guide
原文做者：Daniel Simmons
译者：命名最头疼

对编码风格不熟悉的人而言，Google 推出一套用于编写 JavaScript 代码的样式指南， 并指出（谷歌认为）编写清晰易懂的代码最佳风格。

首先声明一点，如下规则并非编写 Javascript 代码的硬性要求，仅是为了维持项目代码的一致性，Javascript 是一种灵活而宽松的语言，它容许各类风格。

Google 和 Airbnb 都推出了各自的编码风格指南，且是比较受欢迎的，若是你的项目中须要编写大量的JS代码，我绝对建议你阅读。

如下列出了在 Google JS 风格指南中我认为比较有趣且实用的 13 条规则

Google对编码中的每一个细节点都进行了争议(标签, 空格,以及分号的使用)还有一些模糊的规范, 无疑, 这套风格确定会改变我写JS的方式。

对每一条规则，我都会列出规范的摘要部分，而后是样式指南中的支持引用和详细描述规则，在恰当的状况下，我将举例说明，并与之和不遵循规则的代码进行对比。

推荐使用空格, 而不是tab键

除了行终止符之外，ASCII 中的水平空格字符 (0x20) 是惟一一个表示空格的空白字符，这意味着 Tab 键并不适用于缩进。

// bad
    function foo() {
    ∙∙∙∙let name;
    }

    // bad
    function bar() {
    ∙let name;
    }

    // good
    function baz() {
    ∙∙let name;
    }
复制代码

推荐使用分号, 而不是将其省略

每条语句结束后必须带有分号，严禁依赖编译器自动插入分号。 虽然我没法想象为何有人会反对这个想法，可是 JS 中一向使用分号将成为新 "spaces versus tabs" 争论，Google 表示坚持分号的使用。

// bad
  let luke = {}
  let leia = {}
  [luke, leia].forEach(jedi => jedi.father = 'vader')
  // good
  let luke = {};
  let leia = {};
  [luke, leia].forEach((jedi) => {
    jedi.father = 'vader';
  });
复制代码

不要使用 ES6 模块

不要使用 ES6 模块（即 export 和 import 关键词），由于它们的语义还没有最终肯定，注意，一旦语义彻底标准化，将从新审视这条规则。

// 如今先不要这样用:
//------ lib.js ------
export function square(x) {
    return x * x;
}
export function diag(x, y) {
    return sqrt(square(x) + square(y));
}

//------ main.js ------
import { square, diag } from 'lib';
复制代码

不推荐水平对齐（但不由止）

首先水平对齐这种作法是容许的，可是在 Google 风格中并不推荐这种用法。甚至不须要在已使用过的地方保持水平对齐。 水平对齐即在代码中添加空格，使每一列对齐。

// bad
{
  tiny:   42,  
  longer: 435, 
};
// good
{
  tiny: 42, 
  longer: 435,
};
复制代码

不要再使用var

使用 const 或 let 声明全部局部变量，除非须要从新分配变量，不然默认使用 const，不推荐使用 var 关键词。 我仍然看见人们在 StackOverflow 和其余地方使用 var 代码示例。可能有人会为此反对，或者说这是一种旧习惯，要改变，比较困难。

// bad
var example = 42;
// good
let example = 42;
复制代码

首选箭头函数 箭头函数提供一个简洁的句法，并解决了许多困难，首选箭头函数而不是函数关键词，尤为是嵌套函数 说句真心话，我认为箭头函数很是棒，由于他们更加简洁，更好看，事实证实，他们也有很重要的做用。

// bad
[1, 2, 3].map(function (x) {
  const y = x + 1;
  return x * y;
});

// good
[1, 2, 3].map((x) => {
  const y = x + 1;
  return x * y;
});
复制代码

使用模板字符串代替链接符

在复杂字符串上使用模板字符串 （``） 而是否是链接符 （+） ，特别是涉及多个字符串文字的状况下，模板字符串能够跨行

// bad
function sayHi(name) {
  return 'How are you, ' + name + '?';
}

// bad
function sayHi(name) {
  return ['How are you, ', name, '?'].join();
}

// bad
function sayHi(name) {
  return `How are you, ${ name }?`;
}

// good
function sayHi(name) {
  return `How are you, ${name}?`;
}
复制代码

对长字符串不要使用行连续符

不要在普通字符串或模板字符串中使用行连续（即, 经过反斜杠结束字符串文字内的一行）尽管 ES5 容许这样作，若是有空格尾随在后面，它将会致使棘手的错误，而且对读者来讲不那么明显。

有趣的是，Google 和 Airbnb 都不赞同这种作法这又Airbnb规范

谷歌的建议是经过链接符来拆分长字符串（以下所示），而 Airbnb 则建议写成一行，容许出现长字符串（若是须要的话）

// bad (sorry, this doesn't show up well on mobile) const longString = 'This is a very long string that \
    far exceeds the 80 column limit. It unfortunately \
    contains long stretches of spaces due to how the \
    continued lines are indented.'; // good const longString = 'This is a very long string that ' + 'far exceeds the 80 column limit. It does not contain ' + 'long stretches of spaces since the concatenated ' + 'strings are cleaner.'; 复制代码

for...of是for循环首选

ES6 提供了三种不一样的 for 循环。三个可用状况下，若是能够， 推荐优先使用 for-of 循环

包括我在内, 也以为这条规则有点奇怪，可是谷歌认为它做为 for 循环的首选将会很是优雅

我认为，for...in 循环更适合对象，而 for...of 更适合数组

虽然 Google 的规范并不必定能和咱们想法相吻合, 可是它依旧以为这种作法至关优雅

不要使用eval()

不要使用 eval 或 Function(...String) 构造函数（代码加载器除外），这些功能具备潜在风险，而且在 CSP 环境中没法正常工做。

对于 eval() 而言，在 MDN 页面甚至专门有一页去呼吁不要使用 eval()

// bad
let obj = { a: 20, b: 30 };
let propName = getPropName();  // returns "a" or "b"
eval( 'var result = obj.' + propName );
// good
let obj = { a: 20, b: 30 };
let propName = getPropName();  // returns "a" or "b"
let result = obj[ propName ];  //  obj[ "a" ] is the same as obj.a
复制代码

常量应该用大写字母和下划线表示

常量名称使用 CONSTANT_CASE: 所有为大写字母，单词用下划线分割。

若是你能确保一个变量不会再改变，你能够经过大写常量的名称来代表这一点，这使得常量的不变性在整个代码的使用中显而易见。

这个规则有个值得注意的例外是，若是常量是属于函数范围的，在这种状况下，应该将其用驼峰命名法来表示。

// bad
const number = 5;
// good
const NUMBER = 5;
复制代码

每次只声明一个变量

每一个局部声明只声明一个变量，例如 let a = 1, b = 2 是不被容许的。

// bad
let a = 1, b = 2, c = 3;
// good
let a = 1;
let b = 2;
let c = 3;
复制代码

使用单引号而不是双引号

普通的字符文本使用单引号（'）来分割，而不是双引号（"）

Tip: 若是一个字符串文本中包含单引号字符，请考虑使用模板字符串，而避免使用转义符号。

// bad
let directive = "No identification of self or mission."
// bad
let saying = 'Say it ain\u0027t so.';
// good
let directive = 'No identification of self or mission.';
// good
let saying = `Say it ain't so`; 复制代码

最后一点 正如我一开始说的那样，以上这些规则并非强制性的，Google 只是众多科技巨头中的一员，这些只是建议。

也就是说，看看像谷歌这样的公司提出的风格建议颇有意思，它聘请了许多精彩的人，他们花了不少时间去编写优秀的代码。

若是你想遵循 “ Google 标准源码 ” 指南，你能够遵循这些规则，固然，不少人不一样意，你能够部分遵循，甚至不遵循也能够。

我我的认为，不少状况下 Airbnb 比 Google 的规范更具吸引力，不管在何种状况下，必定要牢记，整个项目的编码风格要保持统一。