同步和异步

一、javascript中为什么需要引入异步？

   1.我们知道js是单线程语言，只能同时做一件事。但在遇到需要等待（网络请求，定时任务）不能卡住，所以引入了异步

   2.异步就是为了解决单线程需要等待的问题（如：网络请求，定时任务）

 3.异步是基于回调 callback 函数形式 

二、同步和异步

1.异步：不会阻塞代码执行，

//异步
console.log(100)
setTimeout(()=>{ // 回调函数
    console.log(200)
},1000)
console.log(300)

 代码依次输出： 100  、300 、200

2.同步：会阻塞代码执行，上一行代码没执行完不会往下执行

//同步
console.log(100)
alert(200)
console.log(300)

alert 弹窗不关闭，下一行代码不会执行

三、异步应用场景

　　1.网络请求，如：ajax、图片加载

//ajax
console.log('start')
$.get('./data1.json',function(data1){
      console.log(data1)
})
console.log('end')

//图片加载
console.log('start')
let img = document.createElement('img')
img.onload = function(){
      console.log('loaded')
}
img.src = '/xxx.png'
console.log('end')

　　2. 定时任务，如setTimeout、setInterval

//setTimout
console.log(100)
setTimeout(function(){
      console.log(200)
},1000)
console.log(300)

//setInterval
console.log(100)
setInterval(function(){
     console.log(200)
},1000)
console.log(300)