來源：https://github.com/airbnb/javascript

javascript// bad
var item = new Object();

// good
var item = {};

//不要使用保留字作為對象屬性，IE8不支持。
// bad
var superman = {
  default: { clark: "kent" },
  private: true
};

// good
var superman = {
  defaults: { clark: "kent" },
  hidden: true
};

javascript// bad
var items = new Array();

// good
var items = [];

//使用push添加數(shù)組元素
var someStack = [];
// bad
someStack[someStack.length] = "abracadabra";

// good
someStack.push("abracadabra");

//復(fù)制數(shù)組的最快方法
var len = items.length;
var itemsCopy = [];
var i;
// bad
for (i = 0; i < len; i++) {
  itemsCopy[i] = items[i];
}

// good
itemsCopy = items.slice();

//轉(zhuǎn)換array-like object（如：{1:"xx",2:"yy",length:2}） 成數(shù)組
var args = Array.prototype.slice.call(arguments);

javascript//使用單引號
// bad
var name = "Bob Parr";
// good
var name = "Bob Parr";

// bad
var fullName = "Bob " + this.lastName;
// good
var fullName = "Bob " + this.lastName;

// 使用`＋`進行換行
var 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.";

//拼接帶標簽內(nèi)容時，標簽頭尾寫一起
// bad
function inbox(messages) {
  items = "

";

  for (i = 0; i < length; i++) {
    items += "
" + messages[i].message + "
";
  }

  return items + "

";
}

// good
function inbox(messages) {
  items = [];

  for (i = 0; i < length; i++) {
    items[i] = "
" + messages[i].message + "
";
  }

  return "

" + items.join("") + "

";
}

javascript// 使用自執(zhí)行函數(shù)
// immediately-invoked function expression (IIFE)
(function() {
  console.log("Welcome to the Internet. Please follow me.");
})();

//型參別用`arguments`
// bad
function nope(name, options, arguments) {
  // ...stuff...
}

// good
function yup(name, options, args) {
  // ...stuff...
}

javascript
var luke = {
  jedi: true,
  age: 28
};

// bad
var isJedi = luke["jedi"];

//一般情況使用`.`調(diào)用，
// good
var isJedi = luke.jedi;

function getProp(prop) {

  //屬性是變量，使用`[]`調(diào)用
  return luke[prop];
}

var isJedi = getProp("jedi");

javascript
//使用var聲明變量
// bad
superPower = new SuperPower();

// good
var superPower = new SuperPower();

//不用`,`分割變量
// bad
// (compare to above, and try to spot the mistake)
var items = getItems(),
    goSportsTeam = true;
    dragonball = "z";

// good
var items = getItems();
var goSportsTeam = true;
var dragonball = "z";

//聲明未賦值變量在后面
// bad
var i;
var items = getItems();
var dragonball;
var goSportsTeam = true;
var len;

// good
var items = getItems();
var goSportsTeam = true;
var dragonball;
var length;
var i;

//函數(shù)內(nèi)變量聲明定義盡量放最前面，除非有函數(shù)開始有判斷`return false`，
// bad
function() {
  test();
  console.log("doing stuff..");

  //..other stuff..

  var name = getName();

  if (name === "test") {
    return false;
  }

  return name;
}

// good
function() {
  var name = getName();

  test();
  console.log("doing stuff..");

  //..other stuff..

  if (name === "test") {
    return false;
  }

  return name;
}

// bad
function() {
  var name = getName();

  if (!arguments.length) {
    return false;
  }

  return true;
}

// good
function() {
  if (!arguments.length) {
    return false;
  }

  var name = getName();

  return true;
}

javascript// bad
if (name !== "") {
  // ...stuff...
}

// good
if (name) {
  // ...stuff...
}

// bad
if (collection.length > 0) {
  // ...stuff...
}

// good
if (collection.length) {
  // ...stuff...
}

javascript// bad
if (test)
  return false;

// good
if (test) return false;

// good
if (test) {
  return false;
}

// bad
function() { return false; }

// good
function() {
  return false;
}

javascript// bad
// make() returns a new element
// based on the passed in tag name
//
// @param {String} tag
// @return {Element} element
function make(tag) {

  // ...stuff...

  return element;
}

// good
/**
 * make() returns a new element
 * based on the passed in tag name
 *
 * @param {String} tag
 * @return {Element} element
 */
function make(tag) {

  // ...stuff...

  return element;
}


// bad
var active = true;  // is current tab

//注釋在在代碼上方好
// good
// is current tab
var active = true;

// bad
function getType() {
  console.log("fetching type...");
  // set the default type to "no type"
  var type = this._type || "no type";

  return type;
}

// good
function getType() {
  console.log("fetching type...");

  //注釋上方要留一行空行
  // set the default type to "no type"
  var type = this._type || "no type";

  return type;
}

javascript//  => this.reviewScore = 9;

// bad
var totalScore = this.reviewScore + "";

// good
var totalScore = "" + this.reviewScore;

// bad
var totalScore = "" + this.reviewScore + " total score";

// good
var totalScore = this.reviewScore + " total score";

var inputValue = "4";

// bad
var val = new Number(inputValue);

// bad
var val = +inputValue;

// bad
var val = inputValue >> 0;

// bad
var val = parseInt(inputValue);

// good
var val = Number(inputValue);

// good
var val = parseInt(inputValue, 10);

// good
/**
 * parseInt was the reason my code was slow.
 * Bitshifting the String to coerce it to a
 * Number made it a lot faster.
 * 通過位移的方式轉(zhuǎn)換成數(shù)字，速度會快些
 */
var val = inputValue >> 0;

var age = 0;

// bad
var hasAge = new Boolean(age);

// good
var hasAge = Boolean(age);

// good
var hasAge = !!age;

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

//名字要有語意
// good
function query() {
  // ..stuff..
}

// bad
var OBJEcttsssss = {};
var this_is_my_object = {};

//駝峰命名
// good
var thisIsMyObject = {};
function thisIsMyFunction() {}

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

//構(gòu)造函數(shù)大寫
// good
function User(options) {
  this.name = options.name;
}

// bad
this.__firstName__ = "Panda";
this.firstName_ = "Panda";

//私有屬性用`_`開頭
// good
this._firstName = "Panda";

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

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

//保存調(diào)用者`this`為`_this`
// good
function() {
  var _this = this;
  return function() {
    console.log(_this);
  };
}

javascriptfunction Jedi() {
  console.log("new jedi");
}

// bad
Jedi.prototype = {
  fight: function fight() {
    console.log("fighting");
  }
};

// good
Jedi.prototype.fight = function fight() {
  console.log("fighting");
};

javascript// bad
$(this).trigger("listingUpdated", listing.id);

...

$(this).on("listingUpdated", function(e, listingId) {
  // do something with listingId
});

//傳遞id時用對象包裹后再傳
// good
$(this).trigger("listingUpdated", { listingId : listing.id });

...

$(this).on("listingUpdated", function(e, data) {
  // do something with data.listingId
});

javascript// fancyInput/fancyInput.js

!function(global) {
  "use strict";

  var previousFancyInput = global.FancyInput;

  function FancyInput(options) {
    this.options = options || {};
  }

  FancyInput.noConflict = function noConflict() {
    global.FancyInput = previousFancyInput;
    return FancyInput;
  };

  global.FancyInput = FancyInput;
}(this);