js異步編程小技巧詳解
異步回調(diào)是js的一大特性,理解好用好這個(gè)特性可以寫出很高質(zhì)量的代碼。分享一些實(shí)際用的一些異步編程技巧。
1.我們有些應(yīng)用環(huán)境是需要等待兩個(gè)http請求或IO操作返回后進(jìn)行后續(xù)邏輯的處理。而這種情況使用回調(diào)嵌套代碼會(huì)顯得很難維護(hù),而且也沒有充分使用js的異步優(yōu)勢。
看下實(shí)例(為了大家容易理解使用了jq作為示例)
$.get("獲取數(shù)據(jù)1.html",function(data,status){ $.get("獲取數(shù)據(jù)2.html",function(data1,status1){ //使用 data 和data1邏輯 }); });
這種代碼明顯需要等待上個(gè)ajax請求返回后才會(huì)進(jìn)行第二個(gè)請求,效率很低,而且回調(diào)嵌很不利于邏輯。我們可以使用計(jì)數(shù)器的方式,每完成一個(gè)請求計(jì)數(shù)器加1 當(dāng)計(jì)數(shù)器等于2時(shí)執(zhí)行回調(diào)邏輯
var get_data var get-data1 function next(){ //使用 data 和data1邏輯 } $.get("獲取數(shù)據(jù)1.html",function(data,status){ get_data=data (++over === all) && (next()); }); $.get("獲取數(shù)據(jù)2.html",function(data1,status1){ get_data1=data1 (++over === all) && (next()); });
這種方式兩個(gè)http并行發(fā)送,極大的提高了效率
相關(guān)文章
js創(chuàng)建元素(節(jié)點(diǎn))示例
本文為大家介紹下使用js是如何創(chuàng)建元素(節(jié)點(diǎn))的,感興趣的朋友不要錯(cuò)過2014-01-01js模仿html5 placeholder適應(yīng)于不支持的瀏覽器
html5原生支持placeholder,對于不支持的瀏覽器(ie)可用js模擬實(shí)現(xiàn),不要走開,接下來為您詳細(xì)介紹實(shí)現(xiàn)方法2013-01-01js+html5通過canvas指定開始和結(jié)束點(diǎn)繪制線條的方法
這篇文章主要介紹了js+html5通過canvas指定開始和結(jié)束點(diǎn)繪制線條的方法,涉及html5屬性的操作技巧,需要的朋友可以參考下2015-06-06解決layui table表單提示數(shù)據(jù)接口請求異常的問題
今天小編就為大家分享一篇解決layui table表單提示數(shù)據(jù)接口請求異常的問題,具有很好的參考價(jià)值,希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09微信小程序車牌號碼模擬鍵盤輸入功能的實(shí)現(xiàn)代碼
這篇文章主要介紹了微信小程序車牌號碼模擬鍵盤輸入功能的實(shí)現(xiàn)代碼,非常不錯(cuò),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2018-11-11JavaScript定時(shí)器實(shí)現(xiàn)無縫滾動(dòng)圖片
這篇文章主要為大家詳細(xì)介紹了JavaScript定時(shí)器實(shí)現(xiàn)無縫滾動(dòng)圖片,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-05-05微信小程序scroll-view點(diǎn)擊項(xiàng)自動(dòng)居中效果的實(shí)現(xiàn)
這篇文章主要介紹了微信小程序scroll-view點(diǎn)擊項(xiàng)自動(dòng)居中效果的實(shí)現(xiàn)代碼,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-03-03