「每日一题」什么是异步?
说说你的理解,什么是异步。
由于各个语言处理异步的机制有差异,我们这里只说 JS 中的异步。
怎么样的代码是异步代码?
我们先不深入异步概念,先从「表象」来看看怎么样的代码是异步代码:
异步代码的书写顺序与执行顺序不同。(这并不是异步的定义。另外「书写顺序与执行顺序不同的代码」不一定是异步代码)
console.log(1)
setTimeout(function(){
console.log(2)
},0)
console.log(3)
上面代码的书写顺序是 1 -> 2 -> 3;
但是执行顺序是 1 -> 3 -> 2。
中间的 console.log(2) 就是异步执行的。
你现在知道了「代码的书写顺序和执行顺序居然可以不同!」
什么是异步?
同步:一定要等任务执行完了,得到结果,才执行下一个任务。
function taskSync = function(){
return '同步任务的返回值'
}
var result = taskSync() // 那么 result 就是同步任务的结果
otherTask() // 然后执行下一个任务
异步:不等任务执行完,直接执行下一个任务。
function taskAsync = function(){
var result = setTimeout(function(){
console.log('异步任务的结果')
}, 3000)
return result
}
var result = taskAsync() // result 不是异步任务的结果,而是一个 timer id
otherTask() // 立即执行其他任务,不等异步任务结束
聪明的你可能会发现,我们拿到的 result 不是异步执行的结果,而是一个 timer id,那么要怎么拿到异步任务的结果呢?
用回调。
改下代码如下:
function taskAsync = function(callback){
var result = setTimeout(function(){
callback('异步任务的结果')
}, 3000)
return result
}
taskAsync(function callback(result){
console.log(result) // 三秒钟后,这个 callback 函数会被执行
})
otherTask() // 立即执行其他任务,不等异步任务结束
所以「回调」经常用于获取「异步任务」的结果。
什么情况下需要用到异步?
现在有三个函数,taskA()、taskB() 和 taskC(),三个任务互不影响。
taskA 和 taskC 执行得很快,但是 taskB 执行需要 10 秒钟。
// 同步的写法
function taskB(){
var response = $.ajax({
url:"/data.json",
async: false // 注意这里 async 为 false,表示是同步
})
return response // 十秒钟后,返回 response
}
taskA()
taskB()
taskC()
taskC 一定要等 taskB 执行完了才能执行,这就是同步。
执行顺序为:
A -> B -> AJAX 请求 -> C ---------------------------
现在换成异步:
// 异步的写法
function taskB(){
var result = $.ajax({
url:"/data.json",
async: true // 异步
})
return result // 一定要注意,现在的 result 不是上面的 response
}
taskA()
taskB()
taskC()
这样写之后,执行顺序就是
A -> B -> C ---------------------------------------
-> AJAX 请求 --------------------------------
就是说 AJAX 请求和任务C 同时执行。
但是请注意执行的主体。AJAX 请求是由浏览器的网络请求模块执行的,taskC 是由 JS 引擎执行的。
综上,如果几个任务互相独立,其中一个执行时间较长,那么一般就用异步地方式做这件事。
JS 引擎不能同时做两件事
有些人说异步是同时做两件事,但其实 JS 引擎不会这样。
以 setTimeout 为例,setTimeout 里面的代码一定会在当前环境中的任务执行完了「之后」才执行。
异步意味着不等待任务结束,并没有强制要求两个任务「同时」进行。
但是 AJAX 请求是可以与 JS 代码同时进行的,因为这个请求不是由 JS 引擎负责,而是由浏览器网络模块负责。
以上,就是异步的简介。
网络上对异步的解释很多,这里只是我的一己之见,如有疏漏,还望见谅。
欢迎进群与我探讨技术,wx frank_fang