JavaScript生成器使用for..of循环为何无法触发return语句？

这本质是迭代器协议和for...of循环的行为规则决定的：

• 生成器对象本质是一个迭代器，每次调用next()会返回一个包含done和value的对象：

  • 执行到yield语句时，返回{done: false, value: yield的内容}，生成器处于暂停状态；
  • 执行到return语句（或函数自然结束）时，返回{done: true, value: return的内容}，生成器进入完成状态。

• for...of循环的遍历逻辑很明确：它只会处理done为false时的value，一旦拿到done: true的迭代结果，就会立即终止循环，不会读取这个结果里的value。

回到你的代码：

function* generator(){
    yield 1
    yield 2
    yield 3
    return "hello there"
}

• 调用generator()得到生成器对象，前三次调用next()，分别返回{done: false, value:1}、{done: false, value:2}、{done: false, value:3}，这三个值会被for...of循环依次取出打印；
• 第四次调用next()时，生成器执行到return语句，返回{done: true, value: "hello there"}，此时for...of循环检测到done为true，直接终止，不会处理这个value。

而手动调用next()时，你可以主动获取每一次的返回结果，包括最后done: true时的value，所以能拿到return的内容。

另外补充一点：如果想让return的值也被for...of遍历到，可以把return改成yield，但这样生成器会多一次暂停，第四次next()才会返回done:true（此时value是undefined），这和return的语义不同——return是直接结束生成器，yield只是暂停。

内容的提问来源于stack exchange，提问作者Wesley Appleget