JavaScript

【課題】JavaScriptのwhileループの復習【繰り返し処理】

どうも、つよぽんです!

今回は、「JavaScriptのwhileループを使った繰り返し処理」の理解度を確認するために用意した演習課題の紹介記事となります。

演習課題にチャレンジしてクリアすることで、知識を定着させることが出来ます。

今回の課題の内容は以下のとおりです。

演習課題で確認する内容
  1. JavaScriptのwhileループの理解度チェック

以下の画像は、今回の課題で作る完成形になります。(クリックするとアニメーション画像が別タブで開きます。)

今回の課題の完成形今回の課題の完成形

課題の詳細は以下の記事から確認することが出来るので、今すぐ課題に取り組みたい方は以下の記事から課題ページにアクセスして、早速取り組んでいただけたらと思います。

あわせて読みたい
【エクササイズ】Whileループの演習課題【JavaScript】前回学習したJavaScriptのWhileループをしっかりと使えるようになるために演習課題を用意しました。また今回の課題では、これまでに学んだ「デバッグ方法」「条件分岐」「比較演算子」の復習も同時に行っています。...

この記事の想定読者は次のとおりです。

想定読者
  • JavaScriptのwhileを使ったループ処理の知識が定着しているかを確認したい

課題に取り組む際にはもちろんHTMLファイルとJavaScriptファイルを連携させる方法を知っている必要があります。

もし、HTMLファイルとJavaScriptファイルの連携方法を忘れてしまっている場合は、以下の記事を参考にしましょう。

あわせて読みたい
HTMLでJavaScriptの外部ファイルを読み込み、実行するHTMLでJavaScriptファイルを読み込むことでWebブラウザでJavaScriptを実行することができます。今回はJavaScriptファイルの作成方法から、HTMLで作成したJavaScriptを読み込み、実行するところまでを解説します。...

今回の課題をクリアするために参考になる記事は次のとおりです。忘れてしまっているものがあれば記事を読み返しふり返ってみましょう。

JavaScriptでBooleanを取得する3つの方法

あわせて読みたい
JavaScriptでBooleanを取得する3つの方法Booleanとは「true」「false」の2つの値のことです。true・falseの値を取得するには直接「true」「false」という値を使う他に「比較演算子」「論理演算子」を使う方法があります。それぞれ3つの使い方を覚えていきましょう。...

今回の課題の中には「比較演算子」を使って、入力内容に応じて「正解」「不正解」をアラートダイアログで表示するものがあります。

冒頭でも貼ったアニメーション画像の内容がまさにそれにあたります。以下にもあらためて冒頭に貼った画像と同じものを貼っておきます。

今回の課題の完成形今回の課題の完成形

比較演算子」の使い方を知らない、もしくは覚えていない方は上記記事で解説しているので一度ふりかえることをオススメします。

JavaScriptの条件分岐の方法【if・else・else if】

あわせて読みたい
JavaScriptの条件分岐の方法【if・else・else if】使われる値に応じて処理内容を切り替えたいときに必要となる「条件分岐」について解説します。JavaScriptでも他のプログラミング言語と同様に「if」「else if」「else」というキーワードを使って条件分岐を実現することができます。...

今回の課題では、前の項目で話した「比較演算子」を使って「条件分岐」処理を行います。

条件分岐とは「if」「else」を使って、入力された値に応じて処理を切り替えることが出来る機能のことです。

前の項目で貼ったアニメーション画像では入力した値によって「正解」「不正解」というメッセージを切り替えて表示しています。

この「正解」「不正解」のメッセージを切り替える処理のところで「条件分岐」の「if」「else」を使っています。

条件分岐の書き方を知らない、もしくは忘れてしまったという方は上記の記事で復習してから今回の課題に取り組むと良いでしょう。

JavaScriptのwhileでループを行う【無限ループに注意】

あわせて読みたい
JavaScriptのwhileでループを行う【無限ループに注意】JavaScriptでループ処理を行うための1つの手段である「while」について解説をします。whileを使うことで、何回も繰り返して行いたい処理を実装できます。しかし無限ループも発生しやすいのでwhileを使うときは注意が必要です。...

今回の課題のメインテーマは「JavaScriptのwhileループの知識の定着」です。

上記の記事では、その「while」の解説を行っています。

また、whileループを実装する際に注意すべきポイントとして、「無限ループを発生させないように条件を意識する」というものもあります。

無限ループを発生させない方法についても上記記事で解説しているので、JavaScriptのwhileを使ったループ処理を書くのに自信が無い方は、今一度記事をふりかえって学習(復習)することをオススメします。

まとめ

あらためて、今回の課題をクリアするために必要な知識を解説した記事を以下にまとめておきます。

上にまとめた記事内容をふりかえり、今回の演習課題で取り組む知識定着のためにも、ぜひチャレンジしましょう!^^

演習課題で確認する内容
  1. JavaScriptのwhileループの理解度チェック
あわせて読みたい
【エクササイズ】Whileループの演習課題【JavaScript】前回学習したJavaScriptのWhileループをしっかりと使えるようになるために演習課題を用意しました。また今回の課題では、これまでに学んだ「デバッグ方法」「条件分岐」「比較演算子」の復習も同時に行っています。...

頭では理解してても実際に手を動かしてみて手が進まないところがあれば、それは理解が不十分だということを意味します。

練習問題をやっててわからないところ、質問したいところがあればお気軽に以下からご連絡いただけたらと思います^^

あわせて読みたい
【絶賛受付中】プログラミング・Webの相談お気軽にどうぞ!
【絶賛受付中】プログラミング・Webの相談お気軽にどうぞ!プログラミングやWebで困っていることに対して何でも質問受け付けています。「こんなこと質問しても大丈夫かな」と思っている方のために過去にどんな質問があったのか一例で挙げているので参考にしていただけたらと思います。...

それでは、課題頑張ってください!

【3つの特典付き】Webエンジニアに必要な基礎スキルを体系的に効率良く身につけたいですか?

LINE登録で無料特典を受け取る

次のような方向けに、学習をサポートするコンテンツを無料プレゼントしています。

  • Webエンジニアになりたいけど何から学習を始めれば良いかわからない
  • 今まで独学で頑張ってきたけど、独学に限界を感じてきた
  • プログラミングは出来るけど、大きめのコードが書けない

「プレゼント詳細が知りたい」「プレゼントを受け取りたい」といった方は、以下のボタンをクリックして詳細ページをご確認ください。

無料特典を受け取る

 

COMMENT

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