成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

初入ES6-Generator和Iterator

waltr / 1422人閱讀

摘要：根據(jù)百度百科的說法迭代器模式，又叫做游標(biāo)模式。給出的定義為提供一種方法訪問一個容器對象中各個元素，而又不需暴露該對象的內(nèi)部細(xì)節(jié)。從定義可見，迭代器模式是為容器而生。很明顯，對容器對象的訪問必然涉及到遍歷算法。這兩種情況好像都能夠解決問題。

Iterator
根據(jù)百度百科的說法:

迭代器（Iterator）模式，又叫做游標(biāo)（Cursor）模式。GOF給出的定義為：提供一種方法訪問一個容器（container）對象中各個元素，而又不需暴露該對象的內(nèi)部細(xì)節(jié)。 從定義可見，迭代器模式是為容器而生。很明顯，對容器對象的訪問必然涉及到遍歷算法。你可以一股腦的將遍歷方法塞到容器對象中去；或者根本不去提供什么遍歷算法，讓使用容器的人自己去實現(xiàn)去吧。這兩種情況好像都能夠解決問題。

類似之前的鏈表結(jié)構(gòu)，每個對象不僅包含自身的值，也包含下一個變量的指針；

function Chan(value){
    this.value = value;
    this.next = null;
};
var newObj = new Chan();        //對象都有兩個屬性

創(chuàng)建迭代器

function creatIterator(items){
    var i = 0;
    var next = function(){
        var done =( i>=items.length);            //判斷itmes的數(shù)量是否是最后一個，如果是done = true;那么value = undefined;
        var value = !done?items[i++]:undefined;            //
        return {
            value : value,
            done : done
        };
    }
    return {next : next};
};
var iterator = new creatIterator([3,3,2,6,7]);
iterator.next()  ->{value : 3,done:false;}
iterator.next()  ->{value : 3,done:false;}
iterator.next()  ->{value : 2,done:false;}
iterator.next()  ->{value : 6,done:false;}
iterator.next()  ->{value : 7,done:false;}
iterator.next()  ->{value :undefined,done:true;}        //后面執(zhí)行的都是一樣
//或者省略最后一步；
function creatIterator(items){
    var i = 0;
    return {
        next : function(){
            return i

所以可以這樣理解，Iterator就是一個特殊的對象，這個對象可以訪問一個容器對象（包含很多無序的變量屬性等），每次調(diào)用next就返回一個對象，直到最后一個，有些方法調(diào)用是自動連續(xù)的調(diào)用，見生成器函數(shù)只要有這個接口就可以將返回的對象用擴(kuò)展運算符...轉(zhuǎn)換為數(shù)組并且可以使用數(shù)組的方法
有三種數(shù)據(jù)結(jié)構(gòu)具有原生的Iterator接口,可以直接用for..of 遍歷，這三種數(shù)結(jié)構(gòu)內(nèi)置了三個迭代器
entries()返回數(shù)組,keys(),values();針對不同的數(shù)據(jù)結(jié)構(gòu)，都有默認(rèn)的迭代器，注意不同的瀏覽器支持的成都不一樣；
1,Array

2,Map    


3,Set

一些類數(shù)組的對象（有數(shù)字屬性，和length的屬性）也具有Iterator 的接口。比如字符串對象


Iterator應(yīng)用場合
1，解構(gòu)賦值


var  arr = [1,2,3,4,5];
var arr1 = [...arr];
console.dir(arr1)    //[1, 2, 3, 4, 5]



2,擴(kuò)展運算符，同上；
3，特殊場合


//for...of;如果數(shù)組有非數(shù)字鍵名的話不可遍歷，arr.name = "obama"
var  arr = [1,2,3,4,"a","b"];
var obj = {name : "obama",1 : 2}
for( pro in arr){console.log(pro)}    //0,,,,5只是得到鍵名；
for( pro in obj){console.log(pro)}  //得到所有的屬性名
for( pro of o arr){console.log(pro)}  //輸出所有的屬性
for( pro of obj){console.log(pro)}      //報錯，對象不可遍歷
//Array...from;
//Map(),Set()參數(shù)對象
//Promise.all(),race()



Generator生成器函數(shù)；
有三個屬性next,throw,return ;


function *fnName(){    //函數(shù)名字前必須有星號；

    yield "first";    //每次執(zhí)行后都從下一個yield關(guān)鍵字開始，直到最后的return;
    yield "second";    //yield 只能用在生成器函數(shù)內(nèi)部，其他 的會報錯
    return "all done";
}
var ob = fnName()        //和普通函數(shù)一樣的調(diào)用
ob.next()    //
ob.next()    //
ob.next()    //每次調(diào)用都返回一個對象
//每個生成器函數(shù)都有Iterator方法并且返回自身
ob[Symbol.iteraro]() === ob;



//1,next()的方法；
//yied和return 一樣沒有返回值，或者是undefined;
function *fn(){
    var num  = yield 4;
    console.log(num);
    
}
var s = fn();
s.next();    //{value: 4, done: false}
s.next()    //undefined;{value: undefined, done: true};
//next()的參數(shù)，可以明確的設(shè)定上一次yield的返回值(如果已經(jīng)是最后的話，就沒有作用)
s.next(23);    //value : 23,

//生成器函數(shù)的遍歷for of ... 解構(gòu)賦值，Array.from都會自動遍歷，不需要調(diào)用next方法
function *test(){
    yield 1;
    yield 2;
    yield 3;
    yield 4;
    return 5;
}
var te = test();
for( v of te){console.log(v)}    //1,2,3,4
te.next();//{value: undefined, done: true}已經(jīng)循環(huán)完畢
//2,throw方法
//3,return 方法    //直接終止遍歷
function *test(){
    yield 1;
    yield 2;
    yield 3;
    yield 4;
    return 5;
};
var s = test();
s.next();//value:1,done:false;
s.turn ();value:undefined,done:ture;    //
s.next();//value:1,done:false;
 //yield*語句
function *boo(){
    yield 1;
    yield 2;
}  ;
function *bar(){
    yield 3;
    yield boo();
} 
var s = bar();
s.next();//{value: 3, done: false}
s.next();//{value: boo, done: false}沒有執(zhí)行
//使用yield *boo();表明返回的是一個遍歷器對象，可以是數(shù)組等其他對象

//{value: 1, done: false}

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

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/88835.html

相關(guān)文章

  • ES6-Generator與react狀態(tài)機（13）

    摘要：同理，你只要知道改變狀態(tài)能夠?qū)崿F(xiàn)要的功能，大體上的原理就是狀態(tài)機就可以了?？偨Y(jié)，本文重點狀態(tài)機模式的使用場景，復(fù)雜多狀態(tài)的管理，這里注意你沒必要寫個選項卡之類的用狀態(tài)機，那反而是給自己找麻煩。 大家在寫App和一些單頁面程序的時候，經(jīng)常會遇到這樣的情況：showImg(https://segmentfault.com/img/bVbsNaA?w=240&h=427);當(dāng)點擊左邊的箭頭的...

    alphahans 評論0 收藏0

  • 初入ES6-Array

    摘要：用于將對象轉(zhuǎn)為數(shù)組可遍歷和類數(shù)組對象部署屬性的對象和擴(kuò)展運算符的區(qū)別是任何具有屬性的都可以使用的方法是用原型該方法還有一個參數(shù)類似的新方法將字符串轉(zhuǎn)化為數(shù)組，特別是大于的單個字符，避免分割成多個用來彌補構(gòu)造函數(shù)的歧義三個空值只有一個參數(shù)其實 1,Array.from用于將對象轉(zhuǎn)為數(shù)組（可遍歷和類數(shù)組對象部署Iterator 屬性的對象）和擴(kuò)展運算符的區(qū)別是任何具有Length屬性的都可...

    馬永翠 評論0 收藏0

  • 初入ES6-解構(gòu)

    摘要：允許按照一定的模式，從數(shù)組或者對象中取值，對變量進(jìn)行賦值數(shù)組解構(gòu)的對象要具有接口也就是可以遍歷按照對應(yīng)的關(guān)系進(jìn)行取值如果解構(gòu)不成功變量的值就是如果右側(cè)的數(shù)值不是數(shù)組，就會報錯注意字符串是可以遍歷的也可以有默認(rèn)值只要被賦值的變量不是嚴(yán)格就是默 ES6允許按照一定的模式，從數(shù)組或者對象中取值，對變量進(jìn)行賦值 數(shù)組 var a = 2; var b = [1,2]; var c = this...

    FullStackDeveloper 評論0 收藏0

  • HTML & CSS之小白初入江湖

    摘要：之小白初入江湖超文本標(biāo)記語言簡稱是一種用于創(chuàng)建網(wǎng)頁的標(biāo)準(zhǔn)標(biāo)記語言。描述了一個網(wǎng)站的結(jié)構(gòu)語義隨著線索的呈現(xiàn)，使之成為一種標(biāo)記語言而非編程語言。是塊級元素，是行內(nèi)元素。層疊樣式表簡稱是一種用來為結(jié)構(gòu)化文檔如添加樣式的工具。 HTML & CSS之小白初入江湖 1. HTML 超文本標(biāo)記語言(HyperText Markup Language, 簡稱HTML)是一種用于創(chuàng)建網(wǎng)頁的標(biāo)準(zhǔn)標(biāo)記語言...

    fai1017 評論0 收藏0

  • HTML & CSS之小白初入江湖

    摘要：之小白初入江湖超文本標(biāo)記語言簡稱是一種用于創(chuàng)建網(wǎng)頁的標(biāo)準(zhǔn)標(biāo)記語言。描述了一個網(wǎng)站的結(jié)構(gòu)語義隨著線索的呈現(xiàn)，使之成為一種標(biāo)記語言而非編程語言。是塊級元素，是行內(nèi)元素。層疊樣式表簡稱是一種用來為結(jié)構(gòu)化文檔如添加樣式的工具。 HTML & CSS之小白初入江湖 1. HTML 超文本標(biāo)記語言(HyperText Markup Language, 簡稱HTML)是一種用于創(chuàng)建網(wǎng)頁的標(biāo)準(zhǔn)標(biāo)記語言...

    crossoverJie 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<