if else javascript 入門

if else javascript 入門

if文もし~なら条件を満たしているか判定しますね。

if

それでは書いていきましょう。

if (条件){
処理
}

<!DOCTYPE html>
<html lang=”ja”>
<head>
<meta charset=”UTF-8″>
<title>sample1</title>

<script type=”text/javascript”>
function helloworld(){

var a = 7;

if (a>6){
alert(a);
}

</script>
</head>
<body>
<form>
<input type=”button” value=”ここをクリック” onClick=”helloworld()”>
</form>

</body>
<html>

実行結果は7です。

簡単ですね。

条件に演算子を使って条件を作っていくのが基本ですね。

以下 以上 未満 超えるには注意してください。

それでは6以下の値だったらどうすればいいのか。

 if else

elseとは他という意味ですね。

if (条件){
処理
}

else{
処理
}

先ほどの文にelseを後ろに追加しました。

<!DOCTYPE html>
<html lang=”ja”>
<head>
<meta charset=”UTF-8″>
<title>sample1</title>

<script type=”text/javascript”>
function helloworld(){
var a = 6;

if (a>6){
alert(a);
}
else{
alert(“aは6以下です”);
}

}
</script>
</head>
<body>
<form>
<input type=”button” value=”ここをクリック” onClick=”helloworld()”>
</form>

</body>
<html>

実行結果はaは6以下です。

6以下とは大雑把な作りですねw

他の条件を付けたいですね。

else if

if (条件){
処理
}

else if (条件){
処理
}

else{
処理
}

とりあえずマイナスか判定してから条件を判定するサンプル

<!DOCTYPE html>
<html lang=”ja”>
<head>
<meta charset=”UTF-8″>
<title>sample1</title>

<script type=”text/javascript”>
function helloworld(){
var a = 7;

if (a<0){
alert(“エラーマイナスの値です”);
}

else if(a>6){
alert(a);

}

else{
alert(“aは6以下です”);
}

}
</script>
</head>
<body>
<form>
<input type=”button” value=”ここをクリック” onClick=”helloworld()”>
</form>

</body>
<html>

実行結果は7です。

ifのネスト

あますオススメしませんがif文を入れ子することができます。

if (条件){

if (条件){
処理
}

else{
処理
}
}

else{
処理
}

ワードプレスの仕様でタブが入ってなくて見にくいとは思います。

例えばaとbを満たしている時とか初心者はこう書いてしますのではないでしょうか?

<!DOCTYPE html>
<html lang=”ja”>
<head>
<meta charset=”UTF-8″>
<title>sample1</title>

<script type=”text/javascript”>
function helloworld(){
var a = 7;
var b = 3;

if (a == 7){
if (b == 3){

alert(“条件を満たしました”);
}

else{
alert(“条件を満たしていません”);
}

}

else{
alert(“条件を満たしていません”);
}

}
</script>
</head>
<body>
<form>
<input type=”button” value=”ここをクリック” onClick=”helloworld()”>
</form>

</body>
<html>

実行結果は条件を満たしましたです。

==で比較しています。

vbでは=でも書けますが普通の言語は代入として判定して条件を満たしてしまいます。

ややこしいですね。

この場合だと論理演算子の&&を使いますね。

<!DOCTYPE html>
<html lang=”ja”>
<head>
<meta charset=”UTF-8″>
<title>sample1</title>

<script type=”text/javascript”>
function helloworld(){
var a = 7;
var b = 3;

if (a == 7 && b ==3){

alert(“条件を満たしました”);

}

else{
alert(“条件を満たしていません”);
}

}
</script>
</head>
<body>
<form>
<input type=”button” value=”ここをクリック” onClick=”helloworld()”>
</form>

</body>
<html>

実行結果は条件を満たしましたです。

他にもあるので色々試してください。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする

Translate »