梅ちゃん堂 > JavaScript 入門 > JavaScript の基礎 >
- 演算子 -

式について学びましたので、次は演算子について勉強しましょう。関数、変数、定数、式、 演算子...数学嫌いの人は憂鬱になりますね。でも大丈夫。JavaScript の用語は数学に似ていても、とても楽しいものです。 学校の勉強のような減点主義ではなく、成果の度合いによって評価される加点主義です。

演算子とは、+、-、=、<、> のように、式に置いて演算処理をするための記号のことです。(オペレータと呼ぶこともあります。) 演算子は数も多く、論理演算やビット演算など特殊なものもありますが、ここではなるべく汎用性の高い基本的なものについて述べることにします。

代入

JavaScript では = を使って代入をします。(等価は == で表しますので混同しないように。)

A = 100; // 変数に数値を代入
msg = "こんにちは"; // 変数に文字列を代入
flag = false; // 変数にブール値を代入
B = C; // 変数に変数を代入
B = C + D; // 変数に式(の結果)を代入
flag = isNaN(A); // 変数に関数の戻り値を代入
WN = window.name; // 変数にオブジェクトのプロパティを代入
Member = new Array(); // 変数にオブジェクトを代入

Member[0] = "田中さん"; // 配列要素に値を代入
document.forms[0].elements[0].value = "変更"; // オブジェクトのプロパティに値を代入

上例のように、代入式の左項には変数や配列要素、オブジェクトのプロパティが、 右項には定数、変数、式や関数やメソッド、オブジェクトやオブジェクトのプロパティが入ります。

文字列に使われる演算子

直接、文字列に関係する演算子は + だけです。

MemberName = "田中" + "さん"; // MemberName には "田中さん" と入ります
MemberName += "いらっしゃいませ"; // MemberName には "田中さんいらっしゃいませ" と入ります

通常の代入では左項の値に右項の値が丸ごと入ってしまうのですが、 += を使うと左項の値に右項の値を加えることが出来ます。つまり MemberName += "いらっしゃいませ"; は、 MemberName = MemberName + "いらっしゃいませ"; と同じです。

算術演算子

+(加算)と -(減算)は一般の用法と同じです。乗算には * を、除算には / を使います。 % は剰余を表します。

100 + 300 - 40 // 100 + 300 - 40
100 * 10 / 2 // 100 × 10 ÷ 2
13 % 2 // 13 を 2 で割った剰り、つまり 1

*、/、% は +、- よりも優先順位が上です。例えば 100 + 50 * 2 では 50 * 2 が先に計算され、 答えは 200 となります。100 + 50 を先に計算させたい場合は ( ) を使い、(100 + 50) * 2 とすると、 答えは 300 になります。

数値には上例のように定数のほか、もちろん変数も使えます。符号には +、- が使えます。 実数で使う小数点には .(ドット)を使います。

sum = x * -y / 2;
num = 25.5

代入には、左項の値に右項の値を丸ごと入れる = のほか、算術演算子と = を組み合わせる便利な方法があります。

x += y // x = x + y と同じ
x -= y // x = x - y と同じ
x *= y // x = x * y と同じ
x /= y // x = x / y と同じ
x %= y // x = x % y と同じ

JavaScript にはこのほか、インクリメント(++)とデクリメント(--)という演算子があります。 インクリメント(++)とは変数に数値 1 を加算するという処理で、デクリメント(--)変数に数値 1 を減算するという処理です。 特にループ(繰り返し処理)で数値を1つずつ増やしたり減らしたりしたい場合に使います。

x++ // x = x + 1 と同じ
++x // x = x + 1 と同じ
x-- // x = x - 1 と同じ
--x // x = x - 1 と同じ

Sample 10
ボタンをクリックして下さい。

ソース

<SCRIPT type="text/javascript">
<!--
  start_count = 0;
  count = 0;

  function Count() {
    count++;
    document.test1.counter.value = count;
  }
//-->
</SCRIPT>

<FORM>
<INPUT type="button" value="カウント開始" onClick="start_counter==setInterval('Count()', 500)">
<INPUT type="text" size=10 value="0" name="counter" style="text-align: right;">
</FORM>

インクリメント(++)とデクリメント(--)の書き方に2種類あるのに気づいたと思います。 では両者は全く同じかというと、実は違います。他の変数にインクリメント(++)やデクリメント(--)を代入したときに、 その差が現れます。インクリメント記号(++)やデクリメント記号(--)を変数の後に書くときは、加算処理や減算処理が代入の後に行われるのに反し、 インクリメント記号(++)やデクリメント記号(--)を変数の前に書くときは、加算処理や減算処理が代入の前に行われます。 その結果、代入を受ける変数の値に違いが生じます。

x = 100;
y = 10;
y = x++; // y = x; x = x + 1 と同じ( y は 100 に、x は 101 になる)

x = 100;
y = 10;
y = ++x; // x = x + 1; y = x; と同じ( y は 101 に、x は 101 になる)

デクリメント(--)も同じ発想です。

論理演算子

論理演算子というと難しそうですね。関数計算のできる電卓(Windows の「電卓」でも出来ます)で、 AND、OR、XOR、NOT と表示されているボタンを使うアレです。確かにやさしくはありませんし、そんなに使う機会は少ないと思いますので、 ここでは簡単に述べます。(しかし条件文における論理式は重要ですので押さえておかなければなりません。)

JavaScript で論理演算に使われる演算子は &(論理積 AND)、|(論理和 OR)、^(排他的論理和 XOR)、!(否定 NOT)の4つです。 (但し !(否定 NOT)は JavaScript では論理式にしか使われないようです。)

論理演算は、数字を二進数に直すとよくわかります。二進数の各ビットを比較して、 両方 1 の場合のみ 1 を、それ以外は 0 を返すのが AND 演算、どちらか片方が 1 のとき 1 を、両方が 0 なら 0 を返すのが OR 演算、 どちらか片方のみ 1 のとき 1 を、両方同じビットの時は 0 を返すのが XOR 演算です。

17 & 5 // 10001 & 00101 = 00001 で 1
17 | 5 // 10001 | 00101 = 10101 で 1
17 ^ 5 // 10001 ^ 00101 = 10100 で 20

論理演算でも演算子と = を組み合わせることができます。

x &= y // x = x & y と同じ
x |= y // x = x | y と同じ
x ^= y // x = x ^ y と同じ

論理式の場合、論理積・論理和は記号を2つ続けて使います。

(A == 10) && (B == 5) // A が 10 かつ B が 5(の場合)
(A == 10) || (B == 5) // A が 10 または B が 5(の場合)
!(A == 10) // A が 10 でない(場合)

ビット演算子

論理演算と同様、二進数に直すと良く理解できます。 <<(符号付き左シフト)、>>(符号付き右シフト)、>>>(符号なし右シフト)の3つがあります。ここでは省略します。

比較演算子

2つの値を比較して true または false を返します。

A == B // A が B に等しい
A != B // A が B に等しくない
A > B // A が B より大きい
A >= B // A が B より大きいか等しい
A < B // A が B より小さい
A <= B // A が B より小さいか等しい

二項演算子

与えられた条件が真の場合と偽の場合の処理を対比的に規定する場合に使います。

(条件式) ? (真の場合の処理) : (偽の場合の処理)

(A == 0) ? alert("0 は使えません") : B /= A; // if (A == 0) alert("0 は使えません"); else B /= A; に同じ

演算子の優先順位

演算子には優先順位があり、使うときに注意しなければならない場合があります。 上から優先順位の高い順に示します。

() [] .括弧、ドット
! ~ - ++ --符号反転、インクリメント、デクリメント
* / %乗除算
+ -加減算
<< >> >>>ビットシフト
< <= > >=比較
== !=等不等
&論理積
^排他的論理和
|論理和
&&論理積(論理式)
||論理和(論理式)
? :二項演算
= += -= /= %= <<= >>= >>>= &= ^= \=算術演算
前ページに戻る 前ページに戻る 次ページに進む
Copyright © 2003 梅ちゃん堂. All Rights Reserved