Airbnb JavaScript 代码规范() {

一种写JavaScript更合理的代码风格。

Note: 本指南假设你使用了 Babel, 并且要求你使用 babel-preset-airbnb 或者其他同等资源。并且假设你在你的应用中安装了 shims/polyfills ，使用airbnb-browser-shims 或者相同功能。

其他代码风格指南

ES5 (Deprecated)
React
CSS-in-JavaScript
CSS & Sass
Ruby

类型
引用
对象
数组
解构
字符
方法
箭头函数
类和构造器
模块
迭代器和发生器
属性
变量
提升
比较运算符和等号
块
控制语句
注释
空白
逗号
分号
类型转换和强制类型转换
命名规范
存取器
事件
jQuery
ECMAScript 5 兼容性
ECMAScript 6+ (ES 2015+) 风格
标准库
测试
性能
资源
JavaScript风格指南的指南
许可证
修正案

类型

1.1 原始值: 当你访问一个原始类型的时候，你可以直接使用它的值。
- string
- number
- boolean
- null
- undefined
- symbol
```
const foo = 1;
let bar = foo;

bar = 9;

console.log(foo, bar); // => 1, 9
```
- 标识符不能完全被支持，因此在针对不支持的浏览器或者环境时不应该使用它们。

1.2 复杂类型: 当你访问一个复杂类型的时候，你需要一个值得引用。
- object
- array
- function
```
const foo = [1, 2];
const bar = foo;

bar[0] = 9;

console.log(foo[0], bar[0]); // => 9, 9
```

⬆ 返回目录

字符

6.1 使用单引号 '' 定义字符串。 eslint: quotes

// bad
const name = "Capt. Janeway";

// bad - 模板文字应该包含插值或换行。
const name = `Capt. Janeway`;

// good
const name = 'Capt. Janeway';

6.2 使行超过100个字符的字符串不应使用字符串连接跨多行写入。

为什么? 断开的字符串更加难以工作，并且使代码搜索更加困难。

// bad
const errorMessage = 'This is a super long error that was thrown because \
of Batman. When you stop to think about how Batman had anything to do \
with this, you would get nowhere \
fast.';

// bad
const errorMessage = 'This is a super long error that was thrown because ' +
  'of Batman. When you stop to think about how Batman had anything to do ' +
  'with this, you would get nowhere fast.';

// good
const errorMessage = 'This is a super long error that was thrown because of Batman. When you stop to think about how Batman had anything to do with this, you would get nowhere fast.';

6.3 当以编程模式构建字符串时，使用字符串模板代替字符串拼接。 eslint: prefer-template template-curly-spacing

为什么? 字符串模板为您提供了一种可读的、简洁的语法，具有正确的换行和字符串插值特性。

// 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}?`;
}

6.4 不要在字符串上使用 eval() ，它打开了太多漏洞。 eslint: no-eval

6.5 不要转义字符串中不必要的字符。 eslint: no-useless-escape

为什么? 反斜杠损害了可读性，因此只有在必要的时候才会出现。
```
// bad
const foo = '\'this\' \i\s \"quoted\"';

// good
const foo = '\'this\' is "quoted"';
const foo = `my name is '${name}'`;
```

⬆ 返回目录

模块

10.1 你可能经常使用模块 (import/export) 在一些非标准模块的系统上。你也可以在你喜欢的模块系统上相互转换。

为什么? 模块是未来的趋势，让我们拥抱未来。

// bad
const AirbnbStyleGuide = require('./AirbnbStyleGuide');
module.exports = AirbnbStyleGuide.es6;

// ok
import AirbnbStyleGuide from './AirbnbStyleGuide';
export default AirbnbStyleGuide.es6;

// best
import { es6 } from './AirbnbStyleGuide';
export default es6;

10.2 不要使用通配符导入。

为什么? 这确定你有一个单独的默认导出。

// bad
import * as AirbnbStyleGuide from './AirbnbStyleGuide';

// good
import AirbnbStyleGuide from './AirbnbStyleGuide';

10.3 不要直接从导入导出。

为什么? 虽然写在一行很简洁，但是有一个明确的导入和一个明确的导出能够保证一致性。

// bad
// filename es6.js
export { es6 as default } from './AirbnbStyleGuide';

// good
// filename es6.js
import { es6 } from './AirbnbStyleGuide';
export default es6;

10.4 只从一个路径导入所有需要的东西。 eslint: no-duplicate-imports

为什么? 从同一个路径导入多个行，使代码更难以维护。

// bad
import foo from 'foo';
// … 其他导入 … //
import { named1, named2 } from 'foo';

// good
import foo, { named1, named2 } from 'foo';

// good
import foo, {
  named1,
  named2,
} from 'foo';

10.5 不要导出可变的引用。 eslint: import/no-mutable-exports

为什么? 在一般情况下，应该避免发生突变，但是在导出可变引用时及其容易发生突变。虽然在某些特殊情况下，可能需要这样，但是一般情况下只需要导出常量引用。
```
// bad
let foo = 3;
export { foo };

// good
const foo = 3;
export { foo };
```

10.6 在单个导出的模块中，选择默认模块而不是指定的导出。 eslint: import/prefer-default-export

为什么? 为了鼓励更多的文件只导出一件东西，这样可读性和可维护性更好。
```
// bad
export function foo() {}

// good
export default function foo() {}
```

10.7 将所有的 imports 语句放在所有非导入语句的上边。 eslint: import/first

为什么? 由于所有的 imports 都被提前，保持他们在顶部是为了防止意外发生。
```
// bad
import foo from 'foo';
foo.init();

import bar from 'bar';

// good
import foo from 'foo';
import bar from 'bar';

foo.init();
```

10.8 多行导入应该像多行数组和对象一样缩进。

为什么? 花括号和其他规范一样，遵循相同的缩进规则，后边的都好一样。

// bad
import {longNameA, longNameB, longNameC, longNameD, longNameE} from 'path';

// good
import {
  longNameA,
  longNameB,
  longNameC,
  longNameD,
  longNameE,
} from 'path';

10.9 在模块导入语句中禁止使用 Webpack 加载器语法。 eslint: import/no-webpack-loader-syntax

为什么? 因为在导入语句中使用 webpack 语法，将代码和模块绑定在一起。应该在 webpack.config.js 中使用加载器语法。
```
// bad
import fooSass from 'css!sass!foo.scss';
import barCss from 'style!css!bar.css';

// good
import fooSass from 'foo.scss';
import barCss from 'bar.css';
```

⬆ 返回目录

提升

14.1 var 定义的变量会被提升到函数范围的最顶部，但是它的赋值不会。const 和 let 声明的变量受到一个称之为 Temporal Dead Zones (TDZ) 的新概念保护。知道为什么 typeof 不再安全是很重要的。

// 我们知道这个行不通 (假设没有未定义的全局变量)
function example() {
  console.log(notDefined); // => throws a ReferenceError
}

// 在引用变量后创建变量声明将会因变量提升而起作用。
// 注意: 真正的值 `true` 不会被提升。
function example() {
  console.log(declaredButNotAssigned); // => undefined
  var declaredButNotAssigned = true;
}

// 解释器将变量提升到函数的顶部
// 这意味着我们可以将上边的例子重写为：
function example() {
  let declaredButNotAssigned;
  console.log(declaredButNotAssigned); // => undefined
  declaredButNotAssigned = true;
}

// 使用 const 和 let
function example() {
  console.log(declaredButNotAssigned); // => throws a ReferenceError
  console.log(typeof declaredButNotAssigned); // => throws a ReferenceError
  const declaredButNotAssigned = true;
}

14.2 匿名函数表达式提升变量名，而不是函数赋值。

function example() {
  console.log(anonymous); // => undefined

  anonymous(); // => TypeError anonymous is not a function

  var anonymous = function () {
    console.log('anonymous function expression');
  };
}

14.3 命名函数表达式提升的是变量名，而不是函数名或者函数体。

function example() {
  console.log(named); // => undefined

  named(); // => TypeError named is not a function

  superPower(); // => ReferenceError superPower is not defined

  var named = function superPower() {
    console.log('Flying');
  };
}

// 当函数名和变量名相同时也是如此。
function example() {
  console.log(named); // => undefined

  named(); // => TypeError named is not a function

  var named = function named() {
    console.log('named');
  };
}

14.4 函数声明提升其名称和函数体。

function example() {
  superPower(); // => Flying

  function superPower() {
    console.log('Flying');
  }
}

更多信息请参考 Ben Cherry 的 JavaScript Scoping & Hoisting。

⬆ 返回目录

空白

19.1 使用 tabs (空格字符) 设置为 2 个空格。 eslint: indent

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

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

// good
function baz() {
∙∙let name;
}

19.2 在主体前放置一个空格。 eslint: space-before-blocks

// bad
function test(){
  console.log('test');
}

// good
function test() {
  console.log('test');
}

// bad
dog.set('attr',{
  age: '1 year',
  breed: 'Bernese Mountain Dog',
});

// good
dog.set('attr', {
  age: '1 year',
  breed: 'Bernese Mountain Dog',
});

19.3 在控制语句（if, while 等）开始括号之前放置一个空格。在函数调用和是声明中，在参数列表和函数名之间没有空格。 eslint: keyword-spacing

// bad
if(isJedi) {
  fight ();
}

// good
if (isJedi) {
  fight();
}

// bad
function fight () {
  console.log ('Swooosh!');
}

// good
function fight() {
  console.log('Swooosh!');
}

19.4 用空格分离操作符。 eslint: space-infix-ops

// bad
const x=y+5;

// good
const x = y + 5;

19.5 使用单个换行符结束文件。 eslint: eol-last

// bad
import { es6 } from './AirbnbStyleGuide';
  // ...
export default es6;

// bad
import { es6 } from './AirbnbStyleGuide';
  // ...
export default es6;↵
↵

// good
import { es6 } from './AirbnbStyleGuide';
  // ...
export default es6;↵

19.6 在使用链式方法调用的时候使用缩进(超过两个方法链)。使用一个引导点，强调该行是方法调用，而不是新的语句。 eslint: newline-per-chained-call no-whitespace-before-property

// bad
$('#items').find('.selected').highlight().end().find('.open').updateCount();

// bad
$('#items').
  find('.selected').
    highlight().
    end().
  find('.open').
    updateCount();

// good
$('#items')
  .find('.selected')
    .highlight()
    .end()
  .find('.open')
    .updateCount();

// bad
const leds = stage.selectAll('.led').data(data).enter().append('svg:svg').classed('led', true)
    .attr('width', (radius + margin) * 2).append('svg:g')
    .attr('transform', `translate(${radius + margin},${radius + margin})`)
    .call(tron.led);

// good
const leds = stage.selectAll('.led')
    .data(data)
  .enter().append('svg:svg')
    .classed('led', true)
    .attr('width', (radius + margin) * 2)
  .append('svg:g')
    .attr('transform', `translate(${radius + margin},${radius + margin})`)
    .call(tron.led);

// good
const leds = stage.selectAll('.led').data(data);

19.7 在块和下一个语句之前留下一空白行。

// bad
if (foo) {
  return bar;
}
return baz;

// good
if (foo) {
  return bar;
}

return baz;

// bad
const obj = {
  foo() {
  },
  bar() {
  },
};
return obj;

// good
const obj = {
  foo() {
  },

  bar() {
  },
};

return obj;

// bad
const arr = [
  function foo() {
  },
  function bar() {
  },
];
return arr;

// good
const arr = [
  function foo() {
  },

  function bar() {
  },
];

return arr;

19.8 不要在块的开头使用空白行。 eslint: padded-blocks

// bad
function bar() {

  console.log(foo);

}

// bad
if (baz) {

  console.log(qux);
} else {
  console.log(foo);

}

// bad
class Foo {

  constructor(bar) {
    this.bar = bar;
  }
}

// good
function bar() {
  console.log(foo);
}

// good
if (baz) {
  console.log(qux);
} else {
  console.log(foo);
}

19.9 不要在括号内添加空格。 eslint: space-in-parens

// bad
function bar( foo ) {
  return foo;
}

// good
function bar(foo) {
  return foo;
}

// bad
if ( foo ) {
  console.log(foo);
}

// good
if (foo) {
  console.log(foo);
}

19.10 不要在中括号中添加空格。 eslint: array-bracket-spacing

// bad
const foo = [ 1, 2, 3 ];
console.log(foo[ 0 ]);

// good
const foo = [1, 2, 3];
console.log(foo[0]);

19.11 在花括号内添加空格。 eslint: object-curly-spacing

// bad
const foo = {clark: 'kent'};

// good
const foo = { clark: 'kent' };

19.12 避免让你的代码行超过100个字符（包括空格）。注意：根据上边的约束，长字符串可免除此规定，不应分解。 eslint: max-len

为什么? 这样能够确保可读性和可维护性。

// bad
const foo = jsonData && jsonData.foo && jsonData.foo.bar && jsonData.foo.bar.baz && jsonData.foo.bar.baz.quux && jsonData.foo.bar.baz.quux.xyzzy;

// bad
$.ajax({ method: 'POST', url: 'https://airbnb.com/', data: { name: 'John' } }).done(() => console.log('Congratulations!')).fail(() => console.log('You have failed this city.'));

// good
const foo = jsonData
  && jsonData.foo
  && jsonData.foo.bar
  && jsonData.foo.bar.baz
  && jsonData.foo.bar.baz.quux
  && jsonData.foo.bar.baz.quux.xyzzy;

// good
$.ajax({
  method: 'POST',
  url: 'https://airbnb.com/',
  data: { name: 'John' },
})
  .done(() => console.log('Congratulations!'))
  .fail(() => console.log('You have failed this city.'));

19.13 要求打开的块标志和同一行上的标志拥有一致的间距。此规则还会在同一行关闭的块标记和前边的标记强制实施一致的间距。 eslint: block-spacing
```
// bad
function foo() {return true;}
if (foo) { bar = 0;}

// good
function foo() { return true; }
if (foo) { bar = 0; }
```

19.14 逗号之前避免使用空格，逗号之后需要使用空格。eslint: comma-spacing

// bad
var foo = 1,bar = 2;
var arr = [1 , 2];

// good
var foo = 1, bar = 2;
var arr = [1, 2];

19.15 在计算属性之间强化间距。eslint: computed-property-spacing

// bad
obj[foo ]
obj[ 'foo']
var x = {[ b ]: a}
obj[foo[ bar ]]

// good
obj[foo]
obj['foo']
var x = { [b]: a }
obj[foo[bar]]

19.16 在函数和它的调用之间强化间距。 eslint: func-call-spacing
```
// bad
func ();

func
();

// good
func();
```

19.17 在对象的属性和值之间强化间距。 eslint: key-spacing

// bad
var obj = { "foo" : 42 };
var obj2 = { "foo":42 };

// good
var obj = { "foo": 42 };

19.18 在行的末尾避免使用空格。 eslint: no-trailing-spaces

19.19 避免多个空行，并且只允许在文件末尾添加一个换行符。 eslint: no-multiple-empty-lines
```
// bad
var x = 1;



var y = 2;

// good
var x = 1;

var y = 2;
```

⬆ 返回目录

命名规范

23.1 避免单字母的名字。用你的命名来描述功能。 eslint: id-length

// bad
function q() {
  // ...
}

// good
function query() {
  // ...
}

23.2 在命名对象、函数和实例时使用驼峰命名法（camelCase）。 eslint: camelcase

// bad
const OBJEcttsssss = {};
const this_is_my_object = {};
function c() {}

// good
const thisIsMyObject = {};
function thisIsMyFunction() {}

23.3 只有在命名构造器或者类的时候才用帕斯卡拼命名法（PascalCase）。 eslint: new-cap

// bad
function user(options) {
  this.name = options.name;
}

const bad = new user({
  name: 'nope',
});

// good
class User {
  constructor(options) {
    this.name = options.name;
  }
}

const good = new User({
  name: 'yup',
});

23.4 不要使用前置或者后置下划线。 eslint: no-underscore-dangle

为什么? JavaScript 在属性和方法方面没有隐私设置。虽然前置的下划线是一种常见的惯例，意思是 “private” ，事实上，这些属性是公开的，因此，它们也是你公共 API 的一部分。这种约定可能导致开发人员错误的认为更改不会被视为中断，或者不需要测试。建议：如果你想要什么东西是 “private” ，那就一定不能有明显的表现。
```
// bad
this.__firstName__ = 'Panda';
this.firstName_ = 'Panda';
this._firstName = 'Panda';

// good
this.firstName = 'Panda';

// 好，在 WeakMapx 可用的环境中
// see https://kangax.github.io/compat-table/es6/#test-WeakMap
const firstNames = new WeakMap();
firstNames.set(this, 'Panda');
```

23.5 不要保存 this 的引用。使用箭头函数或者函数#bind。

// bad
function foo() {
  const self = this;
  return function () {
    console.log(self);
  };
}

// bad
function foo() {
  const that = this;
  return function () {
    console.log(that);
  };
}

// good
function foo() {
  return () => {
    console.log(this);
  };
}

23.6 文件名应该和默认导出的名称完全匹配。

// file 1 contents
class CheckBox {
  // ...
}
export default CheckBox;

// file 2 contents
export default function fortyTwo() { return 42; }

// file 3 contents
export default function insideDirectory() {}

// in some other file
// bad
import CheckBox from './checkBox'; // PascalCase import/export, camelCase filename
import FortyTwo from './FortyTwo'; // PascalCase import/filename, camelCase export
import InsideDirectory from './InsideDirectory'; // PascalCase import/filename, camelCase export

// bad
import CheckBox from './check_box'; // PascalCase import/export, snake_case filename
import forty_two from './forty_two'; // snake_case import/filename, camelCase export
import inside_directory from './inside_directory'; // snake_case import, camelCase export
import index from './inside_directory/index'; // requiring the index file explicitly
import insideDirectory from './insideDirectory/index'; // requiring the index file explicitly

// good
import CheckBox from './CheckBox'; // PascalCase export/import/filename
import fortyTwo from './fortyTwo'; // camelCase export/import/filename
import insideDirectory from './insideDirectory'; // camelCase export/import/directory name/implicit "index"
// ^ supports both insideDirectory.js and insideDirectory/index.js

23.7 当你导出默认函数时使用驼峰命名法。你的文件名应该和方法名相同。
```
function makeStyleGuide() {
  // ...
}

export default makeStyleGuide;
```

23.8 当你导出一个构造器 / 类 / 单例 / 函数库 / 暴露的对象时应该使用帕斯卡命名法。
```
const AirbnbStyleGuide = {
  es6: {
  },
};

export default AirbnbStyleGuide;
```

23.9 缩略词和缩写都必须是全部大写或者全部小写。

为什么? 名字是为了可读性，不是为了满足计算机算法。

// bad
import SmsContainer from './containers/SmsContainer';

// bad
const HttpRequests = [
  // ...
];

// good
import SMSContainer from './containers/SMSContainer';

// good
const HTTPRequests = [
  // ...
];

// also good
const httpRequests = [
  // ...
];

// best
import TextMessageContainer from './containers/TextMessageContainer';

// best
const requests = [
  // ...
];

23.10 你可以大写一个常量，如果它：（1）被导出，（2）使用 const 定义（不能被重新赋值），（3）程序员可以信任它（以及其嵌套的属性）是不变的。

为什么? 这是一个可以帮助程序员确定变量是否会发生变化的辅助工具。UPPERCASE_VARIABLES 可以让程序员知道他们可以相信变量（及其属性）不会改变。
- 是否是对所有的 const 定义的变量？ - 这个是没有必要的，不应该在文件中使用大写。但是，它应该用于导出常量。
- 导出对象呢？ - 在顶级导出属性 (e.g. EXPORTED_OBJECT.key) 并且保持所有嵌套属性不变。
```
// bad
const PRIVATE_VARIABLE = 'should not be unnecessarily uppercased within a file';

// bad
export const THING_TO_BE_CHANGED = 'should obviously not be uppercased';

// bad
export let REASSIGNABLE_VARIABLE = 'do not use let with uppercase variables';

// ---

// 允许，但是不提供语义值
export const apiKey = 'SOMEKEY';

// 多数情况下，很好
export const API_KEY = 'SOMEKEY';

// ---

// bad - 不必要大写 key 没有增加语义值
export const MAPPING = {
  KEY: 'value'
};

// good
export const MAPPING = {
  key: 'value'
};
```

⬆ 返回目录

jQuery

26.1 对于 jQuery 对象的变量使用 $ 作为前缀。

// bad
const sidebar = $('.sidebar');

// good
const $sidebar = $('.sidebar');

// good
const $sidebarBtn = $('.sidebar-btn');

26.2 缓存 jQuery 查询。

// bad
function setSidebar() {
  $('.sidebar').hide();

  // ...

  $('.sidebar').css({
    'background-color': 'pink',
  });
}

// good
function setSidebar() {
  const $sidebar = $('.sidebar');
  $sidebar.hide();

  // ...

  $sidebar.css({
    'background-color': 'pink',
  });
}

26.3 对于 DOM 查询使用层叠 $('.sidebar ul') 或父元素 > 子元素 $('.sidebar > ul') 的格式。 jsPerf

26.4 对于有作用域的 jQuery 对象查询使用 find 。

// bad
$('ul', '.sidebar').hide();

// bad
$('.sidebar').find('ul').hide();

// good
$('.sidebar ul').hide();

// good
$('.sidebar > ul').hide();

// good
$sidebar.find('ul').hide();

⬆ 返回目录

ECMAScript 6+ (ES 2015+) Styles

28.1 这是一个链接到各种 ES6+ 特性的集合。

箭头函数
类
对象简写
对象简洁
对象计算属性
字符串模板
解构
默认参数
Rest
数组展开
Let 和 Const
求幂运算符
迭代器和发生器
模块

28.2 不要使用尚未达到第3阶段的 TC39 建议。

为什么? 它们没有最终确定，并且它们可能会被改变或完全撤回。我们希望使用JavaScript，而建议还不是JavaScript。

⬆ 返回目录

标准库

标准库包含功能已损坏的实用工具，但因为遗留原因而保留。

29.1 使用 Number.isNaN 代替全局的 isNaN. eslint: no-restricted-globals

为什么? 全局的 isNaN 强制非数字转化为数字，对任何强制转化为 NaN 的东西都返回 true。

如果需要这种行为，请明确说明。
```
// bad
isNaN('1.2'); // false
isNaN('1.2.3'); // true

// good
Number.isNaN('1.2.3'); // false
Number.isNaN(Number('1.2.3')); // true
```

29.2 使用 Number.isFinite 代替全局的 isFinite. eslint: no-restricted-globals

为什么? 全局的 isFinite 强制非数字转化为数字，对任何强制转化为有限数字的东西都返回 true。

如果需要这种行为，请明确说明。
```
// bad
isFinite('2e3'); // true

// good
Number.isFinite('2e3'); // false
Number.isFinite(parseInt('2e3', 10)); // true
```

⬆ 返回目录

Testing

30.1 是的.
```
function foo() {
  return true;
}
```

30.2 没有，但是认真:
- 无论你使用那种测试框架，都应该编写测试！
- 努力写出许多小的纯函数，并尽量减少发生错误的地方。
- 对于静态方法和 mock 要小心----它们会使你的测试更加脆弱。
- 我们主要在 Airbnb 上使用 mocha 和 jest 。 tape 也会用在一些小的独立模块上。
- 100%的测试覆盖率是一个很好的目标，即使它并不总是可行的。
- 无论何时修复bug，都要编写一个回归测试。在没有回归测试的情况下修复的bug在将来几乎肯定会再次崩溃。

⬆ 返回目录

性能

On Layout & Web Performance
String vs Array Concat
Try/Catch Cost In a Loop
Bang Function
jQuery Find vs Context, Selector
innerHTML vs textContent for script text
Long String Concatenation
Are Javascript functions like map(), reduce(), and filter() optimized for traversing arrays?
Loading...

⬆ 返回目录

资源

学习 ES6+

Latest ECMA spec
ExploringJS
ES6 Compatibility Table
Comprehensive Overview of ES6 Features

读这个

Standard ECMA-262

工具

Code Style Linters
- ESlint - Airbnb Style .eslintrc
- JSHint - Airbnb Style .jshintrc
Neutrino preset - neutrino-preset-airbnb-base

其他编码规范

Google JavaScript Style Guide
jQuery Core Style Guidelines
Principles of Writing Consistent, Idiomatic JavaScript
StandardJS

其他风格

Naming this in nested functions - Christian Johansen
Conditional Callbacks - Ross Allen
Popular JavaScript Coding Conventions on GitHub - JeongHoon Byun
Multiple var statements in JavaScript, not superfluous - Ben Alman

进一步阅读

Understanding JavaScript Closures - Angus Croll
Basic JavaScript for the impatient programmer - Dr. Axel Rauschmayer
You Might Not Need jQuery - Zack Bloom & Adam Schwartz
ES6 Features - Luke Hoban
Frontend Guidelines - Benjamin De Cock

书籍

JavaScript: The Good Parts - Douglas Crockford
JavaScript Patterns - Stoyan Stefanov
Pro JavaScript Design Patterns - Ross Harmes and Dustin Diaz
High Performance Web Sites: Essential Knowledge for Front-End Engineers - Steve Souders
Maintainable JavaScript - Nicholas C. Zakas
JavaScript Web Applications - Alex MacCaw
Pro JavaScript Techniques - John Resig
Smashing Node.js: JavaScript Everywhere - Guillermo Rauch
Secrets of the JavaScript Ninja - John Resig and Bear Bibeault
Human JavaScript - Henrik Joreteg
Superhero.js - Kim Joar Bekkelund, Mads Mobæk, & Olav Bjorkoy
JSBooks - Julien Bouquillon
Third Party JavaScript - Ben Vinegar and Anton Kovalyov
Effective JavaScript: 68 Specific Ways to Harness the Power of JavaScript - David Herman
Eloquent JavaScript - Marijn Haverbeke
You Don’t Know JS: ES6 & Beyond - Kyle Simpson

博客

JavaScript Weekly
JavaScript, JavaScript...
Bocoup Weblog
Adequately Good
NCZOnline
Perfection Kills
Ben Alman
Dmitry Baranovskiy
nettuts

播客

JavaScript Air
JavaScript Jabber

⬆ 返回目录

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the 'Software'), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

⬆ 返回目录

修正案

我们鼓励您使用此指南并更改规则以适应您的团队的风格指南。下面，你可以列出一些对风格指南的修正。这允许您定期更新您的样式指南，而不必处理合并冲突。

Files

README.md

Latest commit

History

README.md

File metadata and controls

Airbnb JavaScript 代码规范() {

jQuery

ECMAScript 6+ (ES 2015+) Styles

Testing

};