<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
//try catch
try {
willExcept.byeBye()
console.log('try syntax last sentence')
} catch {
console.log("catch syntax last sentence")
}
//finally
try{
willExcept.byeBye()
console.log("try syntax last sentence")
} catch {
console.log("catch syntax last sentence")
} finally {
console.log("finally syntax last sentence")
}
</script>
<script>
//different use finally and non use finally
//non use finally
function test() {
try{
alert('A')
throw "Exception"
} catch (exception) {
alert('B')
return
}
alert('C')
}
test()
//use finally
function test1() {
try{
alert('A')
throw "Exception"
} catch (exception) {
alert('B')
return
} finally {
alert('C')
}
}
test1()
</script>
</head>
<body>
</body>
</html>
### `try` and `catch` Example
- The first script block demonstrates a basic use of `try` and `catch` without `finally`. It attempts to call a non-existent method (`byeBye`) on an undefined variable (`willExcept`), which results in an exception.
- The `try` block is where potentially error-throwing code is placed. Since `willExcept` is not defined, attempting to call `byeBye` on it throws a ReferenceError, skipping the rest of the `try` block.
- The `catch` block catches the exception, executing its code block, which logs "catch syntax last sentence" to the console.
### `try`, `catch`, and `finally` Example
- The second script block introduces the `finally` block, which is executed regardless of whether an exception was thrown (and caught) or not.
- This example attempts the same operation as the first but adds a `finally` block, which logs "finally syntax last sentence" to the console after the `catch` block executes.
### Use vs. Non-Use of `finally`
- The third script block contrasts the behavior of code when using `finally` versus not using it.
- **Without `finally` (`test` function)**: The function demonstrates that when an exception is thrown and caught, and a `return` statement is executed in the `catch` block, subsequent code in the same block as the `try`-`catch` (such as the final `alert('C')`) is not executed. The flow is `alert('A')` ➔ Exception ➔ `alert('B')` ➔ Return.
- **With `finally` (`test1` function)**: This function shows that even when a `return` statement is executed within the `catch` block, the `finally` block still executes, ensuring that `alert('C')` is shown. The flow is `alert('A')` ➔ Exception ➔ `alert('B')` ➔ `alert('C')`.
### Key Takeaways
- **Error Handling**: The `try`-`catch` construct allows for handling exceptions gracefully, ensuring that errors do not necessarily result in a complete failure or crash of the script.
- **`finally` Use Cases**: The `finally` block is useful for cleanup activities that need to happen regardless of success or failure within the `try` block, such as closing resources or resetting variables.
- **Flow Control**: `finally` affects the flow of control in a program by ensuring execution of its block, even if the `try` or `catch` block includes a `return` statement.
These examples illustrate fundamental error handling patterns in JavaScript, highlighting the importance of properly managing exceptions to create robust web applications.
'개념 > 혼자 공부하는 Javascript' 카테고리의 다른 글
chapter 8) Except (0) | 2024.12.26 |
---|---|
chapter 8) print out exception (2) | 2024.12.25 |
chapter 7) Creating a document object (0) | 2024.12.23 |
chapter 7) DomContentLoaded event (0) | 2024.12.22 |
chapter 7) handle to javascript code in HTML (1) | 2024.12.21 |