怎麼使用 JavaScript 編寫更好的條件語句

在任何程式語言中，代碼需要根據不同的條件在給定的輸入中做不同的決定和執行相應的動作。
例如，在一個遊戲中，如果玩家生命點為0，遊戲結束。在天氣應用中，如果在早上被查看，顯示一個日出圖片，如果是晚上，則顯示星星和月亮。在這篇文章中，我們將探索javascript中所謂的條件語句如何工作。
如果你使用javascript工作，你將寫很多包含條件調用的代碼。條件調用可能初學很簡單，但是還有比寫一對對if/else更多的東西。這裡有些編寫更好更清晰的條件代碼的有用提示。
數組方法 array.includes提前退出 / 提前返回用對象字面量或map替代switch語句默認參數和解構用 array.every &array.some 匹配全部/部分內容使用可選鏈和空值合併1.數組方法 array.includes
使用 array.includes 進行多條件選擇。
例如：
function printanimals(animal) {
if (animal === 'dog'|| animal === 'cat') {
console.log(i have a ${animal});
}
}
console.log(printanimals('dog'));// i have a dog
上面的代碼看起來很好因為我們只檢查了兩個動物。然而，我們不確定用戶輸入。如果我們要檢查任何其他動物呢？如果我們通過添加更多「或」語句來擴展，代碼將變得難以維護和不清晰。
解決方案:
我們可以通過使用 array.includes 來重寫上面的條件。
function printanimals(animal) {
const animals = ['dog','cat','hamster','turtle'];
if (animals.includes(animal)) {
console.log(i have a ${animal});
}
}
console.log(printanimals('hamster'));// i have a hamster
這裡，我們創建來一個動物數組，所以條件語句可以和代碼的其餘部分抽象分離出來。現在，如果我們想要檢查任何其他動物，我們只需要添加一個新的數組項。
我們也能在這個函數作用域外部使用這個動物數組變量來在代碼中的其他任意地方重用它。這是一個編寫更清晰、易理解和維護的代碼的方法，不是嗎？
2.提前退出 / 提前返回。
這是一個精簡你的代碼的非常酷的技巧。我記得當我開始專業工作時，我在第一天學習使用提前退出來編寫條件。
讓我們在之前的例子上添加更多的條件。用包含確定屬性的對象替代簡單字符串的動物。
現在的需求是：
如果沒有動物，拋出一個異常列印動物類型列印動物名字列印動物性別const printanimaldetails = animal =>{
let result;// declare a variable to store the final value
// condition 1:check if animal has a value
if (animal) {
// condition 2:check if animal has a type property
if (animal.type) {
// condition 3:check if animal has a name property
if (animal.name) {
// condition 4:check if animal has a gender property
if (animal.gender) {
result = ${animal.name} is a ${animal.gender} ${animal.type};;
} else {
result = "no animal gender";
}
} else {
result = "no animal name";
}
} else {
result = "no animal type";
}
} else {
result = "no animal";
}
return result;
};
console.log(printanimaldetails());// 'no animal'
console.log(printanimaldetails({ type:"dog",gender:"female"}));// 'no animal name'
console.log(printanimaldetails({ type:"dog",name:"lucy"}));// 'no animal gender'
console.log(
printanimaldetails({ type:"dog",name:"lucy",gender:"female"})
);// 'lucy is a female dog'
你覺得上面的代碼怎麼樣。
它工作得很好，但是代碼很長並且維護困難。如果不使用lint工具，找出閉合花括號在哪都會浪費很多時間。