異步和回調(diào)

什么是同步和異步

先來(lái)看一段代碼

console.log(1)
setTimeout(function(){console.log(2)},0)
console.log(3)//1,3,2

代碼執(zhí)行的結(jié)果如上所示為1,3,2 很明顯與書(shū)寫的順序1,2,3不一致,所以我們可以簡(jiǎn)單的理解為代碼的執(zhí)行順序與書(shū)寫順序不同時(shí)就是異步.相對(duì)應(yīng)的,代碼順序與執(zhí)行順序相同的就是同步.

為什么有同步和異步

由于js同時(shí)只能執(zhí)行一個(gè)任務(wù)(即單線程,這個(gè)單線程是主線程),所以后面的任務(wù)只能在隊(duì)列中等待前一個(gè)的執(zhí)行.當(dāng)一個(gè)任務(wù)不能立刻得到結(jié)果時(shí)就會(huì)形成阻塞效應(yīng).這就是同步的缺陷.例如:taskC一定要等待taskB的結(jié)果.

function taskB(){
  var response = $.ajax({
    url:"/data.json",
    async: false 
  })
  return response 
}

taskA()
taskB()
taskC()

為了解決該問(wèn)題,js會(huì)暫時(shí)將其放在任務(wù)隊(duì)列中等待,同時(shí)不斷檢查任務(wù)隊(duì)列中任務(wù)狀態(tài),一旦隊(duì)列中的任務(wù)得到結(jié)果(例如ajax從服務(wù)器得到結(jié)果)就重新將該任務(wù)放回主線程(一般采用回調(diào)函數(shù)的形式).
異步模式下,tackB請(qǐng)求ajax數(shù)據(jù)時(shí)taskC已經(jīng)開(kāi)始執(zhí)行,taskB暫時(shí)放在任務(wù)隊(duì)列等待結(jié)果,當(dāng)有結(jié)果時(shí)重新進(jìn)入主線程執(zhí)行.

function taskB(){
  var result= $.ajax({
    url:"/data.json",
    async: true
  })
  return result
}

taskA()
taskB()
taskC()
常見(jiàn)的異步操作模式
  • 回調(diào)函數(shù)
function f1(callback) {
  callback();
}
function f2() {
 console.log("f2被調(diào)用")
}
f1(f2);
  • 事件監(jiān)聽(tīng)
f1.on('done', f2);
function f1() {
  setTimeout(function () {
    f1.trigger('done');
  }, 1000);
}
function f2(){console.log("f2被調(diào)用")}
//f2會(huì)在f1執(zhí)行1s后被調(diào)用
  • 發(fā)布/訂閱

事件可以理解成”信號(hào)“桶至,如果存在一個(gè)”信號(hào)中心“江场,某個(gè)任務(wù)執(zhí)行完成曼氛,就向信號(hào)中心”發(fā)布“(publish)一個(gè)信號(hào)靶擦,其他任務(wù)可以向信號(hào)中心”訂閱“(subscribe)這個(gè)信號(hào)块仆,從而知道什么時(shí)候自己可以開(kāi)始執(zhí)行

回調(diào)函數(shù)

維基百科的解釋是:

回調(diào)函數(shù)祭隔,或簡(jiǎn)稱回調(diào)(Callback 即call then back 被主函數(shù)調(diào)用運(yùn)算后會(huì)返回主函數(shù)),是指通過(guò)函數(shù)參數(shù)傳遞到其它代碼的锄俄,某一塊可執(zhí)行代碼引用技竟。在js中允許簡(jiǎn)單的將函數(shù)名作為參數(shù)傳遞冰肴。

知乎上最高票的回答是用了一個(gè)比喻:

你到一個(gè)商店買東西,剛好你要的東西沒(méi)有貨灵奖,于是你在店員那里留下了你的電話嚼沿,過(guò)了幾天店里有貨了,店員就打了你的電話瓷患,然后你接到電話后就到店里去取了貨。在這個(gè)例子里遣妥,你的電話號(hào)碼就叫回調(diào)函數(shù)擅编,你把電話留給店員就叫登記回調(diào)函數(shù),店里后來(lái)有貨了叫做觸發(fā)了回調(diào)關(guān)聯(lián)的事件箫踩,店員給你打電話叫做調(diào)用回調(diào)函數(shù)爱态,你到店里去取貨叫做響應(yīng)回調(diào)事件。
https://www.zhihu.com/question/19801131/answer/13005983

所以傳給對(duì)方一個(gè)函數(shù),當(dāng)對(duì)方在合適的時(shí)機(jī)調(diào)用這個(gè)函數(shù),這個(gè)函數(shù)就是回調(diào)函數(shù).如下所示,當(dāng)f2作為f1的參數(shù)傳給f1,當(dāng)f1執(zhí)行到相應(yīng)位置時(shí)就會(huì)調(diào)用f2,這里f2就是回調(diào)函數(shù).

function f1(callback) {
  console.log(1)
  callback();
}

function f2() {
  console.log(2)
}

f1(f2);

回調(diào)函數(shù)的優(yōu)點(diǎn)是便于理解,缺點(diǎn)是代碼間耦合程度高且程序流程不明晰,不方便理解維護(hù).

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末境钟,一起剝皮案震驚了整個(gè)濱河市锦担,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌慨削,老刑警劉巖洞渔,帶你破解...
    沈念sama閱讀 222,627評(píng)論 6 517
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異缚态,居然都是意外死亡磁椒,警方通過(guò)查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,180評(píng)論 3 399
  • 文/潘曉璐 我一進(jìn)店門玫芦,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)浆熔,“玉大人,你說(shuō)我怎么就攤上這事桥帆∫皆觯” “怎么了?”我有些...
    開(kāi)封第一講書(shū)人閱讀 169,346評(píng)論 0 362
  • 文/不壞的土叔 我叫張陵老虫,是天一觀的道長(zhǎng)叶骨。 經(jīng)常有香客問(wèn)我,道長(zhǎng)张遭,這世上最難降的妖魔是什么邓萨? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 60,097評(píng)論 1 300
  • 正文 為了忘掉前任,我火速辦了婚禮,結(jié)果婚禮上缔恳,老公的妹妹穿的比我還像新娘宝剖。我一直安慰自己,他們只是感情好歉甚,可當(dāng)我...
    茶點(diǎn)故事閱讀 69,100評(píng)論 6 398
  • 文/花漫 我一把揭開(kāi)白布万细。 她就那樣靜靜地躺著,像睡著了一般纸泄。 火紅的嫁衣襯著肌膚如雪赖钞。 梳的紋絲不亂的頭發(fā)上,一...
    開(kāi)封第一講書(shū)人閱讀 52,696評(píng)論 1 312
  • 那天聘裁,我揣著相機(jī)與錄音雪营,去河邊找鬼。 笑死衡便,一個(gè)胖子當(dāng)著我的面吹牛献起,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播镣陕,決...
    沈念sama閱讀 41,165評(píng)論 3 422
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼谴餐,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了呆抑?” 一聲冷哼從身側(cè)響起岂嗓,我...
    開(kāi)封第一講書(shū)人閱讀 40,108評(píng)論 0 277
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎鹊碍,沒(méi)想到半個(gè)月后厌殉,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 46,646評(píng)論 1 319
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡妹萨,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,709評(píng)論 3 342
  • 正文 我和宋清朗相戀三年年枕,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片乎完。...
    茶點(diǎn)故事閱讀 40,861評(píng)論 1 353
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡熏兄,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出树姨,到底是詐尸還是另有隱情摩桶,我是刑警寧澤,帶...
    沈念sama閱讀 36,527評(píng)論 5 351
  • 正文 年R本政府宣布帽揪,位于F島的核電站硝清,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏转晰。R本人自食惡果不足惜芦拿,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,196評(píng)論 3 336
  • 文/蒙蒙 一士飒、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧蔗崎,春花似錦酵幕、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 32,698評(píng)論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至未桥,卻和暖如春笔刹,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背冬耿。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 33,804評(píng)論 1 274
  • 我被黑心中介騙來(lái)泰國(guó)打工舌菜, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人亦镶。 一個(gè)月前我還...
    沈念sama閱讀 49,287評(píng)論 3 379
  • 正文 我出身青樓酷师,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親染乌。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,860評(píng)論 2 361

推薦閱讀更多精彩內(nèi)容

  • 1 什么是異步編程 通過(guò)學(xué)習(xí)相關(guān)概念懂讯,我們逐步解釋異步編程是什么荷憋。 1.1 阻塞 程序未得到所需計(jì)算資源時(shí)被掛起的...
    hugoren閱讀 2,663評(píng)論 2 10
  • 上篇 中篇 下篇 1 什么是異步編程 1.1 阻塞 程序未得到所需計(jì)算資源時(shí)被掛起的狀態(tài)。 程序在等待某個(gè)操作完成...
    秦時(shí)明星閱讀 1,006評(píng)論 0 3
  • 轉(zhuǎn)自: http://www.reibang.com/p/486b0965c296 http://www.jia...
    demop閱讀 3,897評(píng)論 1 21
  • 官方中文版原文鏈接 感謝社區(qū)中各位的大力支持褐望,譯者再次奉上一點(diǎn)點(diǎn)福利:阿里云產(chǎn)品券勒庄,享受所有官網(wǎng)優(yōu)惠,并抽取幸運(yùn)大...
    HetfieldJoe閱讀 4,723評(píng)論 7 31
  • 例子應(yīng)用: 比如說(shuō)一個(gè)文本系統(tǒng)瘫里,每個(gè)字母定一個(gè)對(duì)象实蔽,那么大小寫字母一共就是52個(gè),那么就要定義52個(gè)對(duì)象谨读。如果有一...
    Arya鑫閱讀 185評(píng)論 0 0