あーりーです。
JavaScriptを趣味で勉強しています。
のんびり楽しみながらやってます。
前回と前々回は、プログラムの流れを分岐させる方法について書きました。
こちらの記事です。
今回は、そのつづきです。
今回のテーマ
今回やってみたいのは…
「条件式1と条件式2の、どちらかが成立する場合はAという処理をする」
「どちらも成立しない場合は、Bという処理をする」
というものです。
スクリプトの書き方
スクリプトの書き方は、こうです。
if(条件式1 || 条件式2){ どちらかが成立する場合の処理 }else{ どちらも成立しない場合の処理 }
「または」の記号
注目していただきたいのが…
条件式1と条件式2にはさまれた「||」という記号です。
この赤い部分です。
if(条件式1 || 条件式2){
これは「または」です。
条件式1が成立する、または、条件式2が成立する場合…
という意味になります。
記号の入力方法
ところで、「||」ってどうやって入力するの?
と思う方もいらっしゃるかも知れません。
パソコンでの入力方法を確認しておきますね。
「Shift」キーを押しながら、「¥」マークのキーを押します。
すると「|」が表示されます。
これを2回入力すると「||」になります。
サンプル
では、「||」を組み込んだサンプルを実際に見てみましょ~。
わかりやすいように「||」の部分を赤くしてあります。
こちらです。
<html> <head> </head> <body> <script> var x; x=window.prompt("合言葉は?",""); if(x=="山"||x=="川"){ document.write("OK"); }else{ document.write("違う!"); } </script> </body> </html>
実行すると?
上の内容を実行すると、どうなるのか。
確認しておきますね。
上の内容をメモ帳などのエディタにコピペしてHTML形式で保存し、そのファイルを開くと…
入力ダイアログが表示されて「合言葉は?」と問いかけてきます。
入力ダイアログの例
入力ダイアログとは、たとえばこんな感じのものです。
ブラウザの画面にポンっと出てくるアレです。
上の例では「お名前は?」と聞いてますけど、今回のスクリプトでは「合言葉は?」と聞くようになってます。
入力欄に「山」または「川」と入力すると、「OK」と表示されます。
それ以外を入力すると「違う!」と表示されます。
解説
では、JavaScriptの部分をじっくり見ていきますね。
変数「x」の準備
まずこの部分です。
var x;
変数「x」を使いますよ~!と宣言しています。
これで、変数「x」を使う準備が完了しました。
入力ダイアログを表示する
つぎの行です。
x=window.prompt("合言葉は?","");
ここでは「window.prompt」で入力ダイアログを表示しています。
「window.」の部分を省略して「prompt」と短縮してもOKです。
左のダブルクォート
左のダブルクォートの中身(赤い部分)は、入力ダイアログに表示されるコメント(説明文?)です。
x=window.prompt("合言葉は?","");
右のダブルクォート
そして…
右のダブルクォートの中身は、入力欄にあらかじめ入力される文字です。
今回は空欄なので、何もありません。
変数「x」に代入
入力ダイアログに入力された文字は、変数「x」に代入されます。
変数「x」は、この赤い部分です。
x=window.prompt("合言葉は?","");
2つの条件式
つぎの行です。
if(x=="山"||x=="川"){ document.write("OK");
「x==”山”」という条件式と、「x==”川”」という条件式が登場します。
2つの条件式のあいだには「||」記号があります。
この部分の意味は…
「x」が「山」と等しい、または、「x」が「川」と等しければ、画面に「OK」と表示する。
というものです。
つまり…
入力ダイアログに入力された文字が、「山」または「川」のときに、「OK」と表示されます。
どちらの条件式も成立しないとき
つぎの行です。
}else{ document.write("違う!"); }
どちらの条件式も成立しないときの処理です。
画面には「違う!」と表示されます。
以上が…
「条件式1と条件式2の、どちらかが成立する場合はAという処理をする」
「どちらも成立しない場合は、Bという処理をする」
というスクリプトでした~。
今回はこれでおしまい。
JavaScriptの記事は、この記事も含めて「初心者のための超わかりやすいJavaScript入門」にまとめてあります。よろしければご覧ください。