JavaScript の yield キーワード

Muhammad Muzammil Hussain 2023年6月20日

JavaScript JavaScript Keyword

この記事では、ジェネレーター関数での yield キーワードの使用とその目的について説明します。 JavaScript の例で、yield キーワードの機能と使用法を実行します。

JavaScript で `yield` キーワードを使用する

JavaScript では、コールバックまたはネストされた関数で yield 式を使用できません。 yield キーワードを使用して、ジェネレータ関数を非同期的に一時停止および再開します。

yield ステートメントは、value と done の 2つのプロパティを含むオブジェクトを返します。

value: このプロパティには、ジェネレーター関数に渡される実際の値が含まれます。
done: このプロパティにはブール値が含まれます。ジェネレーター関数が完全に完了すると、true が返されます。それ以外の場合は false。
ジェネレータ関数: 関数をジェネレータに変換するには、function キーワードにアスタリスク記号 (*) を追加する必要があります。 JavaScript では、ジェネレーター関数は通常の関数に似ています。

yield キーワードを使用して、任意の value を返します。ジェネレーター関数の実行を一時停止したい場合は、yield 式を使用する必要があります。

実行を再開したい場合は、next() メソッドを呼び出す必要があります。関数は、yield または return ステートメントが見つかるまで実行を続けます。

ジェネレーター関数が再度呼び出されると、実装は最後の yield 式から続行されます。

ここでは、関数を生成し、yield キーワードを使用して実行を一時停止する例を作成します。

コード例:

<script>

function* testGenerator(i) {
    while (i < 5) {
        yield i++;
    }

}

//creating an object with our function testGenerator

const test = testGenerator(2);

//return object with 2 value is passed to the testGenerator yield expression

console.log(test.next());

//return object with 3 value.

console.log(test.next());

//return object with 4 value

console.log(test.next());

</script>

出力：

            [object Object] {
            done: false,
            value: 2

            }

            [object Object] {
            done: false,
            value: 3
            }

            [object Object] {
            done: false,
            value: 4
            }

上記の JavaScript ソースコードでは、ジェネレータ関数 testGenerator() をアスタリスク記号 (*) で宣言しています。関数内の yield キーワードで実行を一時停止するために while ループを使用しました。

次に、ジェネレーター関数でオブジェクト test を作成し、値 2 を渡しました。 console.log では、関数オブジェクト test と next() メソッドを呼び出しました。

返されたオブジェクトと実行フローは、コンパイラのログボックスで確認できます。

JavaScript で yield キーワードを使用する

JavaScript で `yield` キーワードを使用する