JavaScript中需要捕獲異常的場景及用法

在JavaScript中，捕獲異常主要使用try...catch語句。該語法允許開發者處理執行時錯誤，從而避免程式崩潰。以下是try...catch的基本用法：

try {
    // 可能丟擲異常的程式碼
    let result = riskyFunction(); // 假設這是一個可能失敗的函式
    console.log(result);
} catch (error) {
    // 處理錯誤的程式碼
    console.error('捕獲到錯誤:', error.message);
}

在上面的示例中，riskyFunction函式如果丟擲異常，則控制流將跳轉到catch塊中，允許開發者處理該錯誤，而不會導致整個程式崩潰。

異常捕獲的場景

1. 網路請求： 在進行網路請求時，可能會出現網路錯誤或伺服器不可用的情況。使用try...catch可以捕獲這些異常並進行相應處理。

   async function fetchData(url) {
       try {
           let response = await fetch(url);
           if (!response.ok) throw new Error('網路響應錯誤');
           let data = await response.json();
           console.log(data);
       } catch (error) {
           console.error('請求失敗:', error.message);
       }
   }

2. 使用者輸入驗證： 當處理使用者輸入時，例如從表單中讀取資料，可能會出現無效資料的情況。透過捕獲異常，可以提供更好的使用者體驗。

   function processInput(input) {
       try {
           if (!input) throw new Error('輸入不能為空');
           // 處理輸入
           console.log('處理輸入:', input);
       } catch (error) {
           alert('錯誤: ' + error.message);
       }
   }

3. API呼叫： 在呼叫外部API時，可能會因為API的變化或異常而導致錯誤。使用try...catch可以使程式碼更健壯。

   function callExternalAPI() {
       try {
           // 假設這是一個外部API呼叫
           let response = apiCall();
           console.log(response);
       } catch (error) {
           console.error('API呼叫失敗:', error);
       }
   }

4. 執行時異常： 在某些情況下，程式碼邏輯可能導致執行時異常，例如陣列越界、型別錯誤等。使用try...catch塊可以捕獲這些異常。

   function accessArrayElement(arr, index) {
       try {
           let value = arr[index];
           if (value === undefined) throw new Error('索引超出範圍');
           console.log('陣列元素:', value);
       } catch (error) {
           console.error('錯誤:', error.message);
       }
   }

5. 非同步程式碼： 在處理非同步操作時，可以使用try...catch來捕獲async/await中的異常。

   async function asyncFunction() {
       try {
           let result = await someAsyncOperation();
           console.log('結果:', result);
       } catch (error) {
           console.error('非同步操作失敗:', error.message);
       }
   }

透過合理使用try...catch，可以提升程式碼的健壯性和可維護性，有效捕獲並處理執行時錯誤。