JavaScript中 ES6 generator数据类型详解
什么是 generator?
generator 是 ES6 中新增加的一种数据类型,它可以在函数执行的过程中暂停执行,并可以恢复执行。
在函数中使用 yield
关键字可以暂停函数的执行,同时可以通过 next()
方法恢复函数的执行。
使用 generator 可以方便地实现异步操作、迭代器等功能。
如何定义 generator 函数?
定义 generator 函数时需要在函数名前加上 *
,例如下面的示例:
function* myGenerator() {
yield 'apple';
yield 'banana';
yield 'orange';
}
如何使用 generator 函数?
在函数中使用 yield
关键字可以暂停函数的执行,yield
表达式返回的是一个 IteratorResult 对象,包含两个属性:value
和 done
。
当使用 next()
方法调用 generator 函数时,函数会从 yield
表达式处继续执行,直到出现下一个 yield
表达式或函数结束为止。
下面是一个例子:
function* myGenerator() {
yield 'apple';
yield 'banana';
yield 'orange';
}
const gen = myGenerator();
console.log(gen.next()); // { value: 'apple', done: false }
console.log(gen.next()); // { value: 'banana', done: false }
console.log(gen.next()); // { value: 'orange', done: false }
console.log(gen.next()); // { value: undefined, done: true }
generator 函数的位置
在 ES6 中,generator 函数可以出现在以下位置:
- 在函数定义中;
- 在类定义中;
- 在对象字面量中;
- 在某些表达式中(如
yield*
、for..of
等)。
下面是一个使用 generator 函数实现斐波那契数列的例子:
function* fibonacci() {
let prev = 0;
let curr = 1;
while (true) {
yield curr;
[prev, curr] = [curr, prev + curr];
}
}
const gen = fibonacci();
console.log(gen.next().value); // 1
console.log(gen.next().value); // 1
console.log(gen.next().value); // 2
console.log(gen.next().value); // 3
console.log(gen.next().value); // 5
console.log(gen.next().value); // 8
generator 函数的实际应用
使用 generator 函数可以很方便地实现异步操作。下面是一个使用 generator 函数实现异步操作的例子:
function* fetch(username) {
const url = `https://api.github.com/users/${username}`;
const response = yield fetch(url);
const data = yield response.json();
return data;
}
const gen = fetch('octocat');
gen.next().value.then(response => {
return gen.next(response).value;
}).then(data => {
console.log(data);
});
总结
generator 是一种新增的数据类型,它可以在函数执行的过程中暂停执行,并可以恢复执行。
使用 generator 可以方便地实现异步操作、迭代器等功能,同时也可以在函数定义中、类定义中、对象字面量中和某些表达式中使用。
本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:JavaScript中 ES6 generator数据类型详解 - Python技术站