else if書き方何もしない方法省略とは

今回はJavaScriptのif文条件に合わないときに使う「else」と条件文を複数にする「else if」の書き方と「何もしない」方法や省略方法などを解説します。!=を使う方法もありますがelseを利用して処理したほうが簡単です。

else

if～～～elseの記述方法です。elseその他って感じ…

if(条件式){ 処理１ }else{ 処理2  }

条件式であっていれば処理1を実行します。それ以外は処理2を実行します。

「let txt = document.getElementById(“tx”).value;」の部分はテキストボックスの値を変数「txt」に格納していますが、書式はDOMの項目（別ページ）で解説します。

<input type="text" id="tx"><br>
<button onclick="ck()">ボタン</button>
<script>
let hikaku = 5;
function ck() {
//テキストボックスの値を変数に格納
let txt = document.getElementById("tx").value;
//変数hikakuとテキストボックスに入力された値を比較
if (hikaku == txt) {
alert(hikaku + "と同じ数字が入力されました。");
} else {
alert(hikaku + "以外の数字が入力されました。");
}
}
</script>

サンプル(別窓）

テキストボックスに5が入力されると最初のif文で処理が実行されてアラートが表示されます。テキストボックスに5以外の数字が入力されるとelseの部分の処理が実行されてアラートが表示されます。

else if

elseのほかにelse ifもあります、こちらは「その他こっちの条件は～～～」みたいな

下のサンプルではif文で処理したあとさらにelse ifの部分でも処理を行います。

<input type="text" id="tx"><br>
<button onclick="ck()">ボタン</button>
<script>
let hikaku = 5;
let num = 2;
function ck() {
//テキストボックスの値を変数に格納
let txt = document.getElementById("tx").value;
//変数hikakuとテキストボックスに入力された値を比較
if (hikaku >= txt) {
alert(hikaku + "以下の数字が入力されました。");
} else if (num <= txt) {
alert(num + "以上の数字が入力されました。");
}
}
</script>

サンプル(別窓）

テキストボックスに5以下の数字が入力されると最初のif文で処理が実行されてアラートが表示されます。その他の数字が入ると「2以上の数字が入力されました。」のアラートが表示されます。上記サンプルは冗長ですが学習なので

何もしない

プログラミングなのに「何もしない」っていうのは変な感じがしますが、結構使いますので記載します。

<input type="text" id="tx"><br>
<button onclick="ck()">ボタン</button>
<script>
let hikaku = 5;
function ck() {
//テキストボックスの値を変数に格納
let txt = document.getElementById("tx").value;
//変数hikakuとテキストボックスに入力された値を比較
if (hikaku > txt) {
//何もしない
} else {
alert(hikaku + "以上の数字が入力されました。");
}
}
</script>

サンプル(別窓）

上記のサンプルではテキストボックスに5以下の数字が入力されるとなにもおこりません。このような使いかたはよく出てきます。

省略

if文と同じようにelseの場合も処理が1行なら中括弧を省略することができます。

else 処理

だいたいこんなもんです。詳細についてはその都度解説します。

 

以上でおしまいです。

お疲れ様でした！

前のページ　 INDEX　 次のページ

ホーム