iT邦幫忙

2024 iThome 鐵人賽

DAY 15
0
JavaScript

入門JavaScript系列 第 15

條件判斷應用

  • 分享至 

  • xImage
  •  

1. 條件鏈(Chaining Conditions)

可以利用 if...else if...else 來鏈接多個條件,使邏輯更清晰。

let score = 85;

if (score >= 90) {
    console.log("A");
} else if (score >= 80) {
    console.log("B");
} else if (score >= 70) {
    console.log("C");
} else {
    console.log("D");
}

2. 使用 switch 處理多個條件

switch 語句適合處理多個相同變數的情況,讓代碼更加整潔。

let day = 3;

switch (day) {
    case 1:
        console.log("Monday");
        break;
    case 2:
        console.log("Tuesday");
        break;
    case 3:
        console.log("Wednesday");
        break;
    default:
        console.log("Unknown day");
}

3. 短路求值

利用邏輯運算符的短路特性,讓代碼更加簡潔。

let isAuthenticated = true;
let userName = isAuthenticated && 'Alice'; // 如果 isAuthenticated 為 true,userName 為 'Alice'

4. 條件運算符

使用三元運算符來簡化簡單的條件判斷。

let age = 18;
let canVote = (age >= 18) ? 'Yes' : 'No';
console.log(canVote); // 'Yes'

5. 使用 try...catch 進行錯誤處理

在處理可能會拋出錯誤的操作時,使用 try...catch 來保持程式的穩定性。

try {
    let result = riskyFunction();
} catch (error) {
    console.error("An error occurred:", error.message);
}

6. 動態屬性檢查

檢查物件屬性是否存在,並根據情況執行不同的代碼。

let user = { name: 'Alice' };

if ('email' in user) {
    console.log(user.email);
} else {
    console.log("Email not provided.");
}

7. 使用函數封裝邏輯

將複雜的條件邏輯封裝成函數,增加可讀性。

function isEligible(age, hasPermission) {
    return age >= 18 && hasPermission;
}

if (isEligible(20, true)) {
    console.log('You can enter.');
}

8. 利用 Array.prototype.includes()

用於檢查陣列中是否包含特定值,使代碼更簡潔。

let allowedFruits = ['apple', 'banana', 'cherry'];
let fruit = 'banana';

if (allowedFruits.includes(fruit)) {
    console.log(`${fruit} is allowed.`);
}

9. 使用 null 合併運算符

在條件判斷時檢查 nullundefined,給予預設值。

let userInput = null;
let defaultInput = userInput ?? 'Default value';
console.log(defaultInput); // 'Default value'

10. 多重條件的結合

使用邏輯運算符組合多個條件,創建更複雜的邏輯。

let isLoggedIn = true;
let hasPermission = false;

if (isLoggedIn && hasPermission) {
    console.log("Access granted.");
} else if (isLoggedIn && !hasPermission) {
    console.log("Access denied: insufficient permissions.");
} else {
    console.log("Please log in.");
}

上一篇
條件判斷
下一篇
迴圈
系列文
入門JavaScript30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言