javascript操作符知識點整理

JerryZou 發布于2019-08-21 14:29 / 3562人閱讀

摘要：中的操作符的不同之處在于，它們能夠適用于很多值，例如字符串數字值布爾值甚至對象。在應用于布爾值時，先將其轉換為再執行加減的操作。布爾值變量變為數值變量。在有一個操作數不是布爾值的情況下，邏輯與操作就不一定返回布爾值。

前言

初學者會覺得操作符的知識很簡單，但是隨著學習的深入會發現很多語句都可以用操作符來簡化，所以深入理解操作符可以幫助你寫出高性能的代碼。這篇文章主要記錄不同操作符所遵循的規則。
javascript的操作符有一元操作符、位操作符、布爾操作符、乘性操作符、加性操作符、關系操作符、相等操作符、條件操作符、賦值操作符。其中值得注意的是，一元操作符和相等操作符都有可能改變操作數的數值類型。js中的操作符的不同之處在于，它們能夠適用于很多值，例如字符串、數字值、布爾值、甚至對象。不過在應用于對象時，相應的操作符都會調用對象的valueOf()方法或者toString()方法來轉換成可以操作的數據類型。

一元操作符

遞增操作符 ++

遞減操作符 --

正數 +

負數 -

遞增和遞減操作符遵循的規則.
1.在應用于包含有效數字的字符串時，先將其轉換為數字值，再執行加減1的操作。字符串變量變成數值變量。
2.在應用于一個不包含有效數字字符的字符串時，將變量的值設置為NaN。字符串變量變成數值變量。
3.在應用于布爾值false/true時，先將其轉換為0再執行加減1的操作。布爾值變量變為數值變量。
4.在應用于浮點數值時，執行加減1的操作。
5.在應用于對象時，先調用對象的valueOf()方法以取得一個可供操作的值，然后對該值應用前面的四條規則。如果結果是NaN，則在調用toSring()方法后再應用前面的規則。對象變量變成數值變量。

var num = 1;
++num;    //2

var num ="12s";
++num;    //NaN
typeof num;    //number

var num = false;
++num;    //1
typeof num;    //number

位操作符

位操作符用于最基本的層次上，我們一般比較少用到。ECMAscript中所有數值都以IEEE-754 64位格式存儲，但是位操作符并不直接操作64位的值，而是先將64位轉換成32位的整數，然后執行操作，最后將結果轉換回64位。這會帶來一個嚴重的副效應，即在對特殊的NaN和Infinity值應用位操作時，兩個值都會被當做0來處理。

按位非 ~

按位與 &

按位或 |

按位異或 ^

左移 <<

有符號右移 >>

無符號右移 >>>

布爾操作

布爾操作的重要性不言而喻。布爾操作用來測試兩個值的關系，如果沒有它們，那么如if...else這類的判斷語句也就無用武之地了。

邏輯非 !

邏輯與 &&

邏輯或 ||

邏輯非(!)

只操作1個操作數，無論操作數是什么數據類型，都返回一個布爾值。邏輯非操作不會改變操作數的數據類型。
邏輯非(!)操作符的規則：
1.如果操作數是一個對象，則返回false。
2.日字旁操作數是一個空字符串，則返回true。
3.如果操作數是一個非空字符串，則返回false。
4.如果操作數值是0，則返回true。
5.如果操作數是任意非0數值（包括Infinity），返回false。
6.如果操作數是null，返回true。
7.如果操作數是NaN,返回true。
8.如果操作數是undefined，返回true。

邏輯與(&&)

邏輯與有兩個操作數，它可以應用于任何類型的操作數，而不僅僅是布爾值。在有一個操作數不是布爾值的情況下，邏輯與操作就不一定返回布爾值。
邏輯與（&&）操作符的規則
1.如果第一個操作數是對象，則返回第二個操作數。
2.如果第二個操作數是對象，則只有在第一個操作數的求值結果為true時才返回這個對象。
3.如果兩個操作數都是對象，則返回第二個操作數。
4.如果有一個操作數時null，則返回null。
5.如果有一個操作數時undefined，則返回undefined。
可見邏輯與是一種短路操作，如果第一個操作數能夠決定結果（如null，undefined），那么就不會對第二個操作數求值。

var a = {};
var b;
a && b;  //undefined

var a = 3;
var b = {};
a && b;  //b

var a = null;
var b = {};
a && b;  //null

邏輯或(||)

邏輯或的操作數有兩個，如果其中有一個操作數不是布爾值，邏輯或也不一定返回布爾值，它遵循的規則如下：
1.如果第一個操作數是對象，則返回第一個操作數；
2.如果第一個操作數求值結果為false，則返回第二個操作數；
3.如果兩個操作數都為對象，則返回第一個操作數；
4.如果兩個操作數都是null，則返回null；
5.如果兩個操作數都是NaN,則返回NaN；
6.如果連個操作數都是undefined，則返回undefined。
可見邏輯或也是一種短路語句，如果第一個操作數的求值結果為true則不會對第二個操作數進行求值。
注意：由以上規則可知，邏輯操作符均不會改變操作數的數據類型。
利用邏輯與來避免為變量賦null或者undefined的值，如下：

var myObject = preferObject || backupObject;

乘性操作符

乘性操作符和其他語言中的乘性操作符用法類似，只不過在操作數為非數值的情況下會執行自動的類型轉換。即參與乘性計算的某個操作數不是數值，會先使用Number()轉型函數將其轉換為數值。但是乘性操作不會改變操作數數值類型。

乘法（＊）

除法（／）

求模（％）

var a = 1;
var b = false;
a*b; //0
typeof b;  //boolean

加性操作符

加性操作符在操作數都為數值的時候執行常規的加減法操作，在為非數值時會有特殊的轉化規則。但是同乘性操作符一樣加性操作符不會改變數值類型。

加法（＋）

減法（－）

加性操作符

加性操作符在有操作數為字符串時遵循以下規則：
1.如果兩個操作數都為字符，則將第二個操作數與第一個操作數拼接起來；
2.如果只有一個操作數是字符串，則將另一個操作數轉換為字符串，然后將兩個字符串拼接起來；

減性操作符

1.如果有一個操作數是字符串，布爾值、null或者undefined，則先調用Number()方法，然后再根據數值減法規則執行減法計算。
2.如果有一個操作數是對象，則調用對象的valueOf()方法取得該對象的數值。如果對象沒有valueOf()方法方法，則調用tostring()方法并將得到的字符串轉換為數值。

關系操作符

小于（<）

大于（>）

小于等于（<=）

大于等于（>=）

相等操作符

相等（==）

不相等（!=）

全等（===）

不全等（!==）

相等和不相等

這組操作符是先轉換再比較，即操作符會改變操作數的數值類型。
1.如果有一個操作數是布爾值，則在比較之前會轉換為數值；
2.一個操作數是字符，另一個是數值，那么在比較相等性之前會將字符串轉換為數值再進行比較；
3.如果一個操作符是對象，另一個不是，則調用valueOf()方法，將得到的結果進行比較。
4.如果兩個都是對象，則比較是否是同一個對象，如果兩個操作數都指向同一個對象，那么認為它們相等。

var a = "3";
var b = 3;
a == b;  //true
typeof a;  //number

var a = {};
var b = {};
a == b;  //false

var a = {};
var b = a;
var c = a;
b == c;  //true

全等和不全等

全等和不全等操作符不會改變操作數的數值類型。

條件操作符

value = boolean_expression ? true_value : false_value

條件操作符會根據boolean_expression的求值結果來決定給變量value賦哪個值，求值為真是賦true_value值，為假時賦false_value值。

賦值操作符

賦值（＝）

乘／賦值（*=）

初／賦值（/=）

模／賦值（%=）

加／賦值（+=）

減／賦值（-=）

左移／賦值（<<=）

無符號右移／賦值（>>>=）

有符號右移／賦值（>>=）

逗號操作符

逗號操作符用于在一條語句中執行多個操作。

var num1=1, num2=2, num3=3;

操作符優先級

云服務器 GPU云服務器 javascript知識點 javascript知識 javascript基本知識 javascript基礎知識

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/87919.html

前端知識點整理

摘要：難怪超過三分之一的開發人員工作需要一些知識。但是隨著行業的飽和，初中級前端就業形勢不容樂觀。整個系列的文章大概有篇左右，從我是如何成為一個前端工程師，到各種前端框架的知識。為什么 call 比 apply 快？這是一個非常有意思的問題。作者會在參數為3個（包含3）以內時，優先使用 call 方法進行事件的處理。而當參數過多（多余3個）時，才考慮使用 apply 方法。這個的原因...

Lowky 2019-08-22 11:22 評論0 收藏0
前端知識點整理

摘要：難怪超過三分之一的開發人員工作需要一些知識。但是隨著行業的飽和，初中級前端就業形勢不容樂觀。整個系列的文章大概有篇左右，從我是如何成為一個前端工程師，到各種前端框架的知識。為什么 call 比 apply 快？這是一個非常有意思的問題。作者會在參數為3個（包含3）以內時，優先使用 call 方法進行事件的處理。而當參數過多（多余3個）時，才考慮使用 apply 方法。這個的原因...

snowLu 2019-08-29 14:05 評論0 收藏0
JavaScript易錯知識點整理

摘要：知識點變量作用域上方的函數作用域中聲明并賦值了，且在之上，所以遵循就近原則輸出等于。上方的函數作用域中被重新賦值，未被重新聲明，且位于之下，所以輸出全局作用域中的。上方利用方法進行對象的深拷貝可以避免源對象被篡改的可能。前言本文是我學習JavaScript過程中收集與整理的一些易錯知識點，將分別從變量作用域，類型比較，this指向，函數參數，閉包問題及對象拷貝與賦值這6個方面進行由...

vincent_xyb 2019-08-22 10:46 評論0 收藏0
JavaScript易錯知識點整理

摘要：知識點變量作用域上方的函數作用域中聲明并賦值了，且在之上，所以遵循就近原則輸出等于。上方的函數作用域中被重新賦值，未被重新聲明，且位于之下，所以輸出全局作用域中的。若執行則會輸出。上方利用方法進行對象的深拷貝可以避免源對象被篡改的可能。前言本文是我學習JavaScript過程中收集與整理的一些易錯知識點，將分別從變量作用域，類型比較，this指向，函數參數，閉包問題及對象拷貝與賦值...

2shou 2019-08-21 11:51 評論0 收藏0
【連載】前端個人文章整理-從基礎到入門

摘要：個人前端文章整理從最開始萌生寫文章的想法，到著手開始寫，再到現在已經一年的時間了，由于工作比較忙，更新緩慢，后面還是會繼更新，現將已經寫好的文章整理一個目錄，方便更多的小伙伴去學習。 showImg(https://segmentfault.com/img/remote/1460000017490740?w=1920&h=1080); 個人前端文章整理從最開始萌生寫文章的想法，到著手...

madthumb 2019-08-23 14:15 評論0 收藏0