Part8:ループ

海未「今回はループについて見てみましょう。ループは、同じ処理を何回も繰り返すことです」

海未「JavaScriptのループにはいくつかの種類があります」

  • for
  • do…while
  • while
  • for…in
  • for…of

穂乃果「うわ、いっぱいある・・・」
海未「ループで楽になると言ったのは穂乃果ですから、きっちり覚えて楽になってもらいましょう」
穂乃果「ぜ、前言撤回!」


for

海未「for文は、おそらく最も一般的なループの書き方でしょう。初期条件と終了条件を指定して繰り返し処理を行うものです」

Super LOVE=Super LIVE!! 0
Super LOVE=Super LIVE!! 1
Super LOVE=Super LIVE!! 2
Super LOVE=Super LIVE!! 3
Super LOVE=Super LIVE!! 4
Super LOVE=Super LIVE!! 5
Super LOVE=Super LIVE!! 6
Super LOVE=Super LIVE!! 7
Super LOVE=Super LIVE!! 8

ことり「9回繰り返してるのは、なんとなく分かるんだけど・・・」
海未「for()の中が肝ですね。var i = 0i < 9i++の3つの文が含まれています」
穂乃果「iを0から8まで増やしながら繰り返してるの?」
海未「!」
ことり「あ、賢い」
海未「時々見せるこの直感力・・・いつもこうならいいのですが」
穂乃果「もー、穂乃果だって、やるときはやるんだよっ」
海未「最初のvar i = 0は初期化式で、for文が実行されるとき1回だけ評価されます。このiはループカウンタと呼んだりしますね」
穂乃果「ふんふん、やっぱり最初は0なんだね」
海未「次のi < 9は条件式で、この条件が満たされている、つまりこの式の評価結果がtrueである限りループを続けます」
穂乃果「9未満だから8までだね」
海未「最後のi++は更新式で、ブロック内の処理の実行が1回終わるごとに評価されます」
穂乃果「これで、0から8まで増えていくんだ」
海未「まとめると、ループカウンタiの値を1ずつ増やしながら、計9回の繰り返し処理を行っていることになります」


do…while

海未「さきほどのコードを、do..while文を使って書き直してみましょう」

海未「結果は全く同じです」
穂乃果「さっきより読みにくくなったような・・・」
海未「このdo...whileや次に見るwhileは、ループの継続制御が複雑だったり特殊だったりしてforでは書きにくい場合に使うことが多いです」


while

海未「これは先ほどのdo...whileと似ていますが」

ことり「ほんとに、あんまり変わらないね」
海未「違いは、継続条件が最初に評価されるか最後に評価されるかです。例えば」

海未「この場合は、何も出力されません。最初の時点でi < 9を満たしていないからです。ところが」

海未「この場合だと、Super LOVE=Super LIVE!!9と出力されます。doはとりあえず最初の1回は必ず実行するのです」
ことり「どうやって使い分けたらいいのかな?」
海未「そうですね・・・実際のところ、do...whileを使うケースは少ないです。何か理由がない限りはwhileでいいでしょう」


for…in

海未「for...inはこれまでとは少し違って、オブジェクトのプロパティに対して反復処理を行うものです」

name : Honoka Kosaka
age : 16

海未「このコードのpropにはプロパティの名前が入ります。nameageですね」
ことり「それでhonoka[prop]で値を取り出せるんだね」
穂乃果「オブジェクトにどんなプロパティがあるか調べられるんだ」


for…of

海未「最後にfor...ofですが、これはECMAScript6で追加された新しい機能です。環境によって、仕様が不安定な場合があるかもしれません」

honoka
kotori
hanayo

海未「この文は後ほど出てくるArrayやMap、Setなどを対象として、値の反復を行うものです」
穂乃果「この例だと、配列の要素が1つずつ取り出せるってこと?」
海未「そうですね。ちなみにこれをfor...inで書くと」

0
1
2

海未「添字が返ってきてしまいます」
ことり「これは、あんまり嬉しくないね・・・」
海未「配列などの要素アクセスは他にもやり方がありますから、配列についての説明の際に改めてみてみましょう」


breakとcontinue

海未「最後に、各ループ構文と組み合わせて使うbreakcontinueを見ておきましょう」

honoka
kotori

海未「Printempsのメンバーが入った配列をループしていますが、要素が”kotori”だったらbreakを実行しています。この場合、その時点でループを終了し、次の”hanayo”は処理されません」
穂乃果「ループを終わらせる命令なんだね」
ことり「海未ちゃん、円環の因果を断ち切る云々とか脳内変換してそう」
海未「ど、どこの中二病ですか私は」
ことり「カチューシャつけて、銃とか持ってみない?髪とか胸とかぴったりだと思うな。コスプレ衣装なら用意するから」
海未「遠慮しておきます!」

海未「次にcontinueの場合ですが」

honoka
end
kotori
hanayo
end

海未「ループの最後に”end”と出力する処理を追加しましたが、”kotori”の場合はその手前にcontinue文を置いています」
ことり「え~っと、ことりのときだけ、”end”が出てないのかな」
海未「continueは、その時点でループの先頭に戻る命令です。ですから、その後にある処理は実行されないのです」


海未「ループは以上です。どうですか穂乃果」
穂乃果「覚えるまで楽はできそうにないよ・・・」
海未「そう思うならしっかり勉強することです」


LINEで送る
Pocket


返信を残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です