在使用 JavaScript 時，我們常常要寫不少的條件語句。這里有五個小技巧，可以讓你寫出更干凈、漂亮的條件語句。

1. 使用 Array.includes 來處理多重條件

舉個栗子 ：

// 條件語句function test(fruit) { if (fruit == 'apple' || fruit == 'strawberry') {  console.log('red'); }}

乍一看，這么寫似乎沒什么大問題。然而，如果我們想要匹配更多的紅色水果呢，比方說『櫻桃』和『蔓越莓』？我們是不是得用更多的 || 來擴展這條語句？

我們可以使用 Array.includes(Array.includes) 重寫以上條件句。

function test(fruit) { // 把條件提取到數組中 const redFruits = ['apple', 'strawberry', 'cherry', 'cranberries']; if (redFruits.includes(fruit)) {  console.log('red'); }}

我們把紅色的水果（條件）都提取到一個數組中，這使得我們的代碼看起來更加整潔。

2. 少寫嵌套，盡早返回

讓我們為之前的例子添加兩個條件：

如果沒有提供水果，拋出錯誤。

如果該水果的數量大于 10，將其打印出來。

function test(fruit, quantity) { const redFruits = ['apple', 'strawberry', 'cherry', 'cranberries']; // 條件 1：fruit 必須有值 if (fruit) {  // 條件 2：必須為紅色  if (redFruits.includes(fruit)) {   console.log('red');   // 條件 3：必須是大量存在   if (quantity > 10) {    console.log('big quantity');   }  } } else {  throw new Error('No fruit!'); }}

// 測試結果
test(null); // 報錯：No fruits
test('apple'); // 打印：red
test('apple', 20); // 打印：red，big quantity

讓我們來仔細看看上面的代碼，我們有：

1 個 if/else 語句來篩選無效的條件
3 層 if 語句嵌套（條件 1，2 & 3）

就我個人而言，我遵循的一個總的規則是當發現無效條件時盡早返回。
/_ 當發現無效條件時盡早返回 _/

function test(fruit, quantity) { const redFruits = ['apple', 'strawberry', 'cherry', 'cranberries']; // 條件 1：盡早拋出錯誤 if (!fruit) throw new Error('No fruit!'); // 條件2：必須為紅色 if (redFruits.includes(fruit)) {  console.log('red');  // 條件 3：必須是大量存在  if (quantity > 10) {   console.log('big quantity');  } }}

如此一來，我們就少寫了一層嵌套。這是種很好的代碼風格，尤其是在 if 語句很長的時候（試想一下，你得滾動到底部才能知道那兒還有個 else 語句，是不是有點不爽）。

如果反轉一下條件，我們還可以進一步地減少嵌套層級。注意觀察下面的條件 2 語句，看看是如何做到這點的：
/_ 當發現無效條件時盡早返回 _/

function test(fruit, quantity) { const redFruits = ['apple', 'strawberry', 'cherry', 'cranberries']; if (!fruit) throw new Error('No fruit!'); // 條件 1：盡早拋出錯誤 if (!redFruits.includes(fruit)) return; // 條件 2：當 fruit 不是紅色的時候，直接返回 console.log('red'); // 條件 3：必須是大量存在 if (quantity > 10) {  console.log('big quantity'); }}