Hi～
你寫程式時都隨便換行、隨便空白，看心情加逗號跟分號嗎？你覺得反正程式沒有錯誤，結果有出來就好嗎？偶爾還會因為忘記分號導致出錯嗎？你覺得其實看了很不舒服，但也不知道要怎麼寫比較好嗎？誒嘿！沒關係，這邊推薦你個好東西：
ESLint airbnb 已經幫你把規則訂好囉！就算沒有想要完全照著他所有的規則走，但在基本撰寫習慣的部分，建議各位可以找個規則來遵循，除了讓程式碼看起來乾乾淨淨、心情變好之外，也可以減少錯誤的發生，更重要的是團隊一起工作時，如果大家使用同一個規範，也可以提升開發效率歐！
今天就來看看 airbnb 的基本撰寫規則有哪些ㄅ！

● 將 Tab 設定為兩個空格

這邊順便提供 vscode 設定的方法：

1. 編輯器最下方右下角有一個工具列，點選 space
2. 選擇 indent Using Spaces
3. 選擇 2

● 在大括號前加一個空格

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

const me = {
  type: 'cute',
  bad: false,
};

● 在控制流程的語句（if, while 等）的左括號前加上一個空格，宣告的函式和傳入的變數間則沒有空格。

// 括號()前要空白 - 錯誤示範
if(whiteEyes) {
  fight ();
}

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

// 函式的名稱跟括號()不用空白 - 錯誤示範
function whiteEyes () {
  console.log ('天生白目!');
}

// good
function whiteEyes() {
  console.log('天生白目!');
}

● 將運算元用空格隔開

// 錯誤示範
const x=y+5;

// good
const x = y + 5;

● 在檔案的最尾端加上一行空白行。

● 當大於兩個方法鏈結時請換行縮排，利用前面的 . 強調該行是呼叫方法，而不是一個新的宣告

// 錯誤示範
$('#items').find('.selected').highlight().end().find('.open').updateCount();

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

● 在區塊的結束及下個語法間加上空行

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

  function bar() {
  },
];

return arr;

● 別在區塊中置放空行

// 錯誤示範
function bar() {

  console.log(foo);

}

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

● 不要在括號內的兩側置放空格

// 錯誤示範
function bar( foo ) {
  return foo;
}

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

● 不要在中括號內的兩側置放空格

// 錯誤示範
const foo = [ 1, 2, 3 ];
console.log(foo[ 0 ]);

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

● 在大括號內的兩側置放空格

// 錯誤示範
const foo = {clark: 'kent'};

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

● 避免一行的程式碼超過 100 字元（包含空白）

這樣確保可讀性及維護性！如果要組很長的字串可以使用之前介紹過的模板字串符！

● 不要將逗號放在前方

// 錯誤示範
const love = [
 speel
, milkTea
, cat
];

// good
const love = [
speel,
milkTea,
cat,
];

● 增加結尾的逗號、分號

不要偷懶！

以上～希望有幫助到還沒找到撰寫真理的朋友們^___^，另外有興趣了解 ESlint 工具 or 其他規範的人可以參考這篇：ESLint 工具簡介&安裝教學-來個乾淨的程式碼，裡面也有介紹到歐！

參考資料：
airbnb 規則（19點與20點）