本帖最后由 pilot34 于 2022-8-2 13:14 编辑
Generator函数是ES6提供的一种异步编程解决方案,其形式上也是一个普通函数,但与普通函数有着很多不同,其有几个显著的特征,如下:
- function关键字与函数名之间加星号 "*"
- 函数体内使用 yield 表达式来定义不同的内部状态
- 调用 Generator函数,返回一个遍历器对象(Iterator Object)
- 依次调用遍历器对象的next方法,可以遍历 Generator函数内部的每一个状态
那么,基于Generator函数自身的特点,它都在实际开发中都有哪些应用呢?
比如:前端做抽奖,可以使用它来做:抽奖次数有限,不同的人来抽奖,抽奖一次,抽奖次数变少一次,直至没有抽奖次数为止。
实现伪代码如下:
[JavaScript] 纯文本查看 复制代码 {
// 抽奖逻辑的伪代码
function print(count) {
// 执行一段抽奖逻辑
// ...
console.log(`剩余${count}次`);
}
// 执行抽奖的方法
function* draw(count) {
while(count > 0) {
count--;
yield print(count);
}
}
let startDrawing = draw(6);//例如初始时抽奖次数为6次
//添加抽奖点击按钮
let btn = document.createElement('button');
btn.id = 'action';
btn.textContent = '开始抽奖';
document.body.appendChild(btn);
//添加按钮点击监听事件
document.getElementById('action').addEventListener('click', function(){
startDrawing.next();
}, false);
}
大家如有兴趣或对这方面有研究有想法,不妨畅所欲言,讨论讨论,共同进步~。 |