演算子 (オペレーター)

今度は演算子について調べましょうね。

四則演算子については[変数]にあります。

論理演算子

論理演算子は真と偽のバリューを持ってる演算子です。

種類

AND(&,&&)

OR(|,||)

XOR(^)

AND演算子は全てのバリューが真の時に真を返します。

OR演算子はバリューの中で一つでも真だ場合真を返します。

XOR演算子は互いにバリューが違う時真を返し、互いにバリューが同じだったら偽を返します。真のバリューはtrue (1)、偽のバリューはfalse (0) です。

下の表を見て下さい。

変数Aのバリュ	変数Bのバリュ	AND (&, &&)	OR (\|, \|\|)	XOR(^)
0 (false)	0 (false)	0 (false)	0 (false)	0 (false)
0 (false)	1 (true)	0 (false)	1 (true)	1 (true)
1 (true)	0 (false)	0 (false)	1 (true)	1 (true)
1 (true)	1 (true)	1 (true)	1 (true)	0 (false)

上の表を見るとAが偽、Bが偽の時　AND演算子は　偽を返します、OR演算子も　偽、 XOR演算子も偽を返すんだねと理解して下さい。

理由は二つも真の時AND演算子は真を返し、OR演算子は一つもでも真なら真を返し、XOR演算子は互いにバリューが違う時だけ真を返しますからですね。

増減演算子

増減演算子には２個の種類があります。

増加と減少があります。
増加は++,減少は--です。

++は1を増加、--は1を減少します。

aという変数があったと言って

前にあるか後ろにあるかによって意味は違います。

例え、

++a, a++, --a, a--

上のよう使いますが、

++aはまず、自分のバリューを1増加して次を同います。

a++ は 먼저 다른 연산을 한후 자신을 1 증가 시킵니다.

a++はまず次を行なってから自分のバリューを1減少します。

では、ソースで見てみましょう。

<!DOCTYPE html>
<html>
<head>
<title>coreasur - JavaScript</title>
<script>
    a = 10;
    b = ++a;
    document.write(b);
</script>
</head>
<body>
</body>
</html>

結果

ソース説明

変数aに10を代入した後、変数に++aを代入します。

++が前にあるとまず、自分のバリューを１増加して次を行います。つまり、++aの時は

変数aのバリューが10だったのでまず、自分のバリューを１増加し、バリューが11になります。
その後、11がバリューが変数bに代入されます。

では、今度は++が変数aの後ろにあるとどうなるかみてみましょう。

<!DOCTYPE html>
<html>
<head>
<title>coreasur - JavaScript</title>
<script>
    a = 10;
    b = a++;
    document.write(b);
</script>
</head>
<body>
</body>
</html>

結果

ソース説明

上のソースを見ると　変数aに10を代入したあと　変数bにa++を代入します。

++が後ろにあるとまず、次の演算をしてから自分のバリューに1を増加します。
つまり、a++の時

aのバリューな10が関数bに代入されてから、自分のバリューに1を増加します。なので

結果は10になります。

論理否定 !

論理否定 ! 演算子は true(真)を false(偽)に。。逆に false(偽)は true(真)に　変わります。

では、次のソースをみてから確認しましょう。

<!DOCTYPE html>
<html>
<head>
<title>coreasur - JavaScript</title>
<script>
    a = true;
    b = !a;
    document.write(b);
</script>
</head>
<body>
</body>
</html>

結果

ソース説明

変数aにtrueを代入しました。文字列じゃないんで""は使いません。

そして変数bに !aを代入しました。　!は反対のバリューに変更するんで、trueだったバリューがfalseに変更されてから代入されます。
なので変数bのバリューはfalseになります。

関係演算子

関係演算子の秋類は

記号	意味
<	大きい
<=	同じまたは大きい
>	小さい
>	同じまたは小さい
== または　===	同じ
!=　または　!==	同じじゃない

つまり、3　<　4という式があると　falseを返します。

逆に 4 < 3 という式があると真なtrueを返します。

同じ意味の記号で　==と===があります。互いに同じバリューだったらtrue(真)を返します。

同じじゃないといみの !=と !== があります。互いに同じじゃないバリューの場合false(偽)を返します。

==と===の違いはなんでしょうか、そして!=と!==の違いはなんでしょうか。

==は変数のバリューだけ同じだったらtrue(真)を返しますが、===は変数のタイプまで同じであってこそtrue(真)を返します。

!=は変数のバリューが違うとtrue(真)ですが、 !==は変数バリューとタイプまで違うことを確認します。

ではソースで確認しましょう。

<!DOCTYPE html>
<html>
<head>
<title>coreasur - JavaScript</title>
<script>
    document.write("10==1　は　"+(10==1));
    document.write("<br>");
    document.write("<br>");
    document.write("10!=10　は　"+(10!=10));
    document.write("<br>");
    document.write("<br>");
    document.write("20>40　は　"+(20>40));
    document.write("<br>");
    document.write("<br>");
    document.write("20<40　は　"+(20<40));
    document.write("<br>");
    document.write("<br>");
    document.write("50>=40　は　"+(50>=40));
    document.write("<br>");
    document.write("<br>");
    document.write("20<=20　は　"+(20>=20));
    document.write("<br>");
    document.write("<br>");
    document.write("40===40　は　"+(40===40));
    document.write("<br>");
    document.write("<br>");
    document.write("'40'===40　は　"+('40'===40));
    document.write("<br>");
    document.write("<br>");
    document.write("40==40　は　"+(40==40));
    document.write("<br>");
    document.write("<br>");
    document.write("'40'==40　は　"+('40'==40));
    document.write("<br>");
    document.write("<br>");
    document.write("30!==40　は　"+(30!==40));
    document.write("<br>");
    document.write("<br>");
    document.write("'30'!==40　は　"+('30'!==40));
    document.write("<br>");
    document.write("<br>");
    document.write("30!=40　は　"+(30!=40));
    document.write("<br>");
    document.write("<br>");
    document.write("'30'!=40　は　"+('30'!=40));
    document.write("<br>");
    document.write("<br>");
    document.write("30!==40　は　"+('40'!==40));
</script>
</head>
<body>
</body>
</html>

結果

条件演算子

変数 = 条件?true:false;

変数 = 条件?true:false; 条件が trueなら trueを代入し falseなら falseを変数に代入します。

例えば、

number = 10 > 5 ? "number" : "string";

上のコードを見ると10が５より大きいとnumberという文字列をnumber変数に代入し、じゃないとstringという文字列を代入してといういみです。

逆に

number = 10 < 5 ? "number" : "string";

10 < 5がfalse(偽)だったら文字列stringが代入されます。

<!DOCTYPE html>
<html>
<head>
<title>coreasur - JavaScript</title>
<script>
    number = 10　>　5　?　10　:　5;
    document.write(number);

    document.write("<br>");

    number = 10　<　5　?　10　:　5;
    document.write(number);
</script>
</head>
<body>
</body>
</html>

結果

では次の講座へ

演算子 (オペレーター)

論理演算子

種類

増減演算子

ソース説明

ソース説明

論理否定 !

ソース説明

関係演算子

条件演算子

変数 = 条件?true:false;

論理否定 !