if 的演化史

從 if 到 if else 在到 else if。

成長過程

假設條件：

• age >= 65，老人
• 65 > age >= 20，年輕人
• 20 > age，小孩

最原始

var age = 70

if (age >= 65) {
  console.log('老人')
}
if (age < 65 && age >= 20) {
  console.log('年輕人')
}
if (age < 20) {
  console.log('小孩')
}

每個 if 之間沒有關聯性，所以條件就得寫的非常明確，不然執行邏輯上會出錯。

進化成 if else

// 進化成 if else 
if (age >= 65) {
  console.log('老人')
} else {
  if (age >= 20) {
    console.log('年輕人')
  } else {    
    console.log('小孩')
  }
}

if else 讓判斷流程之間具有關聯性，讓條件變得簡潔了！唯一的缺點是太過巢狀，不是很好閱讀。

進化成 else if

// 進化成 else if 
if (age >= 65) {
  console.log('老人')
} else if (age >= 20) {
  console.log('年輕人')
} else if (age < 20){
  console.log('小孩')
}

錦上還要再添花，else if 不只保留條件之間的關聯性，也讓可讀性變得更好！

同場加映（if 的小技巧）

var score = 60
var isPass = null

if (score >= 60) {
  isPass = true
} else {
  isPass = fasle
}

其實有更簡單的寫法：

var score = 60
var isPass = (score >= 60)

因為 score >= 60 的運算值正好跟 isPass 要設定的值同，所以才可以這樣寫。