JavaScript中極易出錯的操作符運算總結

Posted on by

算術運算符

+ – * / % ()

非正常情況1: 有特殊值字面量參與的運算

  • NaN參與的運算：得到的結果都是NaN
  • Infinity參與的運算，視情況而定, 比如:
5/Infinity=0
5%Infinity=5
Infinity%5=NaN
Infinity+5=Infinity
Infinity / Infinity = NaN
Infinity - Infinity = NAN
Infinity % Infinity = NAN

工作中並不會使用特殊值運算，沒有實際應用的意義，但是要瞭解，以防面試遇到

非正常情況2: 其他類型的數據參與數學運算。

有字符串參與的 + 運算(包括隻有符號一邊有字符的情況)：+ 號變為連字符將前後連接成整體字符串。

例如:

        var a = 3 - "36" % 5 + "2" - 2
        console.log(a)
        var b = "36" % 5
        console.log(b)
        var c = 3 - "36" % 5 + "2"
        console.log(c)

輸出:

20
1
22

隱式轉換：除瞭字符串參與的 + 運算，其他情況下，所有其他數據類型參與數學運算時，計算機暗中將其他數據類型先自動轉換成數字類型，再參與運算，這個過程中不需要使用parseInt()、Number() 等方法，過程是暗中進行，這就是一個隱式轉換的過程。

隱式轉換

其他的數據類型會隱式轉換為數字類型：

  • 對應數字：純數字字符串會轉為對應的數字”123”→123
  • 轉換為1： true
  • 轉換為0：false、null、 “”空字符串、空白字符串
  • 轉換為NaN：undefined、非空非純數字字符串

比較運算符

也叫作關系運算符。一個 比較運算符 comparison operator 比較它的操作數並返回一個佈爾類型值。運算結果要麼是true，要麼是false。

>  大於

<  小於

>= 大於等於

<= 小於等於

== 相等，隻判斷值大小是否相等，不判斷數據類型

!= 不等，與相等完全相反

===全等，不光判斷值相等，還要判斷數據類型相等

!==不全等，與全等於完全相反

非正常情況1: 特殊值參與比較運算

  • NaN參與：不等於和不全等於結果是 true，其他的都得到 false
  • Infinity參與的運算，視情況而定, 比如:
Infinity == Infinity ->True
Infinity === Infinity ->True
Infinity > Infinity ->False
Infinity >= Infinity ->True

非正常情況2: 其他數據類型參與比較運算（排除字符串與字符串的比較

其他數據類型也會隱式轉換為數字參與比較。

“123”→123 true→1 false→0 null→0 undefined→NaN “”→0 “abc”→NaN

null 的判斷比較特殊：null 與 0 判斷時，相等判斷為 false，>= 和 <= 判斷為 true

null == undefined -> True

非正常情況3: 字符串與字符串比較

不會發生隱式轉換為數字，而是比較兩個字符串的 Unicode 編碼順序

字符編碼順序：從前往後 0-9，A-Z，a-z，前面的小於後面的

比較時，不關心兩個字符串的長度，從第一個字符開始比較，依次往後順延比較，直到比較出大小，就不再往後比較

邏輯運算符

邏輯運算符常用於佈爾類型值之間; 當操作數都是佈爾值時，返回值也是佈爾值

&&      邏輯與運算符且
||      邏輯或運算符
!       邏輯非運算符

非正常情況

  • 除瞭佈爾類型的值之外，其他數據類型的值也可以參與邏輯運算。運算過程中需要將操作數隱式轉換為佈爾類型的值，參與判斷計算，最終運算結果還是原來的某個位置的數據.
  • 並不是所有邏輯運算返回結果都是佈爾值，其他數據參與得到的就是數據本身

隱式轉換為佈爾值的規律

  • 轉為false：NaN、0、 “”空字符串、null、undefined
  • 轉為true：非0 非NaN數字、非空字符串

當它們用於非佈爾值的時候，返回值就可能是非佈爾值。其實這種運算非常簡單：

  • (邏輯與 a && b ) 如果a能被轉換為false，那麼返回a；否則，返回b
  • (邏輯或 a || b ) 如果a能被轉換為true，那麼返回a；否則，返回b

邏輯運算符運算順序

綜合運算順序：非、與、或

賦值運算符

=   等於
+=  加等於
-=  減等於
*=  乘等於
/=  除等於
%=  取餘等於
++  遞加
—  遞減

一元運算符

++ — !

++ 或 — 符號可以寫在變量前和變量後面，位置不同可能導致程序運行結果不同

以 ++ 為例：

  • a++: ++ 符號在變量之後，a++ 在參與程序過程中使用的原始沒有加 1 的值，使用完後第二次用 a 變量時，a 用的就是加 1 後的新值。先參與，後自加.
  • ++a：++ 符號在變量之前，++a 在參與過程中整體就使用 a 加 1 之後的新值，使用完後第二次用 a 變量時，a 用的也是加 1 的新值。先自加，後參與

例1

var a = 3; 
var b = a++; 
var c = ++a;
console.log(a,b,c)

輸出:

5 3 5

例2

輸出:

運算優先級

優先級從高到底:

1. () 優先級最高

2. 一元運算符 ++ — !

3. 算數運算符 先* / % 後 + –

4. 關系運算符 > >= < <=

5. 相等運算符 == != === !==

6. 邏輯運算符 先&& 後||

7. 賦值運算符

例

var a = 4; var num = 1 * (2 + 3) && a++ || 5 > 6 && 7 < 8 || !9; 
console.log(num)

輸出:

4

總結

到此這篇關於JavaScript中極易出錯的操作符運算總結的文章就介紹到這瞭,更多相關JavaScript操作符運算內容請搜索WalkonNet以前的文章或繼續瀏覽下面的相關文章希望大傢以後多多支持WalkonNet！

推薦閱讀：