【发布时间】：2015-10-21 23:21:57
【问题描述】：
我正在尝试使用生成器。当我尝试这段代码时，我遇到了意想不到的错误：
Uncaught TypeError: Method [Generator].prototype.next 在不兼容的接收器上调用# 或者 TypeError: 在不兼容的 HTMLButtonElement 上调用 CallStarGeneratorMethodIfWrapped 方法
我的问题，它不起作用吗？这些错误消息背后的含义是什么？最重要的是；为什么 first().next 不作为普通函数处理？为什么 addEventListener 关心 first().next 函数的起源。在控制台中键入 first().next。它说功能。下面注释了一个与下一个类似的函数，但它总是产生相同的结果。
您可以尝试重现的代码：
<html>
<button id="test">Click</button>
<script>
var first = function* (){
console.log("first click");
yield true;
console.log("second click");
yield true;
};
document.getElementById("test").addEventListener('click', first().next);
/*var wouldwork = function (){
console.log("would work");
return { value: true, done: false };
// same as the next returns
};*/
/*document.getElementById("test").addEventListener('click', wouldwork);*/
</script>
</html>
另一种选择是将带有正确上下文的 next 放在另一个函数中。为此，我们将迭代器存储在一个变量中。
var iterator = first();
document.getElementById("test").addEventListener('click',
function (event){return iterator.next();}
//context of next is always the correct one
);
如果这种情况更频繁地发生，最好创建一个名为 createNext 的新函数，它以更纯粹的函数风格返回下一个函数
var createNext = function (generatorFunction){
var iterator = generatorFunction();
return function() {
return iterator.next();
};
};
document.getElementById("test").addEventListener('click',
createNext(first)
);
【问题讨论】：
-
可能是因为
this关键字在两个函数内部都有使用，但是在事件监听函数（按钮元素）和生成器的next函数（生成器本身，也许）。 -
() => first().next() -
确实与
this有关系，因为var f = first(); ...addEventListener('click', f.next.bind(f));有效。 -
@zerkms：你不想再打电话给
first()
标签： javascript dom generator