はじめようJavaScript第4回 JavaScriptの基本機能 条件分岐が書けるif文 その1

JavaScript 初心者がカスタマイズに必須の知識をより学べるよう、チュートリアルの内容を充実させてリニューアルしました。
   リニューアル後のチュートリアルは次のページを参照してください。
   はじめよう JavaScript

（著者：kintone エバンジェリスト 村濱 一樹）

確認ダイアログボックスを使って条件に応じた処理を書く

第2回では、アラートダイアログを表示してみましたが、今度は確認ダイアログボックスを表示させてみましょう。
確認ダイアログボックスを使うと、「OK」「キャンセル」のボタンを表示させることができるので、押されたボタンに応じて処理を変更することができるようになります。
ダイアログは保存時の意思確認などに使えますし、条件分岐はJavaScriptカスタマイズのあらゆるシーンで必要になってきます。

可能な方はぜひ、以下のリンク先で実際にご自身で入力しながら試してみてください。
https://jsfiddle.net/nvyrx5ht/1/

※記述ミスなどでうまく動作しないときのために、下の方にサンプル実行環境も用意していますので必要に応じてご利用ください。

サンプルプログラム

確認ダイアログボックスは confirm(メッセージ) で表示させることができます。

• サンプル実行環境 https://jsfiddle.net/kintone/nj5x86ok/2/

さらに、confirm関数はOKを押したかキャンセルを押したかの結果を返してくれます。結果を下記のように受け取ることができます。

サンプル実行環境 https://jsfiddle.net/kintone/7mad35rz/4/

コンソールには、「はい」を押すと「true」が、「キャンセル」を押すと「false」が表示されますので、試して下さい。

入力内容に応じて動作を変更する

前述のようにtrueかfalseのどちらかが返ってくる仕組みなので「はい」「キャンセル」どちらを押したかに応じてその後の動作を変えてみましょう。
まず、「はい」が押された場合、「はい　が押されました」とコンソールに結果を出してみます。

条件分岐の「if」

条件分岐はif文というものを使います。「条件が合致した場合（真）はAの処理、条件が合致しない場合（偽）はBの処理」ということが表現できます。
（書き方は違いますが、ExcelのIF関数のようなことが出来るイメージです。）

• if文の書き方

  ちなみにfalseの場合の処理が不要であれば、elseは省略可能です。

• サンプル
  はい・キャンセルをぞれぞれ押して動作を試してみてください。

  実行環境 https://jsfiddle.net/kintone/9pmwqak3/4/

サンプルでは、「はい」を押すと条件式のresult変数が true になるので、「はい　が押されました」とコンソールに表示がされた、ということになります。

条件式について

扱える条件式は様々です。上記サンプルのように直接true/falseどちらかがはいるのがもっとも単純なパターンですが、下記のように不等式を使うこともできます。

上記のようにいくつか扱える条件式はいくつかあり、不等式のような記号のことを演算子、といいます。
下記にどのような演算子をつかって比較ができるかがまとめられています。
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Comparison_Operators

次回は、実際にもう少し複雑な条件式を書いていきます。

<<はじめようJavaScript第3回 JavaScriptの文法 変数といろいろな値について  | はじめようJavaScript第5回 JavaScriptの基本機能 条件分岐が書けるif文 その2>>