JavaScript 模拟 yield 关键字的实现方案
作者:木棉时间:2026-10-27 16:38:49浏览:555
本文介绍在 JavaScript 中通过自定义 Iterator 类模拟 yield 关键字的方法。核心思路是利用 eval 将函数转换为字符串再解析,以解决 IE 浏览器对 function 表达式返回非函数对象的问题。通过保存协程状态和上下文,实现类似生成器的迭代行为,适用于需要手动控制执行流的场景。
IE 兼容性与背景说明
代码在 Firefox 中测试一次成功,随后进行了修改以兼容 Internet Explorer。主要原因是 IE 浏览器对 function 表达式的处理方式不同,导致无法直接识别函数对象。
Iterator 核心实现代码
具体实现代码如下:
var Iterator = function (fn) {
var coroutine = null;
var cofn_this = null;
var yield = function() {
coroutine.apply(cofn_this, arguments);
}
// 兼容 IE 浏览器的处理逻辑
// 注意:在 IE 中,eval("function(){}") 不会返回一个函数对象。
eval('fn = ' + fn.toString());
return function(cofn, cothis){
coroutine = cofn;
cofn_this = cothis;
return fn.apply(this)
};
}
Array.prototype.forEach = new Iterator(function () {
for (var i = 0; i < this.length; i ++) {
yield(this[i])
}
});
// 示例代码
this.display = window.alert;
var A = [1,2,3,4,5];
A.forEach(function(it){
this.display(it)
}, this);
上下文绑定技巧与注意事项
实现过程中的关键技巧在于:
fn = eval(fn.toString())
该操作用于将函数 fn 中的引用绑定到当前上下文,确保函数内部的 yield 关键字能正确指向我们自定义的 yield 函数。
需要注意的是,如果在协程内部需要访问其他 this 上下文,必须向 Iterator 传递相应的参数,参考上述示例代码。
作者最新文章
JavaScript怎么准确判断数据类型:typeof、instanceof与Object.prototype.toString
2026-11-05 17:09:21
JS中将数组和对象混合组装为JSON字符串
2026-11-05 16:41:42
JS运算符优先级与结合性的区别是什么?
2026-11-05 13:22:02
JS Map怎么只遍历Key或Value
2026-11-05 13:00:36
D3.js 与 ECharts 选型对比:灵活性 vs 开发效率
2026-11-05 09:45:01
