初心者のJavaScript 演算子について [ ARTEMIS ]

「スマホの通話料をスリムに変える電話アプリ「050 plus」

2008.02.07 改

算術演算子 ( +、++、-、--、*、/、% )
論理演算子 ( &&、||、! )
比較演算子 ( ==、!=、>、>=、<、<= )
代入(複合)演算子 ( =、+=、-=、*=、/=、%=、&=、^=、|=、<<=、>>=、>>>= )
ビット演算子 ( &、^、|、~、<<、>>、>>> )
特殊演算子条件(?:)・カンマ・delete・typeof・new・this・void等
演算子の優先順位

演算子って何?

演算子(えんざんし)とは、単純には算数にも出てくる単純な＋、－、×、÷ や＝、＞、＜の様な計算に使うものと同じような物です。ただ、プログラムでは数値の計算をするだけではなく、文字列を繋げたり比較したり、『且つ』の様に論理的な式を作る時などにも使われます。
この演算子は処理として大きな役割を果たします。どういう処理ができるか？どういう条件をつけられるか? 等はどういう演算子がありどういう処理を行うのかを知らないとできない事もあります。難しくはないので、プログラムを組みながらゆっくり覚えて行って下さい。
本来はoperator と言う独立ページにしようかと思っていましたがビギナーズページで演算子を知らないと先に進めませんのでここで解説します。

算術演算子

top

【 + 】加算・連結
加算演算子 足算です
＋で結ばれている値や式が数値型の場合は和を求めます。
result = number1 + number2
resultには加算された和(数値型)がはいります。
左右が両方ともブール値の場合は、その値を数値に変え数値型として加算を行います。 true は 1、false は 0 です。

連結演算子 繋ぎ
＋で結ばれている値や式の中に文字列型が存在すると、数値型の値もすべて
文字列型として解釈した上で、文字列連結を行います。
例は変数の型の自動変換をお読み下さい。
result = number + string 等
resultには連結された文字(文字列型)が入ります。
$xxx = 30 + "20"; // 答えは 3020
-------------------------------------------------------------

【 - 】減算・マイナス符号
減算演算子 引算です
－で結ばれている値や式が数値型の場合は差を求めます。
算数と同じで前にある値から、後ろにある値を引きます。
result = number1 - number2;
resultには number1 から number2 を引いた数(数値型)が入ります。

単項マイナス符号 マイナス符号をつけます
値や変数、式全体に対してマイナス符号をつけた意味になります。
従って、その値(0以外)は元の符号を反転させたことになります。
result = -number;
number の符号を反転。number が元々マイナスなら resultは +(正) になります。

注意事項 number が数値型でない場合
１．＋とは違って、文字列の操作には使えません。
result = "abc" + "ab"; // result は abcab
result = "abc" - "ab"; // result は NaN (nn3・ie3ではエラー)

２．number が文字列でも、数値として解釈できる場合自動数値変換
result = "30" - 20; // result は 10(数値型);

var str = "30"; // 文字列の 30
result = -str; // result は -30(数値型)

型の自動変換で話した、数値型としても認識可能な数字を値として持つ変数を自動変換する場合はこれに該当します。

３． undefined 値を持つ物は NaNかエラーが出ます。
Null値はどうやら 0 として扱われるようです。

４．オブジェクトは文字列に変換されます
文字列に変換された後にその文字列が数値として認識できる場合は２の扱いで、数値変換されます。
var ary1 = new Array("10"); // ary の値は文字列にすると 10 となります
result1 = -ary1; // result1 は -10(数値)

var ary2 = new Array("10","20"); // ary の値は『 10,20 』になります。
result2 = -ary2; // 10,20 のカンマが読み取れず nan になります。

５．boolean型は、数値型に変換されます
boolean型の値 true は 1、false は 0 です。

こことは関係ありませんが値の真偽評価の場合、0は false、1または数値ありは true として扱われる決りがあります。

【 * 】乗算
* の左右の数値の積を求めます。掛け算です。
result = number1 * number2;
きちんと調べてませんが積が17桁までは正確のようです。
一定桁数を越えると普通の10進数表記ではなくなります。

基本的に number は数値型でなければなりません。型の自動変換にも書いたように、数値として認識が可能な値の場合は数値として扱われる場合があります。
numberの型によって、nan 又はエラーになりますので明確な数値型への変更をする事でエラーは防げます。

【 / 】除算
/ の左右の数値の除算(左/右)結果を求めます。端数の場合は小数まで。
result = number1/number2;
javascript自体での決り? 私の環境では、ie4、nn3、nn4.5 共に dotを含めた 18文字(桁)まで表示されました。
result1= 10/3; // 商 3.3333333333333335
result2 = 100000/3; // 商 33333.333333333336

いわゆる割算の商 (整数部分)を求めるには。parseInt() を使い
result = parseInt(number1/number2); と書きます。
result = parseInt(10/3); // resultの値は 3;

型は乗算と同じく気をつけて下さい。

【 % 】剰余
/ の左右の数値の剰余、つまり割った余りを求めます。
左割る右の余りしか求められません。
result = number1 % number2;

例：$aaa 割る $bbb の商は $xxx で余りは $zzz です。
$xxx = parseInt($aaa/$bbb);
$zzz = $aaa % $bbb; 又は $zzz = $zzz - ($bbb*$xxx)

よく使うのが偶数なら？奇数なら？
if($aaa%2 == 0){ }
これで『$aaaが 0か偶数の場合は』と言う事になります。

【 ++ 】インクリメント
++ をつけた変数の値(自分自身) が１だけ増加します。
++ をつける場所によって、ほんの少し意味が違います。
++ を付けるだけで 1増加と言う式として考えられます。
前に付ける
インクリメントを前に付けると、式が評価(実行)される前に値を 1 増やします。
i = 0;
xxx = ++i;
yyy = i;
この場合 xxx に代入される時に i に 1 加算されてから代入されます。
結果は、 xxx、yyy 共に 1 の値を持つ事になります。

後ろに付ける
インクリメントを後ろに付けると、式が評価された後に値を１増やします。
i = 0;
xxx = i++;
yyy = i;
この場合は xxx に代入された後に i に1 加算されます。
従って、yyyに代入される時には i は 1 になっています。
結果は、xxxが0、yyy が1 です。

よく使われる使い方では、代入ではなく単独で使ったりします。
単独の場合は i++ でも ++i でもどちらでも問題ありません。

var i = 0;
function doroop(){
    if( i < 10 ){
        実行文
        i++;
        doroop();
    }else{ i=0; donext(); }
}

解説：
doroop() と言う関数が呼出されると if文で、i が 10 未満なら実行文が実行されそのあとで iがインクリメントされています。次に、doroop()自分自身をまた呼出しています。
何度か繰り返されると i が 10 になります。 10になるとif文ではじかれて、else文の内容を実行します。ここでは i を０に初期化して donext()と言う関数へ処理を移動しています。

さて、この関数 doroop() でインクリメントされている場所が if条件文の中だったら?
if( i++ < 10)
if( ++i < 10)
この括弧内の式の評価がされる時にインクリメントされている i の値は違いますね? これで繰り返しの回数が違いますね？微妙な違いをうまく使い分けてみて下さい。

多分書き忘れていると思いますが、型についてですがインクリメント・デクリメントする変数には数値として認識が可能な文字列なり数値なりが事前に入っている必要があります。数値型と認識できないと nanになってしまいます。

【 -- 】デクリメント
-- をつけた変数の値(自分自身) が１だけ減少します。
-- をつける場所によって、ほんの少し意味が違います。
-- を付けるだけで 1減少と言う式として考えられます。

もうおわかりと思いますが、デクリメントの使い方はインクリメントと同じです。ただ、値が減少する、と言う事です。

論理演算子

top

【 && 】論理 and
&& の左右の値や式を論理評価し、両方が真(true)なら真(true)を返します。両方が真でない場合は偽(false) を返します。
result = expression1 && expression2
expression1 と 2 が両方真の時だけ result は真。
(expressionは値や式など)
こう書くと難しく感じますので、もっとも使われる場所 if文を使って説明します。
if( 条件 ){ aステートメント }は
条件が真の場合aステートメントを実行します。
日本語で書くともし～なら aステートメントを実行です。

条件文で && を使うと言う事はこの条件を2重条件にすると言う事になります。
2つの条件を両方満たした場合・・・・と言う書き方をします。

if( ($xxx > 0) && ($xxx % 2 == 0) ){
     alert('正の偶数です');
}

さて、前提として変数$xxx に数字を受け取りそれを評価すると言う事です。まず && の左の式で正(+)の数である事をチェック、右の式で 2で割って余りが無い事をチェック。この両方が満たされた場合、alert() が実行されます。
どちらかの条件が成立しない場合は alert() は実行されません。
if文で使われる場合は && は『～且つ～』と言う事になります。ちなみに2項の論理andとは限らず、a && b && c の様な事も可能です。

expression部分の式や変数の真偽評価の仕方ですが
オブジェクトの場合は、すべて真 (true) となります。
文字列は、長さ 0 の文字列(空)の場合のみ偽 (false) となります。
null および undefined は、偽 (false) となります。
数値は、0 の場合のみ偽 (false) となります。
例えば、 if( $xxx && $yyy) { } と言う条件がある場合 $xxx、$yyyはユーザーから入力文字を受け取る変数とします。空文字はfalseになりますから、どちらか一方でも空なら受け付けませんよ、と言う使い方になりますね?
アドバイス?：
if(a & b & c ・・・・) の場合 aが先に評価されるます。振るい落しをする場合 a に真になる確率の低い物や大前提となる物を持ってくれば、aが偽の時点で if条件が不成立になりb、cは処理されません。従って、無駄なく処理が早く進みます。

【 || 】論理 or
|| の左右の値や式を論理評価し、両方が真(true) または、どちらか片方でも真(true)なら真(true) を返します。
result = expression1 || expression2;
expression1 と２のどちらか一方でも真なら resultは真。

これも if文などでの条件でよく使われます。

var $navi = navigator.appName.substring(0,9);
if($navi == 'microsoft' || $navi == 'netscape'){ alert('ok') }

この場合は、ブラウザのappNameプロパティの値の 0文字から8文字目まで取り出しその値が、microsoft または、netscape なら alert() を実行します。どちらかのブラウザであれば良いと言う事です。
if文は『～または～なら』と言う意味になりますね。
expressionの型違いの真偽評価の仕方は&&と同じです。
2項以上の評価も a || b || c //aまたはbまたはc。

アドバイス?：
if(a || b || c ・・・) の場合 aが先に評価されますので a に真になる確率の高い物、或いは絶対条件を持ってくれば、aが真の時点で if条件が成立しb、cの処理は行われませんので処理がはやく進みます。

【 ! 】論理 not
! のついた変数や式を論理評価して、その論理否定を返します。
result = !expression;
expression が真なら result は偽、偽なら真となります。

if文などでよく使われます。

var $navi = navigator.appName.substring(0,9);

if( $navi == 'microsoft' ){ alert('msie') }        // sample1
if( !($navi == 'microsoft') ){ alert('msie以外') } // sample2
if($navi != 'microsoft'){ alert('msie以外') } // sample3

if( 条件 ){ ステートメント } と言う物はこの条件が成立(真)すればステートメントを実行します。 sample1 の場合、$navi == 'microsoft' が成立するとステートメントを実行しています。 sample2の場合、$navi == 'microsoft' これが成立しないで偽の場合 ! 演算子により条件が true になります。
さて sample2では何に対して ! を付けるのかを明確にする為に $navi == 'microsoft' を括弧で囲み、この式全体の結果に対して ! をつけて論理否定しています。 ie4やnn4などでは、括弧を付けないで !$navi == 'microsoft' でエラーは出ないかもしれませんが nn3ではエラーになるので、どの式に対して ! を付けるのかを明確にして下さい。
! は値や式から選られる最終的な値に対して、論理否定を行います。
sample3は後述しています。
さて値や式の結果の型についてですが、
例えば文字列型変数の場合は、それが空であれば偽としその論理否定で真となります。 if(!文字列変数)の場合文字列が空の場合にステートメントを実行できます。 undefined または null の場合はその値が偽として扱われ ! を付ける事で真となる場合があるようです。オブジェクトは文字列に変換され、とms jscriptリファレンスには書いてありましたが私の行った実験ではどうもうまく行かないようです。数値型に!を付けた結果は、0 の場合は true となり、0以外の場合は false となります。

また、明確にtrueかfalseの値を欲しい時に使う事もあります。

$aaa = document.all;
これは$aaaに、Netscape系では undefined、IEではオブジェクトがはいります。
$aaa を真偽型の変数として定義したい場合
$aaa = !!document.all;
とする事で、$aaaには Netscpaeではfalse、IEではtrue が入ります。
2重でnot,not してその値を取り出してるわけです。
こういった使い方が必要になるケースもあります。

比較演算子

top

【 == 】等価演算子
演算子の左右の値や式を比較した結果をブール値で返す。
expression1 == expression2 ;
この左右の値が等しければ真(true)、等しくなければ偽(false)を返します。
基本的には、expression1が比較対象、expression2が参照する値です。
expresstion1を 2と比べた時に・・・・・とでも言えば良いのでしょうか?
if文で使うのであれば『もし、等しければ?』という条件文になります。

expression は値や式であるが、左右の型が違う場合自動変換が行われます。

a: if( navigator.userAgent.charAt(8) == 4){ }
b: if( document.forms[0].elements[0].value == 1 ) { }

a: と b: で比較している値 4 と 1 は本来 "4"、"1" とするのが意味としては正確ですね？フォームやオブジェクトのプロパティ等から得られた物は文字列になりますので文字列として処理すべきですが、型の自動変換が行われているので数値として比較されています。

c: はブール型の値として true を持っているか? つまりは真であるか?と言う問いかけと同じ事です。ちなみに if(条件)文は条件が真なら～と言う事ですので if( $agree == true){ } は if($agree){ } と同じ事になります。

d: は null値であるか？をチェックしています。
e :は null値を持つ変数と undefiend値を持つ変数を比較しています。しかし、これは真(等しい)になります。 null値に関しては、nullとundefinedと同じとして扱われます。

f: は netscapeでは成り立つと思います。netscapeの場合は変数が undefinedの場合 undefinedと等しいと評価されますが、ie4では undefiend と言う状態であって undefinedと言う値ではない、、かもしれません。実験では無視されました。
その後(確認済みはIE6から)では、成立しています。

g:
var $number = 10;
$string = "abc";
if( ($number*$string) == NaN ){} //成り立ちません

g: は $numberが数値型 $stringが文字列型だと思ってください。数値型に文字列型を掛けると数値型のままでNaNという状態になります。すると NaN == NaN と言う事で成り立つと思うかもしれませんが NaN は特殊なのでこの式では成り立たないと評価されます。
NaNかどうか？を調べるにはisNaN()を使うか文字列に変更してやって文字比較すれば可能です。

g:
var $number = 10;
$string = "abc";
if(isNaN($number*$string)) { }
if( ($number*$string).toString() == 'NaN'){}

こうすれば、式はなりたちます。

この様に『等しい』と言っても、数値であったり文字列であったり、ブール型であったりと様々です。

nn4でjavascriptのランゲージ属性でjavascript1.2 とした場合は型変換は行われず型が違う場合は常に false を返すそうです。(とほほのwww入門から)

もう一つ注意です
a == b == c の様に使う事も可能と言えば可能ですが、これは多分記述者の目的と違う事を意味するかもしれません。この解釈をすると、まず a==b でこれが真か偽かが評価されます。次にこの『結果』とcを比較します。つまり a,b,cがそれぞれ数字の2とします、 a==b は真になります、次にその結果と ==c で比較されますので真==2 となり、これは成立しないので全体は偽となります。つまり、a,b,cが全部同じ値でも a==b==c は偽となるのです。 a == b == true なら式は成り立ちます。でもこれは a==b と同じ意味です。

a,b,c が falseの値を持っていたらどうでしょう? a==b は真(true)、その真==false で偽になります。 a,b,cが true の場合は a==b で真、真==true で真となります。この様に == はイコールではなく比較してその結果を真偽で返すと言う事です。手間を省いたつもりが思わぬミスを招きますので (a==b) && (b==c) と書くべきでしょう。

【 != 】等価演算子
演算子の左右の値や式を比較した結果をブール値で返す。
expression1 != expression2 ;
この左右の値が等しくなければ真(true)、等しければ偽(false)を返します。
基本的には、expression1が比較対象、expression2が参照する値です。
expresstion1を 2と比べた時に・・・・・とでも言えば良いのでしょうか?
if文で使うのであれば『もし、等しなければ?』という条件文になります。

等しいかどうかの評価の仕方は == と全く同じです。
等しくない事が真になるという意味が逆になるわけです。

ちなみに、先に説明している論理not 演算子を使うと
!( expression1 == expression2)
と書くのと同じ事になりますね?

【 > 】関係演算子
演算子の左右の値や式を比較した結果をブール値で返す。
expression1 > expression2 ;
この左の値が右の値より大きければ真(true)、そうでなければ偽(false)を返します。
基本的には、expression1 に比較対象 expression2に参照する値を指定します。
if文で使うのであれば『もし、～より大きければ? 』という表現になります。
算数と同じで、> は等しい場合は認められず、『より大』です。

if( parseInt(navigator.appVersion) > 3 ){ ステートメント }

ブラウザのバージョンが 3より大きければ? ステートメントが実行されます。
ここでの navigator.appVersion と言うプロパティから得られるのは文字列の数字ですが数値として扱われています。

比較係演算子は大きいと言う言葉からわかるように、基本的には数値に対して行われるものだと思ってください。
従って、自動的に数値型への変換が行われます。
変換の結果どちらかが NaN であれば偽(false)を返すしますが、 nn3やie3等は NaN と言う値をとれないので、式の時点でエラーになると思います。
両方とも文字列型の場合はユニコードに置き換えて比較されます。
( 'b' > 'a' ) これは true です。
ユニコードとは文字コードで、各文字のコードが決まっています。 aは97、zは122です。大文字のa は65です。ソート用関数などで使われる事が多いです。
nn4、ie4以上では、charCodeAt()を使ってコードを調べられます。

この様に、数値型に変換できる場合と、両方が文字列と言う場合にこの比較が有効になります。この型に関しては、>、>=、<、<= の関係演算子が同じ方式です。

【 < 】関係演算子
演算子の左右の値や式を比較した結果をブール値で返す。
expression1 < expression2 ;
この左の値が右の値より小さければ真(true)、そうでなければ偽(false)を返します。
基本的には、expression1 に比較対象 expression2に参照する値を指定します。
if文で使うのであれば『もし、小さければ? 』という表現になります。
算数と同じで等しい場合は認められないので『未満』と言う事になります。

if( parseInt(navigator.appVersion) < 4 ){ ステートメント }

ブラウザのバージョンが４未満ならステートメントを実行します。

自動型変換や、数値としての比較は > と同じです。

【 >= 】関係演算子
演算子の左右の値や式を比較した結果をブール値で返す。
expression1 >= expression2 ;
この左の値が右の値と同じかそれより大きければ真(true)、そうでなければ偽(false)を返します。
基本的には、expression1 に比較対象 expression2に参照する値を指定します。
if文で使うのであれば『もし、以上なら? 』という表現になります。
算数の≧と同じで等しい場合も認められます。

if( parseInt(navigator.appVersion) >= 4 ){ ステートメント }

ブラウザのバージョンが４以上ならステートメントを実行します。

自動型変換や、数値としての比較は > と同じです。

【 <= 】関係演算子
演算子の左右の値や式を比較した結果をブール値で返す。
expression1 <= expression2 ;
この左の値が右の値と同じかそれより小さければ真(true)、そうでなければ偽(false)を返します。
基本的には、expression1 に比較対象 expression2に参照する値を指定します。
if文で使うのであれば『もし、以下なら? 』という表現になります。
算数の≦と同じで等しい場合も認められます。

if( parseInt(navigator.appVersion) <= 3 ){ ステートメント }

ブラウザのバージョンが３以下ならステートメントを実行します。

自動型変換や、数値としての比較は > と同じです。

【 === 】識別演算子
これは、nn4.5、ie4以上に用意されている演算子です。
=== は == と同じで等価評価を行います。違うのはその際に型の自動変換が行われない事です。演算子の左右の値が同じ型でなければ等しいとは認められません。つまり、『型まで含めて等しい』場合にのみ真(true)になります。それ以外はすべて偽(false)になります。
評価できる型も == と同じく数値、文字列、ブールなどです。

【 !== 】識別演算子
これも、nn4.5、ie4以上に用意されている演算子です。
!== は != と同じで等価評価を行います。違うのはその際に型の自動変換が行われない事です。演算子の左右の値が同じ型でなければ等しいとは認められません。つまり、『型まで含めて等しくない』場合にのみ真(true)になります。それ以外はすべて偽(false)になります。
評価できる型も == と同じく数値、文字列、ブールなどです。

(複合)代入演算子

top

【 = 】代入演算子
変数に値を代入します。初めて登場する変数の場合 var を使わなくても代入する事で暗黙のグローバル変数宣言が行われます。
variable = expression;
expressionが式の場合はその結果を代入します。
変数の所でも書きましたが、= の左が代入される変数、右が代入される値になります。『右の値を左の変数へ代入』と言う決りです。
a = b = c = 0; の様に複数項でまとめて代入してもかまいません。 = は算数のイコールではなく、『代入する』という意味になります。

【 += 】複合代入加算・連結
+= は左の変数に対して、右の値を追加加算・連結を行います。
variable += expression;
variable と言う変数の値に expression の値を加算・連結して元の variable と言う変数に、上書きしますので variable = variable + expression; と同じ意味になります。
つまりは、追加と言う事ですね。
基本的に + の処理を短縮させた物ですので、加算・連結のどちらになるのか?は + 演算子と同じです。

ちなみにこの複合演算子を使う時に variable は初めて出てくる変数であってはいけません。また同じ意味で var を付けてもいけません。理由はわかると思いますが
variable = variable + expression ですから
variableが見つからないエラーになるせいです。

【 -= 】複合代入減算
-= は左の変数から右の値を減算します。
この式が実行された時点で、variableは減算された値に変わります。
variable -= expression;
variable = variable - expression; と同じ意味になります。
従って型変換やエラーは -演算子の場合と同様になります。
もちろん、使ってない変数や変数宣言var には使えません。

【 *= 】複合代入乗算
*= は左の変数と右の値の積を変数に戻します。
この式が実行された時点で、variableは新たな積で上書きされます。
variable *= expression;
variable = variable * expression; と同じ意味になります。
従って型変換やエラーは *演算子の場合と同様になります。
もちろん、使ってない変数や変数宣言var には使えません。

【 /= 】複合代入除算
/= は左の変数を右の値で除算した物を変数に戻します。
この式が実行された時点で、variableは新たな商(端数は小数)で上書きされます。
variable /= expression;
variable = variable / expression; と同じ意味になります。
従って型変換やエラーは /演算子の場合と同様になります。
もちろん、使ってない変数や変数宣言var には使えません。
この場合基本的に端数も割られ小数値にされてしまうので
いわゆる、割り切れる商部分のみの取りだしには使えないと思います。

【 %= 】演算子
%= は左の変数を右の値で除算した余りを変数に戻します。
この式が実行された時点で、variableは新たな積で上書きされます。
variable %= expression;
variable = variable % expression; と同じ意味になります。
従って型変換やエラーは %演算子の場合と同様になります。
もちろん、使ってない変数や変数宣言var には使えません。

【 &= 】ビットごとの and
&= は左の変数と右の式の値をのビット毎のandを変数に戻します。
variable &= expression; は
variable = variable & expression; と同じ事になります。
ビットに関してはビット演算子をみてください。

【 ^= 】ビットごとのxor
^= は左の変数と右の式の値をのビット毎の排他的理論和?を変数に戻します。
これは両方の値が同じでなければ 1、同じなら 0 と言う事です。
variable ^= expression; は
variable = variable ^ expression; と同じ事になります。
ビットに関してはビット演算子をみてください。

【 |= 】ビットごとの or
|= は左の変数と右の式の値をのビット毎の or を変数に戻します。
variable |= expression; は
variable = variable | expression; と同じ事になります。
ビットに関してはビット演算子をみてください。

【 <<= 】ビットの左シフト
<<= は左の変数のビット化した値を右の値(ビット数)分左にシフトします。
variable <<= expression; は
variable = variable << expression; と同じ事になります。
ビットに関してはビット演算子をみてください。

【 >>= 】ビットの右シフト
>>= は左の変数のビット化した値を右の値(ビット数)分右にシフトします。
この時、variable の符号ビットで頭を埋めるので符号は変わらない。
variable >>= expression; は
variable = variable >> expression; と同じ事になります。
ビットに関してはビット演算子をみてください。

【 >>>= 】演算子
>>>= は左の変数のビット化した値を右の値(ビット数)分右にシフトします。
この時、0 で頭を埋める
variable >>>= expression; は
variable = variable >>> expression; と同じ事になります。
ビットに関してはビット演算子をみてください。

ビット演算子

top

ビット演算子に関して、私は実際プログラムで利用した経験が今の所ありません。私のレベルが低いからでしょう。一応意味は理解していますが。初心者の方も最初から使う事は皆無だと思われますが一応書いておきます。自分で使ってないので、経験的な解説は当然できません。 ms jscript チュートリアルからの言い回しをそのまま使う形になります。

【 & 】ビットごとのand
result = expression1 & expression2;
ビット演算子は、まずexpression1と2を 2進数形式で取り込みます。
0011 & 0110 となる場合、各ビットごとの and つまり、両方が同じなら 1 違えば 0 を返しますので 1010 となります。

【 ^ 】ビットごとの xor
result = expression1 ^ expression2;
ビット演算子は、まずexpression1と2を 2進数形式で取り込みます。
0011 ^ 0110 となる場合、各ビットごとの notイコールつまり、両方が違えば 1 同じなら 0 を返しますので 0101 となります。

【 | 】ビットごとの or
result = expression1 | expression2;
ビット演算子は、まずexpression1と2を 2進数形式で取り込みます。
0011 | 0110 となる場合、各ビットごとの or つまり、片方でも1なら 1 両方0 の場合のみ 0 を返しますので 0111 となります。

【 ~ 】ビットごとの not
result = ~expression;
ビット演算子は、まずexpression1と2を 2進数形式で取り込みます。
各ビットを反転させます。0110 は 1001 となります。

【 << 】左シフト
result = expression1 << expression2;
ビット演算子は、まずexpression1 を 2進数形式で取り込みます。
expression1 の値を expression2で指定されたビット分だけ左にシフトします。 00001110 << 2 となる場合には 2ビット分だけ左シフトされて 00111000 になります。シフトするときは 0 で埋められます。

【 >> 】右シフト
result = expression1 >> expression2;
ビット演算子は、まずexpression1 を 2進数形式で取り込みます。
expression1 の値を expression2で指定されたビット分だけ右にシフトします。 00001110 >> 2 となる場合には 2ビット分だけ右シフトされて 00111000 になります。シフトするときは先頭の符号ビットで埋められます。これにより、符号が変わらない、、、、そうです。

【 >>> 】右シフト
result = expression1 >>> expression2;
ビット演算子は、まずexpression1 を 2進数形式で取り込みます。
expression1 の値を expression2で指定されたビット分だけ右にシフトします。 00001110 >>> 2 となる場合には 2ビット分だけ右シフトされて 00111000 になります。シフトするときは 0 で埋められます。

と言うわけで、ビット演算子については、まともに解説できていません。

特殊演算子

top

【 ?: 】条件演算子
expression ? statement1 : statement2 ;
expression を真偽評価して、
真なら statement1を実行、偽なら statement2が有効になります。

var $navi = parseInt(navigator.appVersion);
var $mes = ($navi >= 4)? "お入りください":"未対応ブラウザでは入れません";

この例では、ブラウザバージョンが４以上なら $mes と言う変数に "お入りください"と言う文字列が代入されます。
これは if(条件){ ステートメント }else{ステートメント}と同じです。
『もし～なら ○○、そうでなければ△△』

var $navi = parseInt(navigator.appVersion);
if($navi >= 4){ $mes = "お入りください";}
else{ $mes = "未対応ブラウザでは入れません";}

一般的には ?: は if文を書き込めない場所であったり、演算子ですので、先ほどの代入式でも使っているように式の中などで使ったりします。短くまとめ上げる方がすっきりする場合には適しています。

単独：
(parseInt(navigator.appVersion) >= 4)? alert("yes"):alert("no");

バージョンによって alert()が実行されます。

イベントハンドラに付けてみる
onclick="(parseInt(navigator.appVersion) >=4)? doenter():alert("4未満は無効");"

通常、イベントハンドラで関数を呼出し、その中でブラウザ別にすれば良い事でもありますがこの場合は、クリックされた時点でブラウザバージョンによってdoenter()関数を呼出すか警告(alert())を出すか決まります。

この様な、式の中で使えるので場合によってはとても便利です。

【 , 】カンマ演算子
expression1 , expression2
expression1、２を順に実行します。
カンマ演算子は、メソッドの()の中などでも使えますが物によっては使えない物もありますので注意してください。

使える例：
document.write("このブラウザは",$navi,"です");
この例は文字列、変数、文字列を順に打出します。
document.write("このブラウザは" + $navi + "です");
この場合は連結した物を打出しています。

使えない例：
alert("ok","お入りください");

メッセージボックスは引数(その関数やメソッドに受け渡される値)の指定が決まっています。 alert(引数)は引数を警告ボックスで表示しますが、引数は１つのみです。
また、prompt()ボックスは prompt("メッセージ","デフォルトメッセージ") として引数の指定のしか難き待っています。
この他にも、そのメソッドの決り事でもともとカンマを使って引数を指定する場合等の決りがある物がありその場合にカンマ演算子は使えません。

【 delete 】削除
ステートメントのようですが、演算子の部類に入る用なのでここに書きます。
オブジェクト、プロパティや配列の要素などを削除します。 delete expression;

var $name = "artemis";
delete $name;

$nameという変数(文字列オブジェクト)を削除しています。この後で $name を参照しようとするとエラーになったりします。 ie4では、グローバル変数に対して delete を行った後に同じ名前のグローバル変数を作ろうとするとエラーになると思います。ローカル変数を deleteした後に、また使う場合は明確に varステートメントを使ってローカル変数宣言を行わないと、エラーになる?ようです。
deleteして作り直す必要はないとは思いますが。。。。

var $list = new array("red","blue","green","yellow","pink","white");
delete $list[2];
//結果 $list は red,blue,,yellow,pink,white

配列は複数の値を持つオブジェクト(変数)で1つめから順に 0,1,2,3・・・・とインデックスがあります。この例では配列のインデックス 2 の要素を削除しています。
削除されるのは要素だけで、そのインデックスの要素が空になるだけです。配列が短くなるわけではありませんので全インデックスはずれていません。要素数も同じままです。

【 typeof 】型調査
これは、変数の型で書きましたが、オブジェクトの型を調べる演算子です。 result = typeof(expression);
resultには型を示す文字列が入ります。
number、string、boolean、object、function、undefined のいずれかになります。

プログラム中でデバッグ(実行テスト)等に使って見てください。

【 void 】戻り値打ち消し
void(expression);
で expression の結果(戻り値)を取得する必要の無い時に使う様です。
例えば、void(関数()) の場合
関数とはある処理をまとめた処理群です。その処理を呼出すと言う事は処理ですからその結果(戻り値)を得ると言う事になります。しかし、得る必要の無い場合にこの void() を使う様です。
例： <a href="javascript:void(changepage())">information</a>
これはアンカーを使ってjavascriptに処理を渡す方法ですがこの場合アンカー側は戻り値を必要としないので、javascriptのchangepage()関数が処理をしてそれで終り。という事になるのだと思います。基本的にJavaScriptは明確な戻り値を要求しない事が多く、本来処理後に return true と書かねばならないはずでも通常は省略されて使われています。
voidを使わなくても、まずエラーにならないと思います。

【 new 】コンストラクタ呼出
new 演算子はオブジェクトのコンストラクタを呼出します。コンストラクタとは、そのオブジェクトの新規作成する雛形(テンプレート) です。通常はコアオブジェクトに対してこの new を使います。この他にも imageオブジェクトやユーザー定義のオブジェクトの場合にコンストラクタを使います。

var $ary = new array();
これは arrayオブジェクト(配列)のコンストラクタを呼出し新規配列 $ary を作成しています。 $aryは配列オブジェクトと言う、複数の値を持ちそのインデックスを持つ事のできるオブジェクトとなります。
var $img = new image();
これはイメージオブジェクトのコンストラクタを呼出し、画像オブジェクトを生成しています。通常画像オブジェクトと言うと、html記述されているimgタグの事になりますがこのコンストラクタで生成された画像オブジェクトは、javascript内での特殊な画像と言う事になります。画像オブジェクトには src などのプロパティがありますが、この新規作成された画像オブジェクトも同様に srcプロパティを持ちます。srcプロパティにファイルを指定すれば、htmlでページが画像を読み込むのと同様に javascriptが画像を読み込みメモリに保存します。
new についはわかりにくいかもしれませんが、特定の場合に出てくるのでこういう時はこうすると言うパターンで覚えてしまって良いでしょう。

【 this 】自身オブジェクト
その使われている場所で、そのオブジェクト自身を指します。(代名詞) もっとも使われるのは、オブジェクト定義する時とフォーム内でフォーム自身を指す時ではないかと思います。
次の例は ms jscriptからの転用です。クラス定義です。オブジェクトの型、コンストラクタです。

function car(color, make, model){
this.color = color;
this.make = make;
this.model = model;
}

良くわからないかもしれませんが、ここではこの関数が受け取る値とそのプロパティの関係を定義しています。この関数がもし関数として実行されてしまうと、ここでの thisはトップオブジェクトのwindowを指してしまいます。従って単にcolor、make、model というグローバル変数を定義した事になってしまいます。そういう使い方の物ではありません。
new 演算子を使ってこれをコンストラクタとして呼び出すと

var $list1 = new car("黒","日産","95年式")

これで、新しいオブジェクト$list1が作られる事になり、this は、その新しいオブジェクト$listを指す事になります。 list1.color として参照されれば this.color つまり、黒と言う値が取り出せます。

ここでは、1つの式に2回 this が出てきています。
this.form.info ではこのフォームのinfoと言う名前のオブジェクトに対してと言う意味です。 this.value はこのinputボックス自体の value の値と言う事です。
this.formがちょっと違うとお思いかもしれませんが、フォームの部品(element)には自分自身(部品)が属しているフォームを指すための elements[].form と言うプロパティを持っていますですから、this.formは自分が属するフォーム(親) を指す意味になっています。

演算子の優先順位

top

演算子には同列に並べられた場合の優先順位があります。
算数でも『掛け割り足し引き』と言う優先があるのと同じです。

基本的には特殊(?:とカンマ以外)＞算術＞比較＞論理＞代入＞?:＞カンマ
大体こんな感じですね。

▲ 高低▼	演算子記号	種類・名前
	[] ()	配列のインデックス、括弧
	++ -- - ~ ! typeof new void delete	インクリメント、デクリメント、マイナス符号、ビットnot、論理not
	* / %	算術( 乗算、除算、剰余 )
	+ - +	算術( 加算、減算、文字列の連結 )
	<< >> >>>	ビットシフト
	< <= > >=	比較( より小さい、以下、より大きい、以上 )
	== != === !==	比較( 等しい、等しくない、識別、非識別 )
	&	ビットごとの and
	^	ビットごとの xor
	\|	ビットごとの or
	&&	論理 and
	\|\|	論理 or
	?:	条件
	= += -= *= /= %= 等	代入、複合代入
	,	カンマ

この表はMS JScriptを参考(ほとんどそのまま?) m(__)m

さて、この表を覚える必要はもちろんありません。感覚的に理解できていればそれでokです。それよりも、括弧を付ける事を心がけてください。
括弧は算数と同じで括弧内から優先して処理します。複数の演算子で結ばれる式を作る場合等は、括弧を付ける事が、エラー回避に役立ちます。

a： $point = 10 * (5 + 3);
b： if( ($point+$bonus) > $highscore ){ };

c：
$navi = navigator.useragent();
if( ($navi.indexof('MSIE') >= 0) && ($navi.charat(8) >= 4 )){ }

a:は必要な括弧です。無いと計算が変わります。b:は不要な括弧です。括弧を付けている為左の式がはっきりわかり、ここで行いたいのは比較である事が一目でわかります。 c:も不要な括弧です、左右の式が長くなる場合等、どこがifに対しての条件なのかわかるように括弧で整理しています。
この様に括弧は、
１．ほんとに必要である場合
２．優先順位が不安な場合
３．整理する場合
に使います。後で見直す時や、他人が見る時は整理されたコーディングをするとかなり楽になります。ただし、括弧が多すぎると今度は、どの括弧が対になっているのかを探すのに苦労します。

←前

次→

専用ページから申し込むと
So-netより高い３万円CB

案ずるより産むが易し
使ってみれば疑問も解決

XREA+ (plus) 206円/月
( お試し7日間 )

CORE SERVER 428円/月
( お試し15日間 )

ロリポップ 270円/月
( お試し期間10日間 )

ヘテムル 1620円/月
( お試し期間15日間 )

さくら 129円/月
( お試し期間2週間 )

無駄な高額ドメイン管理料金払ってませんか？

バリュードメイン
ムームードメイン

2010年で第二世代携帯がサービス終了。ソフトバンクに乗り換えて安くなった人が７割以上います！