js異步操作的方法:
1.回調(diào)函數(shù)
就是把一方法當(dāng)作參數(shù)傳到另一個(gè)方法里。有兩種回調(diào)方式:同步回調(diào)和有異步回調(diào)
- 同步回調(diào)
function f2(data){
console.log(data)
}
function f1(callfun){
var a =""
callfun(a)
console.log("執(zhí)行完畢")
}
f1(f2)
執(zhí)行順序:執(zhí)行f1->f2->f1的console
依然是順序執(zhí)行,等待f2執(zhí)行完畢再繼續(xù)档插。同步回調(diào)的實(shí)質(zhì)就是代碼分離
- 異步回調(diào)
function f2(data){
console.log(data)
}
function f1(callfun){
var a =""
setTimeout(callfun(a),500)
console.log("執(zhí)行完畢")
}
f1(f2)
執(zhí)行順序:執(zhí)行f1->設(shè)定f2執(zhí)行的定時(shí)器->f1的console->f2
通過(guò)定時(shí)器實(shí)現(xiàn)了函數(shù)的異步回調(diào)
優(yōu)點(diǎn):看起來(lái)簡(jiǎn)單易懂
缺點(diǎn):不利于代碼的閱讀和維護(hù),各個(gè)部分之間高度耦合亚再。流程會(huì)很混亂郭膛,而且每個(gè)任務(wù)只能指定一個(gè)回調(diào)函數(shù)。容易陷入回調(diào)地獄氛悬。(多次回調(diào)信任問(wèn)題)
為了使多個(gè)函數(shù)可以順序執(zhí)行则剃,使用多層次的異步回調(diào)過(guò)程中,
doA(function(){
doB();
doC(function(){
doD()
})
doE()
})
doF() //注:BCDE都是異步操作
以上代碼的執(zhí)行序:A->F->B->C->E->F->D
補(bǔ)充:setTimeout作用如捅,他是一個(gè)定時(shí)器棍现,當(dāng)定時(shí)器時(shí)間到了之后,環(huán)境會(huì)把回調(diào)函數(shù)掛到事件循環(huán)中镜遣,然后就等待前面的函數(shù)執(zhí)行完畢己肮,再執(zhí)行他。所以定時(shí)期只能保證事件肯定在設(shè)定時(shí)間之后執(zhí)行悲关,不能保證具體執(zhí)行時(shí)間谎僻。
2.事件監(jiān)聽(tīng)
比如click事件,觸發(fā)操作寓辱。
3.發(fā)布訂閱模式
我們假定艘绍,存在一個(gè)"信號(hào)中心",某個(gè)任務(wù)執(zhí)行完成秫筏,就向信號(hào)中心"發(fā)布"(publish)一個(gè)信號(hào)诱鞠,其他任務(wù)可以向信號(hào)中心"訂閱"(subscribe)這個(gè)信號(hào)挎挖,從而知道什么時(shí)候自己可以開始執(zhí)行。這就叫做"發(fā)布/訂閱模式"(publish-subscribe pattern)航夺,又稱"觀察者模式"(observer pattern)肋乍。我們可以通過(guò)查看"消息中心",了解存在多少信號(hào)敷存、每個(gè)信號(hào)有多少訂閱者墓造,從而監(jiān)控程序的運(yùn)行。
jQuery.subscribe("done", f2); //首先锚烦,f2向"信號(hào)中心"jQuery訂閱"done"信號(hào)觅闽。
function f1(){
setTimeout(function () {
// f1的任務(wù)代碼
jQuery.publish("done"); //f1執(zhí)行完成后,向"信號(hào)中心"jQuery發(fā)布"done"信號(hào)涮俄,引發(fā)f2的執(zhí)行蛉拙。
}, 1000);
}
jQuery.unsubscribe("done", f2); //f2完成執(zhí)行后,也可以取消訂閱(unsubscribe)彻亲。
4.promise http://www.reibang.com/p/0edaf787fd0b
5.異步迭代生成器 http://www.reibang.com/p/c99fab058b77
6.asyc孕锄,await
以上幾種方法的比較: