DIV CSS 佈局教程網

2.5 運算符
編輯:JavaScript基礎知識     

這一節,我們來介紹JavaScript的運算符。運算符是完成一系列操作的符號,例如兩個數字型數據相加用“+”,相乘用“*”等。

JavaScript的運算符按運算符類型可以分為以下5種:

  • (1)算術運算符;
  • (2)比較運算符;
  • (3)賦值運算符;
  • (4)邏輯運算符;
  • (5)條件運算符;

接下來,我們一一對其進行介紹。

一、算術運算符

算術運算符用於在程序中進行加、減、乘、除等運算。

JavaScript中常用的算術運算符如下:

JavaScript中常用的算術運算符 運算符 描述 示例 + 加 4+6 //返回值10 - 減 7-2 //返回值5 * 乘 2*3 //返回值6 / 除 12/3 //返回值4 % 求余 7%4 //返回值3 ++ 自增 見下面 -- 自減 見下面

初學者注意一下,在JavaScript中,除號不是“÷”,而是“/”,別傻乎乎地用錯了。

1、自增運算符

“++”是自增運算符,它指的是在原來值的基礎上加1,i++表示“i=i+1”。該運算符有2種情況:

(1)i++

“i++”指的是在使用i之後,使i的值加1。

舉例:

 
i=1;
j=i++;

上面執行的結果:j的值為1,i的值為2。

其實上面代碼等價於下面這一段代碼:

 
i=1;
j=i;
i++;

(2)++i

“++i”指的是在使用i之前,先使i的值加1。

舉例:

 
i=1;
j=++i;

上面的執行結果:j的值為2,i的值為2。

其實上面代碼等價於下面這一段代碼:

 
i=1;
i++;
j=i;

2、自減運算符

“--”是自減運算符,它指的是在原來值的基礎上減1,i--表示“i=i-1”。該運算符同樣有2種情況:

(1)i--

(2)--i

舉例:

 
i=6;j=i--;//j的值為6,i的值為5
i=6;j=--i;//j的值為5,i的值為5

舉例:JavaScript算術運算符

在線測試
 
<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">
        var n1=6,n2=7;
        var m1=n1+n2;
        var m2=n1*n2;
        var m3=n1++;
        var m4=--n2;
        document.write("m1="+m1+"<br/>");
        document.write("m2="+m2+"<br/>");
        document.write("m3="+m3+"<br/>");
        document.write("m4="+m4+"<br/>");
    </script>
</head>
<body>
</body>
</html>

在浏覽器預覽效果如下:

二、比較運算符

比較運算符的基本操作過程是:首先對操作數進行比較,該操作數可以是數字也可以是字符串,然後返回一個布爾值true或false。

JavaScript中常用的算術運算符 運算符 描述 示例 < 小於 1<4 //返回true > 大於 2>5 //返回false <= 小於等於 8<=8 //返回true >= 大於等於 3>=5 //返回false == 是否等於 5==6 //返回false != 是否不等於 5!=6 //返回true

在此說明一點,如果比較m和n兩個變量是否相等,“m=n”這是錯誤的,因為“=”表示賦值運算符(我們接下來會講到),應該寫成“m==n”。

舉例:

在線測試
 
<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">
        var age=12;
        document.write("age>20:"+(age>20)+"<br/>");
        document.write("age<20:"+(age<20)+"<br/>");
        document.write("age!=20:"+(age!=20)+"<br/>");
        document.write("age<=20:"+(age<=20)+"<br/>");
    </script>
</head>
<body>
</body>
</html>

在浏覽器預覽效果如下:


分析:

“<br/>”表示換行,當然也可以使用轉義字符“\n”來實現,只不過前一個是使用HTML標簽實現,後面一個使用轉義字符實現。

三、賦值運算符

JavaScript中的賦值運算可以分為2種:簡單賦值運算和復合賦值運算。

簡單賦值運算是將賦值運算符(=)右邊表達式的值保存到左邊的變量中。

復合賦值運算結合了其他操作(如算術運算操作)和賦值操作。

舉例:

 
sum=sum+i;//簡單賦值運算;
sum+=i;//復合賦值運算,等價於sum=sum+i;
JavaScript賦值運算符 運算符 示例 = author="helicopter" += a+=b等價於a=a+b -= a-=b等價於a=a-b *= a*=b等價於a=a*b /= a/=b等價於a=a/b %= a%=b等價於a=a%b &= a&=b等價於a=a&b(&是邏輯與運算) |= a|=b等價於a=a|b(|是邏輯或運算) ^= a^=b等價於a=a^b(^是邏輯異或運算)

對於最後3個,平常不經常用,忽略掉算了。

四、邏輯運算符

邏輯運算符通常用於執行布爾運算,它們常常和比較運算符一起使用來表示復雜比較運算,這些運算涉及的變量通常不止一個,而且常用於if、while和for語句中。

JavaScript中常用的算術運算符 運算符 描述 示例 && 邏輯與,若兩邊表達式的值都為true,則返回true;任意一個值為false,則返回false (8>5)&&(4<6),返回true;(8<5)&&(4<6),返回false || 邏輯或,只有表達式的值都為false,才返回false,其他情況返回true (8<5)||(4<6),返回true;(8<5)&&(4>6),返回false ! 邏輯非,若表達式的值為true,則返回false;若表達式的值為false,則返回true !(9>2),返回false;!(9<2),返回true

舉例:

在線測試
 
<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">
        document.write((8 > 5) && (4 < 6)+"
"); document.write((8 < 5) || (4 < 6)+"
"); document.write(!(9 > 2)); </script> </head> <body> </body> </html>

在浏覽器預覽效果如下:

總結:

(1)true的!為false,false的!為true;

(2)a&&b,a、b全為true時,表達式為true,否則表達式為false;

(3)a||b:a、b全為false時,表達式為false,否則表達式為true;

大家好好琢磨和理解一下,這是比較基礎的東西喔。

五、條件運算符

條件運算符是JavaScript支持的一種特殊的運算符。

語法:

條件 ? 表達式1 : 表達式2;

說明:

如果“條件”為true,則表達式的值使用“表達式1”的值;如果“條件”為false,則表達式的值使用“表達式2”的值。

例如:

 
(x>y)?4*3:5

分析:

如果x的值大於y的值,則上面整個表達式最終的值為“12(由4*3得到)”;如果x的值小於或等於y的值,則上面整個表達式最終的值為“5”。

舉例:

在線測試
 
<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">
        var a=3;
        var b=5
        var c=(a<b)? "正確":"錯誤";
        document.write(c);
    </script>
</head>
<body>
</body>
</html>

在浏覽器預覽效果如下:

這一節還是比較簡單的,大家好好看看就懂了。

疑問

1、比較運算符“= =”與賦值運算符“=”的不同之處在於什麼地方?

在各種運算符中,比較運算符“= =”與賦值運算符“=”是完全不同的。比較運算符“= =”用於比較兩個操作數的值是否相等,並且返回true或false;而賦值運算符“=”用於給操作數賦值。

如果在需要比較兩個表達式的值是否相等的情況下,錯誤的使用賦值運算符“=”,則會將右操作數的值賦給左操作數。

對於比較運算符“= =”與賦值運算符“=”,初學者很容易用混,大家得仔細區分一下。

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