カテゴリー
【Javascript基礎講座】AsyncGeneratorを正しく初期化する
※ 当ページには【広告/PR】を含む場合があります。
2024/04/18
AsyncGeneratorの基本的な使い方
AsyncGenerator
function*
async
const generator = async function*() {
yield* await Promise.resolve([1, 2, 3]);
};
//👇await generator()とならないことに注意
const gen = generator();
console.log(await gen.next());
console.log(await gen.next());
console.log(await gen.next());
console.log(await gen.next());
{ value: 1, done: false }
{ value: 2, done: false }
{ value: 3, done: false }
{ value: undefined, done: true }
next
AsyncGenerator
async function
Promise
const gen = await generator()
await
async function*
AsyncGenerator
await
AsyncGenerator
const generator = async function*(data) {
yield* data;
};
const data = await Promise.resolve([1, 2, 3]);
const gen = generator(data);
console.log(await gen.next());
console.log(await gen.next());
console.log(await gen.next());
console.log(await gen.next());
{ value: 1, done: false }
{ value: 2, done: false }
{ value: 3, done: false }
{ value: undefined, done: true }
AsyncGeneratorをクラスのメンバ変数として初期化する
AsyncGenerator
AsyncGenerator
AsyncGenerator
class HogeClass {
constructor() {
this.gen = initHogeAsyncGenerator();
}
initHogeAsyncGenerator = async function*() {
yield* await Promise.resolve([1, 2, 3]);
};
}
const hoge = new HogeClass();
console.log(await hoge.gen.next());
console.log(await hoge.gen.next());
console.log(await hoge.gen.next());
console.log(await hoge.gen.next());
{ value: 1, done: false }
{ value: 2, done: false }
{ value: 3, done: false }
{ value: undefined, done: true }
AsyncGenerator
class HogeClass {
constructor() {
this.gen = initHogeAsyncGenerator();
//👇コンストラクタ内部でPromise型の中身は解決できない
const data = await Promise.resolve([1, 2, 3]);
this.gen = initHogeAsyncGenerator(data);
}
initHogeAsyncGenerator = async function*(data) {
yield* data;
};
}
const hoge = new HogeClass();
//...
AsyncGenerator
class HogeClass {
constructor() {}
initHogeAsyncGenerator = async function*(data) {
yield* data;
};
static async initHogeFactory() {
const obj = new HogeClass();
//👇ここで非同期に初期化させたい値を引き出す
const lazyData = await Promise.resolve([1, 2, 3]);
obj.gen = obj.initHogeAsyncGenerator(lazyData);
return obj;
}
}
const hoge = await HogeClass.initHogeFactory();
console.log(await hoge.gen.next());
console.log(await hoge.gen.next());
console.log(await hoge.gen.next());
console.log(await hoge.gen.next());
{ value: 1, done: false }
{ value: 2, done: false }
{ value: 3, done: false }
{ value: undefined, done: true }
まとめ
AsyncGenerator
記事を書いた人
ナンデモ系エンジニア
主にAngularでフロントエンド開発することが多いです。 開発環境はLinuxメインで進めているので、シェルコマンドも多用しております。 コツコツとプログラミングするのが好きな人間です。
カテゴリー