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

確認ダイアログボックスを使ってみよう

  <script>
    'use strict';
    console.log(window.confirm('ゲームスタート！準備はいい？'));
  </script>

windowオブジェクトに確認ダイアログボックスが表示される。
その中は、パラメータとキャンセルとOKが表示される。
キャンセルをクリックするとコンソールにfalse
OKをクリックするとコンソールにtrueが表示される。

気づき

console.log(window.confirm('ゲームスタート！準備はいい？'));

パラメータでtrueかfalseになる。
それがconsoleオブジェクトに表示される。

.confirm

window.confirm()オプションのメッセージを含むダイアログを表示し、ユーザーがダイアログを確認またはキャンセルするまで待機するようブラウザに指示します。

戻り値

OK(true) またはキャンセル(false) が選択された かどうかを示すブール値。ブラウザがページ内ダイアログを無視している場合、返される値は常にfalseです。

出典

クリックされたボタンでメッセージを変える

  <script>
      'use strict';
    if(window.confirm('ゲームスタート！準備はいい？')) {
        console.log(`ゲームを開始します。`);
    } else {
        console.log(`ゲームを終了します。`);
      };
  </script>

trueの時は

console.log(`ゲームを開始します。`);

falseの時は

console.log(`ゲームを終了します。`);

の処理が行われる。

気づき

やっとプロゲートで学習したif文を使うことができた。
こうやって使うんだな。

elseがない場合

  <script>
      'use strict';
    if(window.confirm('ゲームスタート！準備はいい？')) {
        console.log(`ゲームを開始します。`);
    };
  </script>

キャンセルをクリックした時falseが返されるので、コンソールには何も表示されない。
表示させたい時は

console.log(window.confirm('ゲームスタート！準備はいい？'));

のように直接consoleオブジェクトにif文を書くか、elseにconsole.logをして表示させるようにする。

出典