JavaScript/yield

yield

yield は、JavaScript において、ジェネレータ関数内で使用されるキーワードです。ジェネレータ関数は、反復処理（イテレーション）を簡素化するために使用され、yield を使うことで、関数の実行を一時停止し、呼び出し元に値を返すことができます。その後、再開時に実行を続けることができます。

構文

function* generatorFunction() {
  yield value;
}

ジェネレータ関数の定義は、function* として行い、その内部で yield を使用します。yield は、関数の実行を一時停止し、与えられた値を呼び出し元に返します。

使用例

基本的な使用例

function* countUp() {
  yield 1;
  yield 2;
  yield 3;
}

const counter = countUp();
console.log(counter.next().value);  // 1
console.log(counter.next().value);  // 2
console.log(counter.next().value);  // 3
console.log(counter.next().value);  // undefined

この例では、countUp ジェネレータ関数が 1, 2, 3 の値を順番に yield で返します。next() メソッドを呼び出すたびに、関数の実行が一時停止し、次の値が返されます。

ジェネレータ関数と繰り返し処理

function* generateSequence(start, end) {
  for (let i = start; i <= end; i++) {
    yield i;
  }
}

const sequence = generateSequence(1, 5);
for (let value of sequence) {
  console.log(value);
}
// 出力:
// 1
// 2
// 3
// 4
// 5

yield を使うことで、繰り返し処理を効率よく実行できます。generateSequence 関数は 1 から 5 までの数値を返すジェネレータです。

値を受け取る

function* generator() {
  const receivedValue = yield 'Hello';
  console.log(receivedValue);
  yield 'World';
}

const iterator = generator();
console.log(iterator.next().value);  // 'Hello'
iterator.next('JavaScript');         // 'JavaScript' が出力される

ジェネレータ関数内で yield を使用する際、呼び出し元から値を受け取ることができます。`iterator.next('JavaScript')` で yield が一時停止している位置に値を送信できます。

ジェネレータの終了

function* generator() {
  yield 1;
  yield 2;
  return 3;
}

const iterator = generator();
console.log(iterator.next().value);  // 1
console.log(iterator.next().value);  // 2
console.log(iterator.next().value);  // 3
console.log(iterator.next().done);   // true

ジェネレータ関数は return キーワードを使用して終了し、next() が呼ばれると done プロパティが true になります。

使用の注意点

ジェネレータ関数は、yield を使用することで関数の実行を中断し、状態を保持します。そのため、ジェネレータ関数は再開可能な関数となり、状態を持った反復処理を行うのに適しています。
ジェネレータ関数は、通常の関数とは異なり、next() メソッドで手動で実行を進める必要があります。自動で反復処理を行いたい場合は、for...of ループを使用するのが一般的です。

推奨される代替手段

yield を使用して非同期処理の制御を行いたい場合、async / await を使用することもできます。async / await は非同期処理を直感的に書ける方法であり、yield を使うジェネレータよりも多くの場合で可読性が向上します。

参考

MDN Web Docs: yield