国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

將前后端交互同步化(本篇封裝了一下微信小程序的請(qǐng)求)

codecraft / 853人閱讀

摘要:今天自己寫小程序的時(shí)候,近乎被異步搞到崩潰,不停地嵌套回調(diào)我知道和,但是我嫌寫起來跟裹腳布似的,而我怕有兼容性問題也從來沒有試過言歸正傳,將小程序的異步調(diào)用變?yōu)橥揭韵陆坛踢m用于所有異步,只是給小程序做了一下封裝。

今天自己寫小程序的時(shí)候,近乎被異步搞到崩潰,不停地嵌套回調(diào)(我知道 await 和 promise,但是我嫌promise寫起來跟裹腳布似的,而await我怕有兼容性問題也從來沒有試過)
言歸正傳,將小程序的異步調(diào)用變?yōu)橥?以下教程適用于所有異步,只是給小程序做了一下封裝)。
原理:增加事件隊(duì)列,采用事件回調(diào)來完成同步化

以下代碼復(fù)制粘貼到控制臺(tái)即可測(cè)試效果;
這里直接寫es6代碼了,先寫個(gè)定時(shí)器版本的方便測(cè)試與理解
先寫個(gè)無注釋版本的,方便直接看代碼

class Async{
   
        constructor() {
            this.list = [];
            this.sock = false;
        }
   
        request(obj) {
            setTimeout(() => {
                console.log(obj);
                this.sock = false;
                if(this.list[0])
                    this.do(this.list.shift());
            }, 1000)
        }

        do(requestObj, sync) {
            if(!sync) {
                return this.request(requestObj);
            }
            if(this.sock) {
                this.list.push(requestObj);
            }else {
                this.sock = true;
                this.request(requestObj);
            }
        }

    }

-----------以下為注釋版本-----------

     class Async{
        
        constructor() {
            this.list = []; // 定義 執(zhí)行隊(duì)列
            this.sock = false; // 判斷是否有任務(wù)正在執(zhí)行
        }
   
        request(obj) {
            setTimeout(() => {
                console.log(obj); 
                this.sock = false; // 重置為沒有任務(wù)正在執(zhí)行
                if(this.list[0]) // 如果隊(duì)列中還有任務(wù),執(zhí)行下一個(gè)任務(wù)
                    this.do(this.list.shift());
            }, 1000) // 模擬一個(gè)異步,一秒后執(zhí)行任務(wù),執(zhí)行完成后執(zhí)行下一個(gè)異步任務(wù)
        }

        do(requestObj) {
            if(this.sock)  // 如果有任務(wù)在執(zhí)行
                this.list.push(requestObj); // 將當(dāng)前任務(wù)其增加到任務(wù)隊(duì)列
            else {
                this.sock = true; // 否則開始執(zhí)行當(dāng)前任務(wù)并設(shè)定"有任務(wù)在執(zhí)行"
                this.request(requestObj);
            }
        }
    }
    
    var x = new Async();
    x.do({url: 1}); // 一秒后打印 url: 1
    x.do({url: 2}); // 兩秒后打印 url: 2

但是同步只是異步無可奈何的選擇,所以不能全部否決掉異步

 class Async{
        
        constructor() {
            this.list = []; // 定義 執(zhí)行隊(duì)列
            this.sock = false; // 判斷是否有任務(wù)正在執(zhí)行
        }
   
        request(obj) {
            setTimeout(() => {
                console.log(obj); 
                this.sock = false; // 重置為沒有任務(wù)正在執(zhí)行
                if(this.list[0]) // 如果隊(duì)列中還有任務(wù),執(zhí)行下一個(gè)任務(wù)
                    this.do(this.list.shift());
            }, 1000) // 模擬一個(gè)異步,一秒后執(zhí)行任務(wù),執(zhí)行完成后執(zhí)行下一個(gè)異步任務(wù)
        }

        do(requestObj, sync) {
            if(!sync) // 判斷是否需要同步,如果需要再加入到隊(duì)列,不然直接執(zhí)行
                return this.request(requestObj); 
            if(this.sock)  // 如果有任務(wù)在執(zhí)行
                this.list.push(requestObj); // 將當(dāng)前任務(wù)其增加到任務(wù)隊(duì)列
            else {
                this.sock = true; // 否則開始執(zhí)行當(dāng)前任務(wù)并設(shè)定"有任務(wù)在執(zhí)行"
                this.request(requestObj);
            }
        }
    }
    
    var x = new Async();
    x.do({url: 1}, true); // 一秒后打印 url: 1
    x.do({url: 2}, true); // 兩秒后打印 url: 2
    x.do({url: 3}); // 一秒后打印 url: 3

然后加入小程序的接口調(diào)用方法

class AsyncRequest{
        
        constructor() {
            this.list = []; // 定義 執(zhí)行隊(duì)列
            this.sock = false; // 判斷是否有任務(wù)正在執(zhí)行
        }
   
         request(obj) {
            wx.request({
                      url: obj.url,
                    data: obj.data,
                    header: {
                       "content-type": "application/json" 
                    },
                      success: res => {
                        obj.cb(res);
                        if(this.list[0])
                            this.do(this.list.shift());
                      }
            })
        }

        do(requestObj, sync) {
            if(!sync) // 判斷是否需要同步,如果需要再加入到隊(duì)列,不然直接執(zhí)行
                return this.request(requestObj); 
            if(this.sock)  // 如果有任務(wù)在執(zhí)行
                this.list.push(requestObj); // 將當(dāng)前任務(wù)其增加到任務(wù)隊(duì)列
            else {
                this.sock = true; // 否則開始執(zhí)行當(dāng)前任務(wù)并設(shè)定"有任務(wù)在執(zhí)行"
                this.request(requestObj);
            }
        }
    }
    var x = new AsyncRequest();
    x.do({url: 1, data: {test: 1}, cb: ()=> {}}, true); // 先請(qǐng)求接口1
    x.do({url: 2}, true); // 1 請(qǐng)求完成后請(qǐng)求接口2
    x.do({url: 3}); // 和 1 同時(shí) 發(fā)起請(qǐng)求

文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址:http://specialneedsforspecialkids.com/yun/105637.html

相關(guān)文章

  • 面試題總結(jié)(js、html、小程序、React、ES6、Vue、算法、全棧熱門視頻資源)

    摘要:并總結(jié)經(jīng)典面試題集各種算法和插件前端視頻源碼資源于一身的文檔,優(yōu)化項(xiàng)目,在瀏覽器端的層面上提升速度,幫助初中級(jí)前端工程師快速搭建項(xiàng)目。 本文是關(guān)注微信小程序的開發(fā)和面試問題,由基礎(chǔ)到困難循序漸進(jìn),適合面試和開發(fā)小程序。并總結(jié)vue React html css js 經(jīng)典面試題 集各種算法和插件、前端視頻源碼資源于一身的文檔,優(yōu)化項(xiàng)目,在瀏覽器端的層面上提升速度,幫助初中級(jí)前端工程師快...

    pumpkin9 評(píng)論0 收藏0
  • 面試題總結(jié)(js、html、小程序、React、ES6、Vue、算法、全棧熱門視頻資源)

    摘要:并總結(jié)經(jīng)典面試題集各種算法和插件前端視頻源碼資源于一身的文檔,優(yōu)化項(xiàng)目,在瀏覽器端的層面上提升速度,幫助初中級(jí)前端工程師快速搭建項(xiàng)目。 本文是關(guān)注微信小程序的開發(fā)和面試問題,由基礎(chǔ)到困難循序漸進(jìn),適合面試和開發(fā)小程序。并總結(jié)vue React html css js 經(jīng)典面試題 集各種算法和插件、前端視頻源碼資源于一身的文檔,優(yōu)化項(xiàng)目,在瀏覽器端的層面上提升速度,幫助初中級(jí)前端工程師快...

    Carson 評(píng)論0 收藏0
  • 面試題總結(jié)(js、html、小程序、React、ES6、Vue、算法、全棧熱門視頻資源)

    摘要:并總結(jié)經(jīng)典面試題集各種算法和插件前端視頻源碼資源于一身的文檔,優(yōu)化項(xiàng)目,在瀏覽器端的層面上提升速度,幫助初中級(jí)前端工程師快速搭建項(xiàng)目。 本文是關(guān)注微信小程序的開發(fā)和面試問題,由基礎(chǔ)到困難循序漸進(jìn),適合面試和開發(fā)小程序。并總結(jié)vue React html css js 經(jīng)典面試題 集各種算法和插件、前端視頻源碼資源于一身的文檔,優(yōu)化項(xiàng)目,在瀏覽器端的層面上提升速度,幫助初中級(jí)前端工程師快...

    muzhuyu 評(píng)論0 收藏0
  • 面試題總結(jié)(js、html、小程序、React、ES6、Vue、算法、全棧熱門視頻資源)

    摘要:并總結(jié)經(jīng)典面試題集各種算法和插件前端視頻源碼資源于一身的文檔,優(yōu)化項(xiàng)目,在瀏覽器端的層面上提升速度,幫助初中級(jí)前端工程師快速搭建項(xiàng)目。 本文是關(guān)注微信小程序的開發(fā)和面試問題,由基礎(chǔ)到困難循序漸進(jìn),適合面試和開發(fā)小程序。并總結(jié)vue React html css js 經(jīng)典面試題 集各種算法和插件、前端視頻源碼資源于一身的文檔,優(yōu)化項(xiàng)目,在瀏覽器端的層面上提升速度,幫助初中級(jí)前端工程師快...

    li21 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<