Iterator、for..of，for...in和自定義遍歷器

pcChao 發(fā)布于2019-08-20 18:07 / 2104人閱讀

摘要：，和自定義遍歷器依次打印注釋就是一個指針指針默認在的位置沒有遍歷完的時候的值是遍歷完了就是意義提高具有遍歷接口數據的效率特點它用來訪問具有遍歷接口數據有一個方法指針，普通數組遍歷輸出。

Iterator、for..of，for...in和自定義遍歷器

Iterator：

var arr = [1,2,3,4,5];
    var ite = arr[Symbol.iterator]();
    console.log(ite.next());
    console.log(ite.next());
    console.log(ite.next());
    console.log(ite.next());
    console.log(ite.next());
    console.log(ite.next());
    //依次打?。篛bject {value: 1, done: false}；
               Object {value: 2, done: false};
           Object {value: 3, done: false};
           Object {value: 4, done: false};
           Object {value: 5, done: false};
           Object {value: undefined, done: true}.
注釋:1.Iterator就是一個指針;
     2.指針默認在-1的位置;
     3.沒有遍歷完的時候done的值是false,遍歷完了就是true;
     4.意義:提高具有遍歷接口數據的效率;
     5.特點:它用來訪問具有遍歷接口數據,有一個next方法(指針).

for..of，for...in：

普通數組遍歷：

let arr = [1,2,3,4,5];
    for(let item of arr){
        console.log(item);
    }
    //輸出：1 2 3 4 5。

迭代器遍歷：

let iterator = arr[Symbol.iterator]();
    let result = iterator.next();
    while(!result.done){
        console.log(result.value);
        result=iterator.next();
    }
    //輸出 1 2 3 4 5。

數組 Set Map

var s = new Set([1,2,3]);
    console.log(s);//打印：Set(3) {1, 2, 3}；
    var itera = s[Symbol.iterator]();
    console.log(itera.next());//打?。篛bject {value: 1, done: false}；
        
    var m = new Map([["age",21],["sex","男"]]);
    m.set("name","宋澤");
    console.log(m);//打?。篗ap(3) {"age" => 21, "sex" => "男", "name" => "宋澤"}；
    var i = m[Symbol.iterator]();
    console.log(i.next());//打?。篛bject {value: Array(2), done: false}；
                
    let obj = {x:1,y:2,z:3};
    let arr = ["a","b","c"];
    for(let key in obj){
        console.log(key);//打?。簒 y z；
        console.log(obj[key]);//打?。簒 1 y 1 z 1；
    }
    for(let key in arr){
        console.log(key);//打?。簒 y z；
        console.log(arr[key]);//打?。簒 1 y 1 z 1；
    }
注釋:1.遍歷對象用forin,遍歷數組,Map,Set,類數組用for of。
     2.for in可以遍歷對象,也可以遍歷數組.

自定義遍歷器：

var arr = [1,2,3,4,5];
    function Iterator(arr){
        let i = -1;  //遍歷器默認指在-1的位置；
        function next(){  //返回一個方法；
            i++;  //當next的時候，i向后移；
            let value;  //聲明一個空的變量；
            let done = flase; //done的默認值是沒有遍歷完成；
            if(i == arr.length){  //如果i等于數組的長度的時候，i就溢出了，所以value的值是undefined，done的值是true；
                value = undefined;
                done = true;
            }else{  //否則value的值就等于數組中的值；
                value=arr[i];
            }
            return {value:value,done:done}; //返回兩個值，一個值是value，另一個值是done；
        }
        return {next:next};  //返回next方法；
    }
            
    var ite = arr[Symbol.iterator]();
    console.log(ite.next());
    console.log(ite.next());
    console.log(ite.next());
    console.log(ite.next());
    console.log(ite.next());
    console.log(ite.next());
    依次打印：Object {value: 1, done: false}；
         Object {value: 2, done: false};
         Object {value: 3, done: false};
         Object {value: 4, done: false};
         Object {value: 5, done: false};
         Object {value: undefined, done: true}.

GPU云服務器云服務器 for...of Iterator Iterator模式云服務和自建服務器

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

轉載請注明本文地址：http://m.hztianpu.com/yun/84104.html

ECMAScript6(14)：iterator 迭代器

摘要：由于中引入了許多數據結構算上原有的包括等等數組需要一個東西來管理他們這就是遍歷器。數組默認遍歷器遍歷值相當于依次輸出依次輸出依次輸出依次輸出不難看出默認得到值而只能得到索引。即遍歷器的本質就是一個指針。由于 ES6 中引入了許多數據結構, 算上原有的包括Object, Array, TypedArray, DataView, buffer, Map, WeakMap, Set, We...

toddmark 2019-08-23 11:46 評論0 收藏0
ES6語法之可迭代協議和迭代器協議

摘要：有兩個協議可迭代協議和迭代器協議。為了變成可迭代對象，一個對象必須實現或者它原型鏈的某個對象必須有一個名字是的屬性迭代器協議該迭代器協議定義了一種標準的方式來產生一個有限或無限序列的值。 ECMAScript 2015的幾個補充，并不是新的內置或語法，而是協議。這些協議可以被任何遵循某些約定的對象來實現。有兩個協議：可迭代協議和迭代器協議。可迭代協議可迭代協議允許 JavaScri...

sarva 2019-08-22 11:23 評論0 收藏0
JavaScript 設計模式（五）：迭代器模式

摘要：文章內容分兩部分前半部分為迭代器模式概念后半部分為中迭代器上半部分開始迭代器模式提供一種方法順序訪問一個聚合對象中的各個元素，而又不需要暴露該對象的內部表示。下半部分開始的迭代器迭代器等同于遍歷器。執(zhí)行該函數，會返回一個遍歷器對象。 showImg(https://segmentfault.com/img/bVbuyaZ?w=800&h=600); 文章內容分兩部分：前半部分為迭...

zhou_you 2019-08-23 18:26 評論0 收藏0
從forEach到迭代器

摘要：本文從使用對數組進行遍歷開始說起，粗略對比使用進行遍歷的差異，并由此引入中可迭代對象迭代器的概念，并對其進行粗略介紹。說到這里，就繼續(xù)說一下迭代器關閉的情況了。確實，符合可迭代協議和迭代器協議的。本文從使用 forEach 對數組進行遍歷開始說起，粗略對比使用 forEach , for...in , for...of 進行遍歷的差異，并由此引入 ES6 中可迭代對象/迭代器的概...

rockswang 2019-08-23 12:36 評論0 收藏0
[前端漫談_1] 從 for of 聊到 Generator

摘要：數據的層級意味著迭代數據結構并提取它的數據。對于技術人而言技是單兵作戰(zhàn)能力，術則是運用能力的方法。在前端娛樂圈，我想成為一名出色的人民藝術家。聊聊 for of 說起 for of 相信每個寫過 JavaScript 的人都用過 for of ，平時我們用它做什么呢？大多數情況應該就是遍歷數組了，當然，更多時候，我們也會用 map() 或者 filer() 來遍歷一個數組。但是就...

miqt 2019-08-23 17:54 評論0 收藏0