举个简单的例子:

const strArr = ["red", "green", "blue", "black"];

const strGen = function*() {
    for(let str of strArr) {
        yield str;
    }
};

let gen = strGen();

for (let i = 0; i < 5; i++) {
    console.log(gen.next())
}

//prints: {value: "red", done: false} -> 5 times with different colors, if you try it again as below:

console.log(gen.next());

//prints: {value: undefined, done: true}

简化/详细阐述Nick Sotiros的答案(我认为非常棒)，我认为最好描述一个人如何开始使用yield编码。

在我看来，使用yield的最大优点是它将消除我们在代码中看到的所有嵌套回调问题。一开始很难理解，这就是为什么我决定写下这个答案(为了我自己，也希望其他人!)

它的方法是通过引入协程的思想，这是一个可以自动停止/暂停的函数，直到它得到它需要的东西。在javascript中，用函数*表示。只有函数*函数可以使用yield。

下面是一些典型的javascript代码:

loadFromDB('query', function (err, result) {
  // Do something with the result or handle the error
})

这很笨拙，因为现在所有的代码(显然需要等待loadFromDB调用)都需要在这个丑陋的回调中。这很糟糕，有几个原因……

所有代码都缩进了一层 你有这一端})，你需要随时跟踪 所有这些额外的功能(错误，结果)术语 不太清楚你这样做是为了给result赋值

另一方面，使用yield，所有这些都可以在良好的协同例程框架的帮助下在一行中完成。

function* main() {
  var result = yield loadFromDB('query')
}

所以现在你的主函数会在必要的时候让步当它需要等待变量和东西加载时。但是现在，为了运行这个，你需要调用一个普通的(非协程函数)。一个简单的协程框架可以解决这个问题，所以你所要做的就是运行这个:

start(main())

开始是有定义的(来自Nick Sotiro的回答)

function start(routine, data) {
    result = routine.next(data);
    if(!result.done) {
        result.value(function(err, data) {
            if(err) routine.throw(err); // continue next iteration of routine with an exception
            else start(routine, data);  // continue next iteration of routine normally
        });
    }
}

现在，你可以拥有可读性更强、易于删除的漂亮代码，而且不需要修改缩进、函数等。

一个有趣的观察是，在这个例子中，yield实际上只是一个关键字，可以放在带有回调的函数之前。

function* main() {
  console.log(yield function(cb) { cb(null, "Hello World") })
}

将打印“Hello World”。因此，你可以通过简单地创建相同的函数签名(不带cb)并返回函数(cb){}来将任何回调函数转换为使用yield，如下所示:

function yieldAsyncFunc(arg1, arg2) {
  return function (cb) {
    realAsyncFunc(arg1, arg2, cb)
  }
}

希望有了这些知识，您可以编写更清晰、更易读且易于删除的代码!

它用于迭代器生成器。基本上，它允许您使用过程代码制作(可能是无限的)序列。请参阅Mozilla的文档。

举个简单的例子:

const strArr = ["red", "green", "blue", "black"];

const strGen = function*() {
    for(let str of strArr) {
        yield str;
    }
};

let gen = strGen();

for (let i = 0; i < 5; i++) {
    console.log(gen.next())
}

//prints: {value: "red", done: false} -> 5 times with different colors, if you try it again as below:

console.log(gen.next());

//prints: {value: undefined, done: true}

Yield关键字在javaScript函数使它生成器，

什么是JavaScript生成器?

生成器是产生一系列结果而不是单个值的函数，即您生成一系列值

这意味着生成器可以帮助我们与帮助迭代器异步工作，哦，hack迭代器是什么?真的吗?

迭代器意味着我们可以一次访问一个项

从哪里迭代器可以帮助我们一次访问第一项? 它帮助我们通过生成器函数访问项目，生成器函数中我们使用yield关键字，yield关键字帮助我们暂停和恢复函数的执行。

这里有一个简单的例子:

function *getMeDrink() {

    let question1 = yield 'soda or beer'; // execution will pause here because of yield
       
    if (question1 == 'soda') {
        return 'here you get your soda';
    }

    if (question1 == 'beer') {

        let question2 = yield 'What\'s your age'; // execution will pause here because of yield

        if (question2 > 18) {
            return "ok you are eligible for it";
        } else {
            return "Shhhh!!!!";
        }
    }
}

let _getMeDrink = getMeDrink(); // initialize it

_getMeDrink.next().value; // "soda or beer"

_getMeDrink.next('beer').value; // "What's your age"

_getMeDrink.next('20').value; // "ok you are eligible for it"

_getMeDrink.next().value; // undefined

让我简单地解释一下发生了什么

你注意到在每个yield关键字处执行被暂停，我们可以通过迭代器.next()访问第一个yield

它一次迭代到所有yield关键字，然后当没有更多的yield关键字时返回undefined，简单地说，你可以说yield关键字是断点，函数每次暂停，只有在使用迭代器调用它时才恢复，对于我们的例子:_getMeDrink.next()这是一个迭代器的例子，它帮助我们访问函数中的每个断点。

生成器示例: 异步/等待

如果你看到async/await的实现，你会看到生成器函数和承诺被用来使async/await工作，请指出任何建议，欢迎。

在我看来，MDN文档非常好。

The function containing the yield keyword is a generator. When you call it, its formal parameters are bound to actual arguments, but its body isn't actually evaluated. Instead, a generator-iterator is returned. Each call to the generator-iterator's next() method performs another pass through the iterative algorithm. Each step's value is the value specified by the yield keyword. Think of yield as the generator-iterator version of return, indicating the boundary between each iteration of the algorithm. Each time you call next(), the generator code resumes from the statement following the yield.