【JavaScript】ループ処理を極めよう【基本講座】

Pocket

【JavaScript】ループ処理を極めよう【基本講座】

JavaScriptの肝の一つ、ループ処理について学んでいきましょう。for文やwhile文、do-while文とあり、扱い方は若干異なりますが、すべて書けるようになっておきましょう。

出典:http://www.photo-ac.com/

ループ処理の基本

for文

ループ処理と言えば、for文を思い浮かべるのではないでしょうか?JavaScriptにおいても、C/C++などと同じような書き方ができますので、理解しやすいのではないでしょうか?

例題を見ていきましょう。

問.1~10までカウントアップするプログラムを書け。

for文の書き方は、最初に「ループ開始前の処理」次に、「どこまで繰り返すかの条件」。最後に「ループ処理におけるステップ数」を()丸括弧で記述します。
そして、{}波括弧でブロックを囲い、繰り返す処理を記述します。
そして、この3つの間には「;」セミコロンを書く決まりになっています。
ちなみに、「ループ開始前の処理」「どこまで繰り返すかの条件」「ループ処理におけるステップ数」を必ず書かないとエラーになるのかというと、そうではありません。

という書き方もできます。後者の書き方は、無限ループ処理のときに利用します。

この後、解説しますが、whileを使った無限ループもできるので、どちらでも書けるようにしておきましょう。

while文

while文の書き方ですが、whileのとの()丸括弧に繰り返し続けるための条件を書きます。そのあと、{}波括弧でブロックを囲い、その中で繰り返し処理を書きます。

先ほどの例題をwhile文で書いてみましょう。

そこまで悩む処理はないように思いませんか?

先ほど紹介した無限ループですが、条件部分のところを、trueまたは、1にすると無限ループになります。

do-while文

do-while文もC/C++から来た人には、馴染みの深い文法でしょう。同じ書き方です。
while文と比較するなら、最初に条件を書かないで、最後に書いているところが違いです。

先ほどの例題を元に、do-while文で書いてみましょう。

do-while文の最大の特徴は、初回の処理は、ブロック内に入り処理されるということです。以降の処理は、条件によってループします。つまり、最初の1回は絶対に処理したい時は、このdo-while文が有効です。この違いだけ念頭に置いてコードを書くようにしましょう。

二重ループで模様を描いてみよう!

次にループ処理の演習でよくお目にかかる2重ループで模様を描いてみましょう。
「*」を使って正方形を描いてみます。
これを実現するためには、for文を入れ子にする2重ループという手法を用います。

例題を見てください。

問.「*」を使って5×5の正方形を描くプログラムを示せ。

このようにして、模様を描くことができます。ループ条件やループ処理を変更することで、いろいろな模様が作れますので練習して2重ループをマスターしてください。

JavaScriptおすすめ書籍

JavaScriptの入門書は、「これから学ぶ~」が分かりやすいです。その次に「Good Parts」をやることをおススメします。これは、JavaScriptのテクニック的な参考書で実践に使えます。他、有名なサイの本もありますが、これは、そこまで必須ではないかもしれません。「The Good Parts」で良いかなと思える感じです。主に初学者用にチョイスしました。良かったら読んで見てください。

これから学ぶJavaScript

新品価格
¥1,320から
(2020/4/25 17:45時点)

これから学ぶ JavaScript

新品価格
¥2,640から
(2020/4/25 17:47時点)

Kindle版

JavaScript: The Good Parts ?「良いパーツ」によるベストプラクティス

新品価格
¥1,980から
(2020/4/25 17:49時点)

JavaScriptの絵本 第2版 Webプログラミングを始める新しい9つの扉

新品価格
¥1,756から
(2020/4/25 17:54時点)

スラスラわかるJavaScript

新品価格
¥2,400から
(2020/4/25 17:53時点)

初めてのJavaScript 第3版 ?ES2015以降の最新ウェブ開発

新品価格
¥3,520から
(2020/4/25 17:44時点)

がんばらないでプログラマーになりたい人向けの学習方法とは?

【スクール】今流行りのプログラミングスクールについて徹底的に調べてみた