hottyです。
javascript入門シリーズも今回で3回目になりました。
第1回目 javascript入門/配列編
第2回目 javascript入門/正規表現編
今回はjavascriptの演算子を紹介します。
早速ですが用途ごとに逆引き形式でjavascript演算子の解説を行っていこうと思います。
目次
計算を行う
算術演算子: +, -, *, /, %, ++, —
算術演算子とは数字の計算に使用される演算子です。
四則演算の解説についてはそのまんまなので省略します。
%
% は割り算を行った結果の「余り」を求めるときに使います。
割り切れる場合は結果は0となります。
10 % 3;
=> 「1」を返します
++
++ はインクリメントです。
インクリメントとは、「1」増えるという意味です。
var a = 1;
a++;
document.write(a);
=> 「2」が表示されます
++ の位置は右でも左でも構いませんが返り値が異なります。
var a = 1; a++; => 「1」が足される前の値を返します。従って返り値は「1」です。 ++a; => 「1」が足された後の値を返します。従って返り値は「2」です。
--
-- はデクリメントです。
デクリメントとは、「1」引くという意味です。使用例はインクリメントと同じなので省略します。やはり位置によって返り値が異なります。
こういう演算の対象(オペランドといいます)が1つしかないような演算子は「単項演算子」と呼ばれています。
変数に値を割り当てる
代入演算子: =, +=, -=, *=, /=, %=
代入演算子は javascriptの変数に値を割り当てるために使用されます。
+
var a = 1;
var b = 2;
var c = a + b;
document.write(c);
=> 「3」が表示されます。
+=
見ての通り算術演算子とセットになった代入演算子です。
「自身に足す」という意味です。
var a = 5;
a += 1;
=> 6を返します。
つまり、
a = a + 5;
という意味ですね。
「-=, *=, /=, %=」 も 「+=」 とまったく同じ要領です。
a -= 1; //=> 「a = a - 1;」と同じです。 a *= 1; //=> 「a = a * 1;」と同じです。 a /= 1; //=> 「a = a / 1;」と同じです。 a %= 1; //=> 「a = a % 1;」と同じです。
文字列を連結する
文字列演算子: +
算術演算子である + ですが、文字と文字をつなぐ 文字列演算子 でもあります。
var name = "hotty"; var greet = "Hello, " + name; document.write(greet); => 「Hello, hotty」と表示されます。 // 数字(Number型)とも連結できます。 var a = "value: " var result = a + 1000; document.write(result); => 「value: 1000」と表示されます。
条件に関する演算子
比較演算子: ==, ===, !=, !==, >, >=, <, <=
比較演算子は、変数や値を比較し 等しいかそうでないか調べるために使用されます。
==, ===
等しいかをチェックします。
等しければ”true”、等しくなければ”false”を返します。
=== は型もチェックします。
var a = "10"; 10 == a; Boolean(10 == a); // あまり意識することはありませんがこういう書き方は Boolean関数の省略形です。 => "true"を返します。 10 === a; => 型が違うので"false"を返します。 10 === +a; => 値も型も一致するので"true"を返します。 このとき変数aはnumber型へキャストされています。
!=, !==
等しくないかをチェックします。
等しくなければ”true”、等しければ”false”を返します。
!== は型もチェックします。
>, >=, <, <=
値が大きいか小さいかの判定です。
論理演算子: !, &&, ||
論理演算子は、論理を決定するために使用されます。
!
if (!a) { } のようなif文をご覧になったことはないでしょうか。!は真偽値を反転させる単項演算です。
!true; => "false"を返します。 !false; => "true"を返します。 !0; => "false"を返します。 !"hotty"; => "true"を返します。 var a = 1; !(a > 1); => "false"を返します。
&&
ANDです。
var a = 1;
var b = 2;
a === 1 && b === 1;
=> aは1ですが bが1ではないので"false"です。
||
ORです。
var a = 1;
var b = 2;
a === 1 || b === 1;
=> aが1なので"true"です。
条件演算子: ? :
「? :」は条件演算子です。3項演算子とも呼ばれます。書式は以下のようになります。
【条件式】 ? 【条件式がtrueだった時の処理】 : 【条件式がfalseだった時の処理】 ;
【条件式】をまず評価してその真偽により行う処理が分岐します。1行if文に近いです。ただしその返り値は分岐した後の処理となります。したがって以下のように書くことができます。
var a = null;
b = (a === null) ? 0 : a ;
// 変数aがnullなら変数bは0となり、そうでなければ変数bは変数aの値となります。
型を調べる
typeof演算子: typeof
「typeof」は型を調べる演算子です。
typeof "a"; => "string"を返します。 typeof 1; => "number" を返します。
オブジェクトからプロパティを削除する
delete演算子: delete
「delete」はオブジェクトからプロパティを削除するための演算子です。
var object = {name: "hotty", hp:50, mp:30, status:"BAD"};
delete object.mp;
=> Object {name: "hotty", hp: 50, status: "BAD"}
変数を数に変換する
単項+演算子: +
「+」は変数を数に変換するために使用されます。
var a = "5"; b = a; => "5"(string) var a = "5"; b = + a; => 5(number)
単項-演算子: –
「-」も同様に変数を数に変換するために使用されます。こちらはキャストされる際に正と負が逆になります。
var a = "5"; b = - a; => -5(number) -"10"; // もちろんオペランドが変数である必要はありません。 => -10(number)
そのほかの演算子
カンマ演算子: ,
「,」はカンマ演算子と呼ばれる演算子です。用途は式を連続で書きたいときに使います。
a = 1, b = 5, c = 10;
document.write(a + b + c);
=> 「16」を返します。
ビット単位の処理を行う
ビット演算子については初心者にはハードルが高いしそれなりに文量があるので次回の記事で扱います。
最後に
「javascript 正規表現」でググると私の書いた記事が上から2番目(2014年11月26日現在)ヒットしますね。社内ブログの中でも上位のPV数らしいです。でも、みなさんがあまり”いいね”や”ツイート”をしてくれないのでこのシリーズもう終わりになるかもしれません。みなさんが”いいね”や”ツイート”をしてくれたら続けられます。|ω・`)チラッ