sugulogの日記

JavaScriptのイテレータとジェネレータ。Symbol.iteratorやyieldを使用しイテレータを使いこなそう。

スポンサードリンク

f:id:sugulog:20220205194316p:plainこんにちは、すぐるです!

sugulogをお読みいただきありがとうございます!!

このブログは、「 過去の無知な自分に向けてわかりやすく説明するなら?? 」を基準に書いています。

少しでもお役に立てれば幸いです。

 

今回は、Symbol.iteratorやyieldを使用しイテレータを使いこなそうということで

について簡単に解説します!!

その為このブログを読むことで、イテレータ、ジェネレータについて理解が深まるのはもちろん、Symbol.iteratorやyieldを使用しイテレータを使いこなせるようになります。

是非最後までご愛読ください。

 

今回は、

イテレータ

・ジェネレータ

の順で解説していきます。

では早速、みていきましょう!!

イテレータ

イテレータとは複数の値に次々とアクセスできる仕組みを備えたオブジェクトのことです。

forやforeach等で処理できるようなオブジェクトのことを指し代表的なイテレータとして配列が挙げられます。

そして配列等の要素である個々のイテレータにアクセスする方法として、Symbol.iteratorがあります。

実際に以下のコードで定義方法を確認していきましょう。

f:id:sugulog:20220203232332p:plainオブジェクトより個々のイテレータ情報を取得する際は、オブジェクト名[Symbol.iterator]()と記述します。

取得した個々のイテレータにアクセスする際はイテレータ.next()と記述します。

アクセスしたイテレータの値を取得する際はアクセスイテレータ.valueと記述します。

オブジェクトのイテレータが終了したかどうかを判別する際は、アクセスイテレータ.doneと記述します。

個々のイテレータにアクセスする際は上記の流れに沿って記述しましょう。

f:id:sugulog:20220203230316p:plain

それぞれ順にイテレータの値が取得できているのが確認できます。

そしてindex3には値がないためdoneでは終了と判断されtrueが返ってきているのも確認できます。

・ジェネレータ

ジェネレータとは一定の手順に従って次々に異なる値などを生成し呼び出し元に返すものでイテレータを自作するための関数のことです。

ジェネレータを定義する際はfunction宣言に対しアスタリスク(*)を付与します。

実際に以下のコードで定義方法を確認していきましょう。

f:id:sugulog:20220204221004p:plain

ジェネレータはfunction* 関数名 () {}で定義します。

関数の中ではyieldを使い次に何を取り出すかを定義します。

ジェネレータではyieldが個々のイテレータにあたります。

またyieldとyieldの間に処理を記述した場合、その処理は実行されます。

ジェネレータを生成する場合は関数の呼び出し時と同じで引数を渡すことも可能です。

そして生成されたジェネレータはnext()、valueを使用し値を取得することが可能でdoneも使用することが可能です。

f:id:sugulog:20220204221015p:plain

yieldの値が順に取得できているのが確認できます。

またyieldとyieldの間に記述した処理が実行されているのも確認できます。

このようにジェネレータを利用することでイテレータイテレータの間で処理を定義できるなど、より自由度の高いイテレータを作成することができます。

 

以上、今回のブログでした。

イテレータ、ジェネレータについて理解が深まり、Symbol.iteratorやyieldを使用しイテレータを使いこなせるようになりましたか??

より高度な知識として蓄えていきましょう。

今回のToDo

yieldを使用してジェネレータを定義し値を取得してみましょう(≧∀≦)/

 

最後に!!

今後も、「 過去の無知な自分に向けてわかりやすく説明するなら?? 」を基準にブログを書いていきます。

少しでも気になった方はお試しでもいいので1度読者登録お願いします!

最後までご愛読いただきありがとうございました!!