# 第三章 Node JS 非同步程式的處理方式
## 同步的程式
```htmlembedded=
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>同步流程控制</title>
<script>
// 同步的程式
function add(n1, n2){
return n1+n2;
}
function test(){
let result=add(20, 5);
console.log(result);
}
</script>
</head>
<body>
<h3>同步流程控制</h3>
<button onclick="test();">Test</button>
</body>
</html>
```
## 問題的起源: 非同步的程式
```javascript=
function delayedAdd(n1, n2, delayTime){
// 設定排程，延遲一段時間後執行
setTimeout(function(){
return n1+n2;
}, delayTime);
}
function test(){
let result=delayedAdd(20, 5, 2000);
console.log(result);
}
```
## 方法一: callback
```javascript=
function delayedAdd(n1, n2, delayTime, callback){
// 設定排程，延遲一段時間後執行
window.setTimeout(function(){
// 延遲一段時間之後，計算加法，呼叫 callback 函式
callback(n1+n2);
}, delayTime);
}
function test(){
delayedAdd(20, 5, 2000, function(result){
console.log(result);
});
}
```
## 方法二: promise
```javascript=
function delayedAdd(n1, n2, delayTime){
// 建立 Promise 物件：new Promise(執行函式)
let p = new Promise(function(resolve, reject){
window.setTimeout(function(){
resolve(n1+n2); // 工作完成，呼叫 resolve 函式，並且把結果透過參數傳遞回去
}, delayTime);
});
return p;
}
function test(){
let promise=delayedAdd(20, 5, 2000);
promise.then(function(result){
console.log(result);
}).catch(function(error){
console.log(error);
});
}
```
## 方法三: async/await
```javascript=
function delayedAdd(n1, n2, delayTime){
// 建立 Promise 物件：new Promise(執行函式)
return new Promise(function(resolve, reject){
window.setTimeout(function(){
resolve(n1+n2); // 工作完成，呼叫 resolve 函式，並且把結果透過參數傳遞進去
}, delayTime);
});
}
async function test(){
let result=await delayedAdd(20, 5, 2000);
console.log(result);
}
```
Sign in with Wallet
Connect another wallet