<span id="mktg5"></span>

<i id="mktg5"><meter id="mktg5"></meter></i>

        <label id="mktg5"><meter id="mktg5"></meter></label>
        最新文章專題視頻專題問答1問答10問答100問答1000問答2000關(guān)鍵字專題1關(guān)鍵字專題50關(guān)鍵字專題500關(guān)鍵字專題1500TAG最新視頻文章推薦1 推薦3 推薦5 推薦7 推薦9 推薦11 推薦13 推薦15 推薦17 推薦19 推薦21 推薦23 推薦25 推薦27 推薦29 推薦31 推薦33 推薦35 推薦37視頻文章20視頻文章30視頻文章40視頻文章50視頻文章60 視頻文章70視頻文章80視頻文章90視頻文章100視頻文章120視頻文章140 視頻2關(guān)鍵字專題關(guān)鍵字專題tag2tag3文章專題文章專題2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章專題3
        問答文章1 問答文章501 問答文章1001 問答文章1501 問答文章2001 問答文章2501 問答文章3001 問答文章3501 問答文章4001 問答文章4501 問答文章5001 問答文章5501 問答文章6001 問答文章6501 問答文章7001 問答文章7501 問答文章8001 問答文章8501 問答文章9001 問答文章9501
        當(dāng)前位置: 首頁 - 科技 - 知識(shí)百科 - 正文

        ES6 Generator函數(shù)的應(yīng)用實(shí)例分析

        來源:懂視網(wǎng) 責(zé)編:小采 時(shí)間:2020-11-27 21:54:31
        文檔

        ES6 Generator函數(shù)的應(yīng)用實(shí)例分析

        ES6 Generator函數(shù)的應(yīng)用實(shí)例分析:本文實(shí)例講述了ES6 Generator函數(shù)的應(yīng)用。分享給大家供大家參考,具體如下: Generator 函數(shù)是 一種異步編程解決方案,Generator 函數(shù)會(huì)返回一個(gè)遍歷器對(duì)象,Generator 函數(shù)是一個(gè)普通函數(shù),但是有兩個(gè)特征。一是,function關(guān)鍵字與函數(shù)名之間有一個(gè)
        推薦度:
        導(dǎo)讀ES6 Generator函數(shù)的應(yīng)用實(shí)例分析:本文實(shí)例講述了ES6 Generator函數(shù)的應(yīng)用。分享給大家供大家參考,具體如下: Generator 函數(shù)是 一種異步編程解決方案,Generator 函數(shù)會(huì)返回一個(gè)遍歷器對(duì)象,Generator 函數(shù)是一個(gè)普通函數(shù),但是有兩個(gè)特征。一是,function關(guān)鍵字與函數(shù)名之間有一個(gè)

        認(rèn)識(shí)generator函數(shù)

        function * fn() {
         console.log('hello');
         return 'Joh';
        }
        // 執(zhí)行fn()時(shí)不會(huì)直接執(zhí)行方法體中的代碼,它會(huì)返回一個(gè)指針, 這個(gè)指針實(shí)現(xiàn)了 interator接口,也就是返回一個(gè)interator對(duì)象
        let it = fn();
        // 通過調(diào)用next就會(huì)執(zhí)行方法體, 返回結(jié)果是 {value:'Joh', done:true}, 其中next返回的是函數(shù)體中return的值
        let res = it.next();
        console.log(res);
        
        

        generator函數(shù)中的yield 與 return

        function * fn() {
         // 和yield相配合,把一個(gè)generator內(nèi)部分為幾個(gè)斷點(diǎn)來執(zhí)行,每個(gè)斷點(diǎn)就是yield語句
         // 注意 yield和return的區(qū)別: yield可以有多個(gè),return只能有1個(gè)
         yield 1;
         yield 2;
         yield 3;
         return 4; // 可以沒有return值,done為true的value將會(huì)是undefined
        }
        let it = fn();
        // 在for-of 循環(huán)中只能打印done為false的value值,done為true時(shí),程序終止
        for(let v of it) {
         console.log(v); // 分別
        輸出 1 2 3 }

        yield 的值與賦值語句

        function * fn(_name) {
         let name = yield _name; // yield 的默認(rèn)值為undefined
         return name;
        }
        let it = fn('Joh');
        console.log(it.next()); // {value:'Joh', done:false}
        console.log(it.next('Tom')); // {value:'Tom', done:true} // 此處value應(yīng)該為undefined,但是通過next參數(shù)的形式賦值改變了最后一個(gè)值
        console.log(it.next('Lily')); // {value: undefined, done:true} // 已經(jīng)循環(huán)完畢,即使傳值也是undefined
        
        

        yield 語句的位置與括號(hào)

        function sum(a, b) {
         return a + b;
        }
        function * fn() {
         let res = sum(yield 1, 5 + (yield 3));
         console.log(res);
         console.log('my qq: ' + (yield qq)); // yield 在一個(gè)語句中需要括起來
        }
        fn();
        
        

        yield 異常捕獲

        異常捕獲的方式1:

        function * fn() {
         let qq = yield; // yield 默認(rèn)返回undefined, 不會(huì)拋出異常
         console.log(qq);
        }
        let g = fn();
        g.next(); // 第一個(gè)斷點(diǎn)沒有
        輸出 // g.next('qq 11111'); // 完畢之后傳值輸出:qq 11111 g.throw('error!'); // Uncaught error!

        異常捕獲的方式2:

        function * fn() {
         let qq;
         try {
         qq = yield; // yield 默認(rèn)返回undefined
         }catch(e){
         console.log('qq have error');
         }finally{
         console.log(qq);
         }
        }
        let g = fn();
        g.next();
        g.throw('error!');
        // qq have error
        // undefined
        
        

        異常捕獲的方式3:

        function * fn() {
         let qq;
         qq = yield;
         console.log(qq);
        }
        let g = fn();
        g.next();
        try{
         g.throw('error!');
        }catch(e){
         console.log('qq have error!');
        }
        
        

        異常捕獲的方式4:

        function * fn() {
         let qq;
         try {
         qq = yield ff; // ff 未定義, 所以qq不會(huì)被正確賦值 此處是非 yield 的異常
         }catch(e){
         console.log('err1');
         }
         console.log(qq);
        }
        let g = fn();
        g.next();
        g.next('qq 5554');
        // err1
        // undefined
        
        

        利用generator和promise結(jié)合使用,讓異步的邏輯關(guān)系,使用同步的方式書寫

        function asyncF(name) {
         return new Promise(function(resolve){
         setTimeout(function(){
         resolve('my name is ' + name);
         });
         });
        }
        function * fn() {
         console.log(yield asyncF('Joh'));
        }
        let gf = fn();
        function exec(gf,value) {
         let res = gf.next(value);
         if(!res.done) {
         if(res.value instanceof Promise) {
         res.value.then(function (v) {
         exec(gf, v);
         })
         }else{
         exec(gf, res.value);
         }
         }
        }
        exec(gf); // my name is Joh
        
        

        更復(fù)雜的寫法:

        function asyncF(name) {
         return new Promise(function(resolve){
         setTimeout(function(){
         resolve('my name is ' + name);
         });
         });
        }
        function sum(a, b) {
         return new Promise(function (resolve) {
         setTimeout(function () {
         resolve(a + b);
         });
         })
        }
        function * fn(name) {
         if((yield sum(3,5)) > 6) {
         console.log(yield asyncF(name));
         }else{
         console.log('error');
         }
        }
        let gf = fn('Joh');
        // generator 執(zhí)行器 相當(dāng)于 tj/co 模塊
        function exec(gf,value) {
         let res = gf.next(value);
         if(!res.done) {
         if(res.value instanceof Promise) {
         res.value.then(function (v) {
         exec(gf, v);
         })
         }else{
         exec(gf, res.value);
         }
         }
        }
        exec(gf); // my name is Joh
        
        

        使用純promise實(shí)現(xiàn):

        function asyncF(name) {
         return new Promise(function(resolve){
         setTimeout(function(){
         resolve('my name is ' + name);
         });
         });
        }
        function sum(a, b) {
         return new Promise(function (resolve) {
         setTimeout(function () {
         resolve(a + b);
         });
         })
        }
        function fn(name) {
         sum(3,5)
         .then(function (num) {
         if(num > 6) {
         asyncF(name)
         .then(function (v) {
         console.log(v);
         })
         }else{
         console.log('error');
         }
         })
        }
        fn('Joh');
        
        

        使用co模塊,來代替自己寫的執(zhí)行器

        var co = require('co');
        function asyncF(name) {
         return new Promise(function(resolve){
         setTimeout(function(){
         resolve('my name is ' + name);
         });
         });
        }
        function sum(a, b) {
         return new Promise(function (resolve) {
         setTimeout(function () {
         resolve(a + b);
         });
         })
        }
        function * fn(name) {
         if((yield sum(3,5)) > 6) {
         console.log(yield asyncF(name));
         }else{
         console.log('error');
         }
        }
        var fnx = co.wrap(fn);
        fnx('Joh'); // my name is Joh
        
        
        

        更多關(guān)于JavaScript相關(guān)內(nèi)容可查看本站專題:《javascript面向?qū)ο笕腴T教程》、《JavaScript切換特效與技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》

        希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。

        聲明:本網(wǎng)頁內(nèi)容旨在傳播知識(shí),若有侵權(quán)等問題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系,我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

        文檔

        ES6 Generator函數(shù)的應(yīng)用實(shí)例分析

        ES6 Generator函數(shù)的應(yīng)用實(shí)例分析:本文實(shí)例講述了ES6 Generator函數(shù)的應(yīng)用。分享給大家供大家參考,具體如下: Generator 函數(shù)是 一種異步編程解決方案,Generator 函數(shù)會(huì)返回一個(gè)遍歷器對(duì)象,Generator 函數(shù)是一個(gè)普通函數(shù),但是有兩個(gè)特征。一是,function關(guān)鍵字與函數(shù)名之間有一個(gè)
        推薦度:
        標(biāo)簽: 應(yīng)用 生成器 案例
        • 熱門焦點(diǎn)

        最新推薦

        猜你喜歡

        熱門推薦

        專題
        Top
        主站蜘蛛池模板: 亚洲av永久无码精品国产精品| 亚洲最大av无码网址| 亚洲国产精品午夜电影| 免费无码毛片一区二区APP| 久久精品国产亚洲77777| 最近中文字幕免费完整| 亚洲精品美女视频| 噼里啪啦电影在线观看免费高清| 亚洲精品无码专区| 免费又黄又硬又爽大片| 一级中文字幕乱码免费| 亚洲成AV人在线播放无码 | 亚洲AV日韩AV天堂久久| 在线美女免费观看网站h| 亚洲日韩乱码中文无码蜜桃臀 | 中国国语毛片免费观看视频| 亚洲人成影院在线无码按摩店| 久久精品一本到99热免费| 亚洲中文字幕久久久一区| jjzz亚洲亚洲女人| 两性色午夜免费视频| 亚洲高清中文字幕综合网| 午夜视频免费成人| 成人无码视频97免费| 亚洲毛片基地日韩毛片基地| 手机看片久久国产免费| 成全高清在线观看免费| 中文字幕免费播放| 久久久久亚洲AV成人无码| 久久精品无码一区二区三区免费| 精品韩国亚洲av无码不卡区| 亚洲精品成人片在线观看精品字幕| 在线免费观看亚洲| 国产成人亚洲综合a∨| 久久精品夜色国产亚洲av| 在线观看人成视频免费| 国内精品免费视频精选在线观看| 亚洲国产综合人成综合网站00| 免费人成视频在线观看不卡| 最好看最新的中文字幕免费 | 亚洲日韩久久综合中文字幕|