JavaScript【④条件分岐の if 文】
こんばんは😌ザッキーです🎵
じ、事件です。
今夜もまたトリートメントを流していませんでした！
もう、なんかの病でしょうか・・・(T_T)/~~~自分で自分が少し不安です。ｗ
今夜は連載記事JavaScript第四弾です！
【条件分岐の if 文】をやっていきま～す(*^▽^*)
とりかかる前に
if文とは・・・「もし～なら」「もし～でないなら」というように、ある条件に基づいて条件が成り立つか動作を変えるという決まりです。
クリックされたのが「ＯＫ」なのか「キャンセル」なのかを評価して、その後の動作を変えるのにif文を使用します。
条件に必要なブール文（ture/false）について理解してから実際にif文を書いていきます(^^)/
確認ダイヤログボックスを使ってみよう
以前のJavaScript②の記事でWindow.alertとWindow.promptについてご紹介しましたが、まずはそのお仲間からご紹介です😌
前記事はリンクを貼っておきますね。
今からご紹介するのはWindow.confirmさんです！（ぱちぱち～✋✨）
Window.confirm(’ゲームスタート！準備はいい？’);
と記述すると、
ダイヤログボックスになって画面上に現れます。
リターン
Windowオブジェクトのconfirmメソッドには、alertメソッドにはない特徴的な機能があります。それは、ダイヤログボックスを表示するだけでなくリターンを返してくるということです。「リターンを返す」とは、メソッドの実況報告のようなものです。
confirmメソッドの役割は、【ダイヤログボックスを表示して、ユーザーに「ＯＫ」もしくは「キャンセル」をクリックさせる】ことです。
- ＯＫの状態のことをture
- キャンセルの状態のことをfalse
と呼びます(^^)/
そして、プログラムではこのＯＫもしくはキャンセルが返ってきたという表現をします。この返ってきた値の名前を【戻り値】と呼びます。
プログラムを書く上でとっても大事なところです(*^▽^*)
随所に「返ってきた」とか「戻り値」とか「true」とか「false」登場しますので覚えましょうね!(^^)!
クリックされたボタンでメッセージを変える
ここで、confirmメソッドを使用してtrueもしくはfalseを返していきます。
いよいよ、この処理の振り分けにif文を使っていきます。
<script>
'use strict';
if(window.confirem('ゲームスタート！準備はいい？');
console.log('ゲームを開始します。');
}else{
console.log('ゲームを終了します。');
}
</script>
記述法は上記のようになります。
ブラケッツ画面で見るとこんな感じです(^^)/
if文を使う時は、書く際の公式のようなものが必要になります。
if(条件式){
条件がtrueになる(成り立つ)ときに実行する処理
}else{
条件がfalseになる(成り立たない)ときに実行する処理
}
波カッコがたくさん出てきて戸惑いますが、色分けしたように対応しております。
ここで、ダイヤログボックスを実際に確認すると
先ほどconsoleなしで書いた時と見た目は何ら変化ありませんが、プログラムを書いた製作者側は大きな変化があります。
それは、console.logを記述することによってＯＫを押した場合とキャンセルを押した場合とでconsoleにtrueかfalseの値が返って来ているのです。
- ＯＫを押した場合
- キャンセルを押した場合
それぞれconsole.logに記述した値が返ってきていますね!(^^)!
こうして、ユーザーがどんな風に行動したかによって、続きのプログラムを書いていくことができます。
ちなみに、戻り値を返すことはできませんがif文はelse以降を省略して記述することも可能です(^^)/
まとめ
- Window.confirmは、ユーザーにＯＫかキャンセルを押してもらうメソッド
- リターンのtrueとfalse
- if文で戻り値を取得
- if文はプログラムを書くときにとっても役立つ
いかがでしたでしょうか😌
if文はJavaScriptをかいていると必ず出会う＆必ず使うものになります。
基本を押さえてJavaScriptマスターに、俺はなる！
（すみません。今日からセブンイレブンで700円以上の購入で、もれなくポケモンのエコバックがもらえるという話で学校で盛り上がった名残が出てしまいました。ｗ）
本日は以上です😌✨
最後までお付き合いいただきありがとうございました(^^♪
THANKYOU for comming
a lot of LOVE💕ザッキーでした(*^▽^*)
