DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> 詳解JavaScript的表達式與運算符
詳解JavaScript的表達式與運算符
編輯:關於JavaScript     

       JavaScript腳本語言描述了一組用於操作數據值的運算符,包括一元運算符,布爾運算符,算術運算符,關系運算符,三元運算符,位運算符和賦值運算符。
       表達式是JavaScript語言的一個“短語”,包含變量名(或字面量)和運算符。最簡單的表達式時字面量或變量名。當然也有合並簡單的表達式來創建復雜的表達式。
一、一元運算符
(1)遞增++和遞減--

var box1=100; 
++box1;//相當於box=box+1 
document.write("box1="+box1+"<br/>");//輸出box1=101 
var box2=100; 
--box2;//相當於box=box2-1 
document.write("box2="+box2);//輸出box2=99 

前置和後置的區別

var box=100; 
var age=++box;//box先累加1為101,再賦值給age為101 
var height=box++;//box先賦值給height為101,box再累加為102 
document.write("age="+age+"<br/>");//輸出age=101 
document.write("height="+height+"<br/>");//輸出height=101 
document.write("box="+box);//輸出box=102,原因是box經過了兩次累加,所以是102 

       在沒有賦值操作,前置和後置是一樣的。但在賦值操作時,如果遞增或遞減運算符前置,那麼前置的運算符會先累加或累減再賦值,如果是後置運算符則先賦值再累加或累減。
(2)加和減運算符
用於取正或取負運算,也有把數字字符串轉換為數值形式的功能。

var box = "20"; 
document.write(typeof box+"<br/>"); //輸出string 
var age=-box; 
document.write(age+"<br/>");//輸出-20 
document.write(typeof age); //輸出number 

二、算術運算符
       JavaScript語言中規定了五種算術運算符,即+,-,*,/和%(取余)。如果在算術運算符的值不是數值,那麼它會先使用Number()轉型函數將其轉換為數值(隱式轉換)。

var box=100+"100"; 
document.write("box="+box+"<br/>");//輸出100100 
document.write(typeof box);//輸出string 

       這是為什麼呢?JavaScript語言中的做算術運算時,只要其中一個是字符串,那麼結果就會轉換為字符串。相當於字符串連接符,不能再算作是加法算術運算符。

var box="100"-10; 
document.write("box="+box+"<br/>");//輸出90 
var age=5/4; 
document.write("age="+age+"<br/>");//輸出1.25 
var height=("你的年齡是:"+(10+10));//括號強制優先級 
document.write(height);//輸出你的年齡是:20 

       取余

var box=10%3; 
document.write("box="+box);//輸出1 

三、關系運算符
       用於進行比較的運算符稱作為關系運算符:<(小於),>(大於),<=(小於等於),>=(大於等於),==(相對),!=(不等),===(恆等或全等),!==(不全等或不恆等)。關系運算符大多數返回的是一個布爾值。
       和其他運算符一樣,當關系運算符操作非數值時要遵循以下規則:
       1兩個操作符都是數值,則數值比較
       2兩個操作數都是字符串,則比較兩個字符串對應的字符編碼值
       3兩個操作數有一個是數值,則將另一個轉換為數值,在進行數值比較
       4兩個操作數有一個是對象,則先調用value()方法或toString()方法,再用結果比較。

var box1=3>2; 
document.write(box1+"<br/>");//輸出true 
var box2="3">22; 
document.write(box2+"<br/>");//輸出false 
var box3="3">"22"; 
document.write(box3+"<br/>");//輸出true 
var box4="a">"B";//a為97,B為66 
document.write(box4+"<br/>");//輸出true 
var box5= "Blue"<"alpha";//Blue的第一個字母是B,alpha的第一個字母是a,a為97,B為66 
document.write(box5) //輸出true 

       在相等和不等的比較上,如果操作數是非數值,則遵循以下規則:
       1一個操作數是布爾值,則比較之前將其轉換為數值,false轉成0,true轉成1。
       2一個操作數是字符串,則比較之前將其轉成為數值再比較。
       3一個操作數是對象,則先調用value()方法或toString()方法再比較。
       4不需要任何轉換的情況下,null和undefined是相等的
       5一個操作數是NaN,則==返回false,!=返回true,並且NaN和自身不等
       6兩個操作數都是對象,則比較它們是否是同一個對象,如果都指向同一個對象,則返回true,否則返回false
       7在全等和全不等的判斷上,比如值和類型都相等,才返回true,否則返回fasle。

var box1='2'==2; 
document.write(box1+"<br/>");//輸出true,比較的只是數值 
var box2={}=={}; 
document.write(box2+"<br/>");//輸出false,因為比較的是它們的地址,每個新創建對象的引用地址都不同。 
var box3=null==undefined; 
document.write(box3+"<br/>");//輸出true,因為均為空數值 
var box4='2'===2; 
document.write(box4+"<br/>");//輸出false,兩個操作數的數據類型不相等 
var box5=null===undefined; 
document.write(box5);//輸出false,兩個操作數的數據類型不相等 

四邏輯運算符
       JavaScript語言中的邏輯運算符通常作用於布爾值的操作,一般和關系運算符配合使用,有三個邏輯運算符:&&(邏輯與),||(邏輯或)和!(邏輯非)。
       (1)&&表示兩邊都必須是true,才返回true。
       如果兩邊的操作數有一個操作數不是布爾值的情況下,與運算就不一定返回布爾值,此時遵循下面的規則:
       1第一個操作數是對象,則返回第二個操作數
       2第二操作數是對象,則第一個操作數返回true,才返回第二個操作數,否則返回false
       3一個操作數是null,則返回null
       4一個操作數是undefined,則返回undefined
       5如果一個運算數是對象,另一個是 Boolean 值,返回該對象
      邏輯與運算符屬於短路操作,如果有第一個操作數返回的是false,第二個不管是true還是false都返回false。

var box1={}&&(5>4); 
document.write(box1+"<br/>");//輸出true 
var box2=(5>4)&&{}; 
document.write(box2+"<br/>");//輸出[object Object] 
var box3=(3>4)&&{}; 
document.write(box3);//輸出false 

      (2)||表示兩邊有一個是true,就返回true。
      如果兩邊的操作數有一個操作數不是布爾值的情況下,與運算就不一定返回布爾值,此時遵循下面的規則:
      1第一個操作數是對象,則返回第一個個操作數
      2第一個操作數的求值結果為fasle,則返回第二個操作數
      3兩個操作數都是對象,則返回第一個操作數
      4兩個操作數都是null,則返回null
      5兩個操作數都是undefined,則返回undefined
      6兩個操作數都是NaN,則返回NaN
      邏輯或運算符也屬於短路操作,如果有第一個操作數返回的是true,第二個不管是true還是false都返回true。

var box1={}||(5>4); 
document.write(box1+"<br/>");//輸出[object Object] 
var box2=(5>4)||{}; 
document.write(box2+"<br/>");//輸出true 
var box3=(3>4)||{}; 
document.write(box3);//輸出[object Object] 

      (3)!邏輯非運算符可以作用與任何值,無論這個值是什麼數據類型,這個運算符都會返回一個布爾值,它的流程是:先將這個值轉換成布爾值,然後取反,規則如下:
      1操作數是一個對象,返回false
      2操作數是一個空字符串,返回true
      3操作數是一個非空字符串,返回false
      4操作數是數值0,返回true
      5操作數是任意非0數值,返回false
      6操作數是null,返回true
      7操作數是NaN,返回true
      8操作數是undefined,返回true

var box=!{}; 
document.write(box);//輸出false 

五、位運算符
      JavaScript語言中包括了七種位運算符:~(位非),&(位與),|(位或),^(位異或),<<(左移),>>(有符右移號),>>>(無符號右移)
       (1)位非(~)運算把運算數轉換成32位數字,然後把二進制數轉換成它的二進制反碼,最後把二進制數轉換成浮點數。實質上是對數字求負,然後減去1即為所得值。

var box=~25; 
document.write(box);//輸出-26 

       (2)位與(&)運算直接對數字的二進制形式進行運算,然後對上下同一位置的兩個數位進行與運算,只有兩個數位都為1時才得出1,其余的均為0.

var box=25&3; 
document.write(box);//輸出1 

       (3)位或(|)運算也是直接對數字的二進制形式進行計算,然後對上下同一位置的兩個數位進行或運算,只右兩個數位都為0時才得出0,其余的均為1.

var box=25|3; 
document.write(box);//輸出27 

       (4)位異或(^)也是直接對二進制形式進行運算。當只有一個數位存放的是1時,它才返回1。其余的返回0。也就是兩個數位相同時返回0,不同時返回1.

var box=25^3; 
document.write(box);//輸出26 

       (5)左移運算也是對二進制數進行操作,相等於第一個操作數乘以(2的左移位數次冪)的積。

var box=25<<3; 
document.write(box);//25左移3位相當於25乘以(2的3次冪),因此輸出200 

        (6)有符號右移運算也是對二進制數進行操作,相等於第一個操作數除以(2的右移位數次冪)的商。

var box=24>>2; 
document.write(box);//輸出6 

       (7)無符號右移運算也是對二進制數進行操作,對於正數,與有符號右移是相同的結果,但是對於負數,就會所不同。
     

六、賦值運算符
      賦值運算符包括:=(),+=(),-=(),*=(),/=(),%=(),<<=(),>>=(),>>>=()。

var box=100; 
box+=100;//相當於box=box+100 
document.write("box="+box);//輸出box=200 

七、其他運算符
1)、字符串運算符:“+”,它的作用是將兩個字符串想加。規則:只要有一個字符串即可。

var box=100+"10"'; 
document.write("box="+box);//輸出100100 

2)、逗號運算符,可以在一條語句中執行多個操作

var box=100,age=200,height=300; 
document.write("box="+box);//輸出box=100 

3)、三元操作符:

var box=(3>4)?"對":"錯"; 
document.write(box);//輸出錯 

      如果想更詳細的了解ECMAScript運算符的知識,可以訪問JavaScript高級教程中的ECMASscript一元運算符這個系列中有詳細的運算符教程。對於JS的運算符來說,我們可以對比著C++,C#和Java來學,這個還是相當的容易的。

以上就是關於JavaScript的表達式與運算符的全部內容,希望對大家的學習有所幫助。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved