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

資訊專欄INFORMATION COLUMN

ES6---對yield和yield*的理解

sourcenode / 2839人閱讀

摘要：概念和都是配合進行使用的。雖然有些混亂，但是如果打斷點來看的話會更加清晰。是表達式，因此又返回值，其語法如下是可遍歷對象，可以是數(shù)組，也可以是另外一個函數(shù)的執(zhí)行表達式，等等其實說簡單點，就是將多個語句根據(jù)某種規(guī)則合并為一個，示例如下

概念

yield和yield*都是配合Generator進行使用的。

yield

yield是關(guān)鍵字，其語法如下：

[rv] = yield [expression];

expression：是Generator函數(shù)返回的遍歷器對象調(diào)用next方法是所得到的值；

rv：是遍歷其對象調(diào)用next方法是傳遞給next方法的參數(shù)

這里要簡單的說一下next方法，其語法如下：

gen.next(value)

value：傳遞給Generator函數(shù)的值，也就是上文中的rv

這里比較有意思的就是傳遞給next方法的值value，下面通過例子來看一下：

function* _testYieldExpression(){
    let value = "";
    value = yield "yield value";
    console.info(`1 value is: ${value}`);//輸出1

    value = yield "yield value";
    console.info(`2 value is: ${value}`);//輸出2
    return "over";
}

let _testIterator = _testYieldExpression();
let _res = _testIterator.next();
console.info(`1:no params to next, result is: ${_res.value}`);//輸出3

_res = _testIterator.next("params from next");
console.info(`2:params to next, result is: ${_res.value}`);//輸出4

_res = _testIterator.next();
console.info(`3:params to next, result is: ${_res.value}`);//輸出    512345678910111213141516171819

輸出如下：

1:no params to next, result is: yield value
1 value is: params from next
2:params to next, result is: yield value
2 value is: undefined
3:params to next, result is: over12345

注釋中標(biāo)記了幾個輸出語句，

輸出1

是在第二次調(diào)用next方法是執(zhí)行，可以看到，此時的value值是傳遞給next方法的參數(shù)，但是在_testYieldExpression函數(shù)中可以看到value = yield yield value，所以可以理解為，在第一次執(zhí)行next函數(shù)的時候，語句yield yield value沒有返回值，并且沒有賦值給value，而在第二次調(diào)用next時，才將next函數(shù)的參數(shù)賦值給value。雖然有些混亂，但是如果打斷點來看的話會更加清晰。

yield*

yield*是表達式，因此又返回值，其語法如下：

yield* [[expression]];

expression：是可遍歷對象，可以是數(shù)組，也可以是另外一個Generator函數(shù)的執(zhí)行表達式，等等

其實說簡單點，就是將多個yield語句根據(jù)某種規(guī)則合并為一個，示例如下：

function* g3() {
  yield* [1, 2];
  yield* "34";
  yield* Array.from(arguments);
}

var iterator = g3(5, 6);

console.log(iterator.next()); // {value: 1, done: false}
console.log(iterator.next()); // {value: 2, done: false}
console.log(iterator.next()); // {value: "3", done: false}
console.log(iterator.next()); // {value: "4", done: false}
console.log(iterator.next()); // {value: 5, done: false}
console.log(iterator.next()); // {value: 6, done: false}
console.log(iterator.next()); // {value: undefined, done: true}

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

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

相關(guān)文章

  • 深入理解 Generator 函數(shù)

    摘要：同時，迭代器有一個方法來向函數(shù)中暫停處拋出一個錯誤，該錯誤依然可以通過函數(shù)內(nèi)部的模塊進行捕獲處理。 本文翻譯自：Diving Deeper With ES6 Generators 由于個人能力有限，翻譯中難免有紕漏和錯誤，望不吝指正issue ES6 Generators:完整系列 The Basics Of ES6 Generators Diving Deeper With E...

    jzzlee 評論0 收藏0

  • ES6學(xué)習(xí)筆記之Generator函數(shù)

    摘要：調(diào)用函數(shù)后和普通函數(shù)不同的是，該函數(shù)并不立即執(zhí)行，也不返回函數(shù)執(zhí)行結(jié)果，而是返回一個指向內(nèi)部狀態(tài)的對象，也可以看作是一個遍歷器對象。第一個只是用來啟動函數(shù)內(nèi)部的遍歷器，傳參也沒有多大意義。 之前斷斷續(xù)續(xù)接觸到了一些ES6的知識，異步編程方面聽得比較多的就是Promise，直到最近比較系統(tǒng)地學(xué)習(xí)了ES6的新特性才發(fā)現(xiàn)Generator這個神奇的存在，它可以實現(xiàn)一些前所未有的事情，讓我頓時...

    cjie 評論0 收藏0

  • ES6 之 Iterator&Generator

    摘要：可迭代對象就具有屬性，它是一種與迭代器密切相關(guān)的對象。它通過指定的函數(shù)可以返回一個作用于附屬對象的迭代器。迭代器特點每次調(diào)用方法時，返回一個數(shù)組，數(shù)組中兩個元素，分別表示鍵和值。示例之輸出輸出輸出之迭代器特點返回集合中存在的每一個鍵。 Iterator由來 不推薦Iterator方法。 Iterator 函數(shù)是一個 SpiderMonkey 專有特性，并且會在某一時刻被刪除。有一點，需...

    xietao3 評論0 收藏0

  • 理解 es5 開始有的 yield 和 es6 開始有的 aysnc/await

    摘要：始最近的業(yè)余時間在看相關(guān)的書也在極客時間上買了前端相關(guān)的專欄對于一個非的人來說時時會有一種感覺社區(qū)是真的激進和浮燥這幫規(guī)則的制定者似乎從來也不知道克制為何物有很多時候固有的東西是可以處理好的但是偏偏喜歡人為制造一些概念和語法糖人為的建起一座 始 最近的業(yè)余時間在看 js 相關(guān)的書, 也在極客時間上買了前端相關(guān)的專欄, 對于一個非 jser 的人來說, 時時會有一種感覺: js 社區(qū)是真...

    NicolasHe 評論0 收藏0

  • 深入理解Generator

    摘要：如果你已經(jīng)理解基礎(chǔ)可以直接跳過這部分和語法部分，直接看深入理解的部分。的參數(shù)可以傳入一個參數(shù)，來作為上一次的表達式的返回值，就像我們上面說的會讓等于。 這篇文章旨在幫你真正了解Generator，文章較長，不過如果能花時間耐心看完，相信你已經(jīng)能夠完全理解generator 為什么要用generator 在前端開發(fā)過程中我們經(jīng)常需要先請求后端的數(shù)據(jù)，再用拿來的數(shù)據(jù)進行使用網(wǎng)頁頁面渲染等操...

    Euphoria 評論0 收藏0

發(fā)表評論

0條評論

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