[譯] 不用祖傳祕方 - 寫好程式碼的幾個小技巧

原文：【The Non-Secret Formula for Writing Better Code】 https://hackernoon.com/the-non-secret-formula-for-writing-better-code-e41d1ff38682

免責宣告： 儘管文中的觀點應該是沒什麼疑問的正確選擇，但都是個人觀點。

我喜歡寫乾淨的程式碼，也希望我的團隊寫出優良而乾淨的程式碼。問題在於，每個人對於 “乾淨的程式碼” 有不同的定義。

並不用什麼神祕的祖傳祕方，這裡列出了一些簡單易行的小技巧，就可以讓我更少的寫出 bug，也讓我更 happy。

“更好的程式碼” 指的是什麼？

我樂於處理注重以下目標的程式碼：

• 可讀性 ：程式碼應該易讀易理解。why 和 how 都應該清楚的反映在程式碼中。
• 簡單的 ：當不存在無法讀懂的情況，且難以被誤用，以及即便增添功能也難以破壞它的時候，程式碼就是簡單的。
• 一致的 ：一致的縮排、一致的命名、一致的檔案結構。不管採取什麼樣的風格、正規化和決策，都要始終如一。

此外還有一些我較少關心的事情：使程式碼通用、強制使用設計模式、遵循已知的“正確方式”，以及不必要的效能優化

如何寫出更好的程式碼？

以下是我現在如何寫程式碼的方式，以及為何要這樣寫的理由：

零註釋策略

註釋會變得陳舊並由此增加干擾你理解程式碼的風險。並且，註釋會讓你覺得可以對一些本不應該存在的含糊程式碼做一些補償。

所以說與其寫註釋，不如關注於程式碼的可讀性。

// ?
if (x > 5) { /* 5 是一個需要 run away 的特殊臨界點 */
   runAway()
}

// ?
const runAwayThreshold = 5
const shouldRunAway = (x > runAwayThreshold)
if (shouldRunAway) {
   runAway()
}
複製程式碼

零 TODO 策略

不要把程式碼本身當成專案管理系統來用。JIRA、Trello、Asana 等更適合於將計劃中的工作文件化。如果諸如 “有時間的時候務必要將這裡變得更快” 的註釋是必要的，那麼就應該把它放在每個人都能看到的地方。

// ?
while (true) {} // TODO: 有時間的時候務必要將這裡變得更快

// ?
while (true) {}
複製程式碼

自文件化的程式碼

使用變數可以幫助程式碼變得自文件化（self-documenting）。可以用這些變數更好的解釋我們的意圖：變數名錶明瞭 why，而對其賦的值則是 how。

// ?
if (x > 2 && x < 5) {
   fireMissiles()
}

// ?
const enemyInRange = (x > 2 && x < 5)
if (enemyInRange) {
   fireMissiles()
}
複製程式碼

儘早的退出

函式縮排的第一列是個“好位置”。所以我總是儘早退出（return 或 break），從而將更重要的程式碼片段儘可能的放在函式的“根層次”上。

作為通用的規則： 更少的縮排 → 更易讀的程式碼。

// ?
const fetchData = (id) => {
  if (id) {
    fetch('/data/' + id)
  }
}

// ?
const fetchData = (id) => {
  if (!id) {
    return
  }
  fetch('/data/' + id)
}
複製程式碼

不可變的

相比於可變的引用（JS 中的 var 或 let），我更喜歡 const 引用；因為定義了一個常量之後，就不需要再關注其（如何或什麼時候被改變）了。不管是什麼語言，基本都有類似的特性支援常量。

// ?
let mul = x * y
if (mul > 70) {
  mul = 70
}

// ?
const mul = Math.min(x * y, 70)
複製程式碼

另一個例子：

// ?
let x
if (str === 'one') {
  x = 1
} else if (str === 'two') {
  x = 2
} else if (str === 'three') {
  x = 3
}

// ?
const x = {
  one: 1,
  two: 2,
  three: 3
}[str]
複製程式碼

為每個想法單起一行

我們都需要專注，來面對複雜的程式碼。可以通過保持“程式碼句子”的簡短，來將複雜的程式碼變得簡單。

// ?
people
  .filter(person => person.age > 10 && person.firstName.length > 2 && person.lastName.length > 4)
  
// ? 邏輯更清晰
people
  .filter(person => person.age > 10)
  .filter(person => person.firstName.length > 2)
  .filter(person => person.lastName.length > 4)
  
// ? ? 邏輯清晰且效能更好
people.filter(
    person => person.age > 10 
    && person.firstName.length > 2 
    && person.lastName.length > 4
)
複製程式碼

(end)

----------------------------------------

長按二維碼或搜尋 fewelife 關注我們哦