先看下面的 demo，根据程序阅读起来表达的意思，应该是先打印100，1秒钟之后打印200，最后打印300。但是实际运营根本不是那么回事。
console.log(100)
setTimeout(function () {
console.log(200)
}, 1000)
console.log(300)
再对比以下程序。先打印100，再弹出200（等待用户确认），最后打印300。这个运行效果就符合预期要求。
console.log(100)
alert(200) // 1秒钟之后点击确认
console.log(300)
这两个例子到底有何区别？———— 第一个示例中间的步骤根本没有阻塞接下来程序的运行，而第二个示例却阻塞了后面程序的运行。前面这种表现就叫做异步（后面这个叫做同步）
为何需要异步呢？如果第一个示例中间步骤是一个 ajax 请求，现在网络比较慢，请求需要5秒钟。如果是同步，这5秒钟页面就卡死在这里啥也干不了了。
最后，前端 JS 脚本用到异步的场景主要有两个：
- 定时 setTimeout setInverval
- 网络请求，如 ajax
加载
- 事件绑定（后面会有解释）
ajax 代码示例：
console.log('start')
$.get('./data1.json', function (data1) {
console.log(data1)
})
console.log('end')
img 代码示例（常用语打点统计）:
console.log('start')
var img = document.createElement('img')
img.onload = function () {
console.log('loaded')
}
img.src = '/xxx.png'
console.log('end')
事件绑定:
console.log('start')
document.getElementById('btn1').addEventListener('click', function () {
alert('clicked')
})
console.log('end')
同步和异步的区别是什么？分别举一个同步和异步的例子
- 同步会阻塞代码执行，而异步不会。
alert是同步，setTimeout是异步
一个关于setTimeout的笔试题
console.log(1)
setTimeout(function () {
console.log(2)
}, 0)
console.log(3)
setTimeout(function () {
console.log(4)
}, 1000)
console.log(5)
结果：
1 3 5 2 4
前端使用异步的场景有哪些?
- setTimeout setInterval
- 网络请求
- 事件绑定（可以说一下自己的理解）