*

switch文を使って条件を細かく設定する。

公開日: : 最終更新日:2015/10/29 javaScript

以前は複数のifelse文を用いて月の入力を促して、その結果を踏まえた季節を表示するサンプルプログラムを紹介しました。しかし、ifelseだけで表記をするとコードは読みにくくなります。

そこで、今回書いていくのがswitch文と呼ばれるものです。switch文は、変数や式の値に応じて、処理を個別に設定できます。括弧内「()」の値に対応するcase文にジャンプして、break文でブロックを抜けます。

実行結果はこちら

文字列を数値に変換するNumber関数

サンプルコード上にて、入力ダイアログボックスを表示するpromptメソッドの戻り値は文字列です。文字列を数値として扱うためには、文字列を数値に変換する必要があります。今回登場したNumber関数を使って、文字列を数値に変換できます。

関数とは、、処理の塊を名前(関数名)で呼び出せるようにしたものです。メソッドと同じように引数を処理して戻り値を返します。ただし、メソッドのようにオブジェクトに依存はせず、単独で呼び出すことが可能です。

なお、変数monthの値が文字列でも、switch文で使うことはできますが、その場合caseの後の値は「”」で囲って、文字列として比較します。
case “1”:
case “2”: といった感じにです。

比較演算子の数値と文字列の処理

前回まで、if文では、変数の値を数値に変換する処理はしておりません。これまでに出てきたコードは

javaScriptでは、実は比較演算子で数を表す文字列を比較しようとすると自動的に数値に変換された上で比較されます。

“100” >= 5

100 >= 5

true

といった具合になります。私のように他のプログラミング言語からjavaScriptを学ぶとこういうのが気になります。たしかに便利なのですが・・・

スポンサードリンク

関連記事

catejavaScript

javaScriptのプロパティの使い方

プロパティに値を設定する 「=」の左辺にプロパティを、右辺に設定する値を書きます。

記事を読む

JavaScript

時計を作ってみる

指定した時間が経過した後に何か処理をしたかったり、一定時間ごとに処理を繰り返したい、ということがあり

記事を読む

JavaScript

document内の好きな要素にアクセスする

HTMLドキュメントやXMLドキュメントのすべての要素に、階層構造で接続できるようにした仕組みのこと

記事を読む

catejavaScript

変数で文字列をつかう

変数には文字も格納できます。 前回、前々回の記事では、数値を変数に代入しました。変数という名前のせ

記事を読む

catejavaScript

ダイアログボックスを表示する。

今回はjavaScriptについて書いてきます。 まずはサンプルコード 実行結果は

記事を読む

JavaScript

DOMを使用して、スタイルを動的に変更する

HTMLの見た目をよくするためにスタイルシートを使用することが普通です。綺麗なウェブページのレイアウ

記事を読む

catejavaScript

日付や時刻を操作する

前回の記事でnew演算子とDateコンストラクタを使い、利用可能なオブジェクトであるインスタンスを生

記事を読む

catejavaScript

指定した回数だけ処理を繰り返す

if文の条件判断と並んで、プログラムに欠かせない制御がループです。ループを使うと、プログラムは簡潔に

記事を読む

JavaScript

フォームの部品を利用する

HTMLフォームは、javaScriptからみれば、formオブジェクトです。フォームのGUI部品で

記事を読む

JavaScript

オリジナルのオブジェクト(ユーザー定義オブジェクト)を作ってみる

documentオブジェクト、dateオブジェクトなど予め用意されているオブジェクトを使ってきました

記事を読む

スポンサードリンク

Message

メールアドレスが公開されることはありません。

CAPTCHA


次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">



スポンサードリンク

jQueryMobile
トグルスイッチを設定する

トグルスイッチ(toggle switch)とは、〇型のつまみを左右に

jQueryMobile
項目選択の複数ウィジェットをグループ化する

年月日など、複数のリストから同時に選択したいとき、ウィジェットのグルー

jQueryMobile
<select>により項目選択

ボタンによる選択では、1つの項目だけ選択するか、複数を同時に選択するか

jQueryMobile
値を選択するボタンを表示する

値を選択するボタンは以下の2つがあります。 ・複数の値から1つだ

jQueryMobile
ボタンを設定する

前回の記事では<a data-role="button">

→もっと見る

  • スポンサーリンク

PAGE TOP ↑