sugulogの日記

JavaScriptと分割代入!まとめて値を代入しよう!!

スポンサードリンク

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

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

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

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

 

今回は、JavaScriptということで

  •  分割代入

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

その為このブログを読むことで、分割代入について理解できるのはもちろん、分割代入を利用した実装についても理解が深まります。

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

 

今回は、

  • 配列の分割代入

  • オブジェクトの分割代入

  • 配列をシャッフルしよう

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

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

・配列の分割代入

分割代入とは個々の値に個々の値を代入するための記法のことです。

配列の場合は[変数1, 変数2,...] = [値1, 値2,...]のように記述します。

実際にみてみましょう!

f:id:sugulog:20210307140428p:plain

f:id:sugulog:20210307140627p:plain

分割代入されているのが確認できますね!!

・オブジェクトの分割代入

オブジェクトの場合は{変数1, 変数2,...} = オブジェクトのように記述します。

実際にみてみましょう!

f:id:sugulog:20210307174323p:plain

f:id:sugulog:20210307174356p:plain

変数にはオブジェクトのキー名を指定する必要があります。

それぞれの変数にキー名と一致する値が分割代入されているのが確認できますね!!

また変数を変えたい場合には{ 変数:変えたい変数}のように記述します。

f:id:sugulog:20210307174906p:plain

f:id:sugulog:20210307174938p:plain

・配列をシャッフルしよう

配列を偏りなくシャッフルする際にはFisher Yates(フィッシャーイェーツ)のアルゴリズムを用いるのが便利です。

まずは記述をみてみましょう!

f:id:sugulog:20210307180814p:plain

ではFisher Yates(フィッシャーイェーツ)のアルゴリズムをみていきましょう。
for文において今回の場合、iは4、3、2、1、0と変化し処理は合計5回繰り返されます。

for文の中ではMath.randomで0以上1未満の値を取得しており、i + 1ではiは4、3、2、1、0と変化するので処理ごとに5、4、3、2、1を取得します。

その為randomにはMath.floorで数値以下の最大整数が代入されるので、0~4のランダムな数値が代入されることになります。

その結果、分割代入の際にrandomには配列インデックス内のランダムな整数が入り、iでは4~0と順に配列要素にアクセスし要素同士をシャッフルするという処理が行われます。

では実際に動きをみてみましょう!

f:id:sugulog:20210307185120g:plain

配列内の要素がシャッフルされているのが確認できますね!!

 

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

分割代入について理解でき、分割代入を利用した実装についても理解が深まりましたか??

Fisher Yates(フィッシャーイェーツ)のアルゴリズムは知識として頭の片隅に入れておきましょう(^_^)/

 

最後に!!

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

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

またTwitterでもプログラミングに関することを中心に情報を発信してます。

宜しければそちらのフォローもお願いします。

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