屎山代碼制造指南，收好指南，保住位子，看住票子！

準(zhǔn)則

???以一種代碼已經(jīng)被混淆的方式命名變量

如果我們鍵入的東西越少，那么就有越多的時(shí)間去思考代碼邏輯等問(wèn)題。

Good ????

let a = 42;

Bad ????

let age = 42;

???變量/函數(shù)混合命名風(fēng)格

為不同慶祝一下。

Good ????

let wWidth = 640;let w_height = 480;

Bad ????

let windowWidth = 640;let windowHeight = 480;

???不要寫(xiě)注釋

反正沒(méi)人會(huì)讀你的代碼。

Good ????

const cdr = 700;

Bad ????

更多時(shí)候，評(píng)論應(yīng)該包含一些“為什么”，而不是一些“是什么”。如果“什么”在代碼中不清楚，那么代碼可能太混亂了。

// 700ms的數(shù)量是根據(jù)UX A/B測(cè)試結(jié)果進(jìn)行經(jīng)驗(yàn)計(jì)算的。// @查看: <詳細(xì)解釋700的一個(gè)鏈接>const callbackDebounceRate = 700;

???使用母語(yǔ)寫(xiě)注釋

如果您違反了“無(wú)注釋”原則，那么至少嘗試用一種不同于您用來(lái)編寫(xiě)代碼的語(yǔ)言來(lái)編寫(xiě)注釋。如果你的母語(yǔ)是英語(yǔ)，你可能會(huì)違反這個(gè)原則。

Good ????

// Закрива?мо модальне в?конечко при виникненн? помилки.toggleModal(false);

Bad ????

// 隱藏錯(cuò)誤彈窗toggleModal(false);

???盡可能混合不同的格式

為不同慶祝一下。

Good ????

let i = ['tomato', 'onion', 'mushrooms'];let d = [ "ketchup", "mayonnaise" ];

Bad ????

let ingredients = ['tomato', 'onion', 'mushrooms'];let dressings = ['ketchup', 'mayonnaise'];

???盡可能把代碼寫(xiě)成一行

Good ????

document.location.search.replace(/(^\?)/,'').split('&').reduce(function(o,n){n=n.split('=');o[n[0]]=n[1];return o},{})

Bad ????

document.location.search ?.replace(/(^\?)/, '') ?.split('&') ?.reduce((searchParams, keyValuePair) => { ? ?keyValuePair = keyValuePair.split('='); ? ?searchParams[keyValuePair[0]] = keyValuePair[1]; ? ?return searchParams; ?}, ?{})

???不要處理錯(cuò)誤

無(wú)論何時(shí)發(fā)現(xiàn)錯(cuò)誤，都沒(méi)有必要讓任何人知道它。沒(méi)有日志，沒(méi)有錯(cuò)誤彈框。

Good ????

try { ?// 意料之外的情況。} catch (error) { ?// tss... ??}

Bad ????

try { ?// 意料之外的情況。} catch (error) { ?setErrorMessage(error.message); ?// and/or ?logError(error);}

???廣泛使用全局變量

全球化的原則。

Good ????

let x = 5;function square() { ?x = x ** 2;}square(); // 現(xiàn)在x是25

Bad ????

let x = 5;function square(num) { ?return num ** 2;}x = square(x); // 現(xiàn)在x是25

???創(chuàng)建你不會(huì)使用的變量

以防萬(wàn)一。

Good ????

function sum(a, b, c) { ?const timeout = 1300; ?const result = a + b; ?return a + b;}

Bad ????

function sum(a, b) { ?return a + b;}

???如果語(yǔ)言允許，不要指定類型和/或不執(zhí)行類型檢查。

Good ????

function sum(a, b) { ?return a + b;}// 在這里享受沒(méi)有注釋的快樂(lè)const guessWhat = sum([], {}); // -> "[object Object]"const guessWhatAgain = sum({}, []); // -> 0

Bad ????

function sum(a: number, b: number): ?number { ?// 當(dāng)我們?cè)贘S中不做置換和/或流類型檢查時(shí)，覆蓋這種情況。 ?if (typeof a !== 'number' && typeof b !== 'number') { ? ?return undefined; ?} ?return a + b;}// 這個(gè)應(yīng)該在轉(zhuǎn)換/編譯期間失敗。const guessWhat = sum([], {}); // -> undefined

???你應(yīng)該有不能到達(dá)的代碼

這是你的 "Plan B".

Good ????

function square(num) { ?if (typeof num === 'undefined') { ? ?return undefined; ?} ?else { ? ?return num ** 2; ?} ?return null; // 這就是我的"Plan B".}

Bad ????

function square(num) { ?if (typeof num === 'undefined') { ? ?return undefined; ?} ?return num ** 2;}

???三角法則

就像鳥(niǎo)巢，鳥(niǎo)巢，鳥(niǎo)巢。

Good ????

function someFunction() { ?if (condition1) { ? ?if (condition2) { ? ? ?asyncFunction(params, (result) => { ? ? ? ?if (result) { ? ? ? ? ?for (;;) { ? ? ? ? ? ?if (condition3) { ? ? ? ? ? ?} ? ? ? ? ?} ? ? ? ?} ? ? ?}) ? ?} ?}}

Bad ????

async function someFunction() { ?if (!condition1 || !condition2) { ? ?return; ?} ? ?const result = await asyncFunction(params); ?if (!result) { ? ?return; ?} ? ?for (;;) { ? ?if (condition3) { ? ?} ?}}

???混合縮進(jìn)

避免縮進(jìn)，因?yàn)樗鼈儠?huì)使復(fù)雜的代碼在編輯器中占用更多的空間。如果你不喜歡回避他們，那就和他們搗亂。

Good ????

const fruits = ['apple', ?'orange', 'grape', 'pineapple']; ?const toppings = ['syrup', 'cream', ? ? ? ? ? ? ? ? ? ?'jam', ? ? ? ? ? ? ? ? ? ?'chocolate'];const desserts = [];fruits.forEach(fruit => {toppings.forEach(topping => { ? ?desserts.push([fruit,topping]); ? ?});})

Bad ????

const fruits = ['apple', 'orange', 'grape', 'pineapple'];const toppings = ['syrup', 'cream', 'jam', 'chocolate'];const desserts = [];fruits.forEach(fruit => { ?toppings.forEach(topping => { ? ?desserts.push([fruit, topping]); ?});})

???不要鎖住你的依賴項(xiàng)

以非受控方式更新每個(gè)新安裝的依賴項(xiàng)。為什么堅(jiān)持使用過(guò)去的版本，讓我們使用最先進(jìn)的庫(kù)版本。

Good ????

$ ls -la package.json

Bad ????

$ ls -la package.json package-lock.json

???函數(shù)長(zhǎng)的比短的好

不要把程序邏輯分成可讀的部分。如果IDE的搜索停止，而您無(wú)法找到所需的文件或函數(shù)，該怎么辦?

• 一個(gè)文件中10000行代碼是OK的。

• 一個(gè)函數(shù)體有1000行代碼是OK的。

• 在一個(gè)' service.js ' 中處理許多服務(wù)(第三方庫(kù)和內(nèi)部庫(kù)、一些工具、手寫(xiě)的數(shù)據(jù)庫(kù)ORM和jQuery滑塊)? 這是OK的。

???不要測(cè)試你的代碼

這是重復(fù)且不需要的工作。

???避免代碼風(fēng)格統(tǒng)一

編寫(xiě)您想要的代碼，特別是在一個(gè)團(tuán)隊(duì)中有多個(gè)開(kāi)發(fā)人員的情況下。這是“自由”原則。

???構(gòu)建新項(xiàng)目不需要 README 文檔

一開(kāi)始我們就應(yīng)該保持。

???保存不必要的代碼

不要?jiǎng)h除不用的代碼，最多注釋掉。

?對(duì)標(biāo)《Google 開(kāi)源項(xiàng)目風(fēng)格指南》