1、回調函數:函數callback以參數形式傳給另一函數的，那麼函數callback就叫回調函數。
2、為什麼需要回調函數？
靈活！！
也許有人有疑問了:一定要以參數形式傳過去嗎，我不可以直接在函數main裡面調用函數callback嗎？
可以。但：
如果你直接在函數main裡調用的話，那麼這個回調函數就被限制死了。但是使用函數做參數就有下面的好處：當你main(callback1)的時候函數callback1就成了回調函數，而你還可以main(callback2)這個時候，函數callback2就成了回調函數。如果你寫成了function main(){...;callback1();}就失去了變量的靈活性。
例如：
<html>
<head>
<title>回調函數(callback)</title>
<script language="javascript" type="text/javascript">
function main(callback)
{
alert("我是parent函數main！");
alert("調用回調函數");
callback();
}
function <span style="color: rgb(102, 102, 102); font-family: 宋體, 'Arial Narrow', arial, serif;font-size:18px; line-height: 28px;">callback1</span>(){
alert("我是回調函數<span style="color: rgb(102, 102, 102); font-family: 宋體, 'Arial Narrow', arial, serif;font-size:18px; line-height: 28px;">callback1</span>");
}
function <span style="color: rgb(102, 102, 102); font-family: 宋體, 'Arial Narrow', arial, serif;font-size:18px; line-height: 28px;">callback2</span>(){
alert("我是回調函數<span style="color: rgb(102, 102, 102); font-family: 宋體, 'Arial Narrow', arial, serif;font-size:18px; line-height: 28px;">callback2</span>");
}
function test()
{
main(<span style="color: rgb(102, 102, 102); font-family: 宋體, 'Arial Narrow', arial, serif;font-size:18px; line-height: 28px;">callback1</span>);
main(<span style="color: rgb(102, 102, 102); font-family: 宋體, 'Arial Narrow', arial, serif;font-size:18px; line-height: 28px;">callback2</span>);
}
</script>
</head>
<body>
<h1>學習js回調函數</h1>
<button onClick=test()>click me</button>
<p>應該能看到調用了兩個回調函數</p>
</body>
</html>
![Vue3 中 watch 與 watchEffect 有什麼差別？[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)