搜尋
首頁web前端js教程JavaScript高階程式設計(第3版)學習筆記4 js運算子和運算子_基礎知識

在ECMAScript中,有非常丰富的运算符和操作符,在这篇文章中将按通常的分类来稍微整理一下,不过在整理之前,先说明一下:

1、虽然标题是运算符和操作符,然而在我看来并没有多少严格区分的必要,在英文中,貌似也是用一个Operator来表示,所以在下文中我可能会混用。甚至,一些不属于运算符和操作符范畴的,我也整理在这里,只要我觉得必要。

2、对于运算符的优先级,你无需一一牢记——我相信你知道最简单的”先乘除,后加减”,至于其它的,如果你不确定,加上括号好了。在ECMAScript中,优先级相同的从左向右运算。

3、对于一些编程语言通用的运算符,比如常用算术运算符(+-*/),我只会简单的列举一下,不会展开,但是请注意,并不是说这些不重要,相反,这些通用运算符甚至处于一个非常基础的地位,只是我觉得你应该早已经熟悉,没必要在这里花时间强调。

4、那么,这里重点关注什么呢?就是一些在ECMAScript中比较特殊的操作符,或者我认为值得花时间强调的一些地方。

运算符与操作符

类别 操作符  描述 说明
一元操作符 ++  自增1

1、自增(减)有前置和后置两种类型,前置先自增(减)再参与其它运算,后置先参与其它运算再自增(减)。

2、在ES中,自增(减)不仅适用于整数,它们可以作用于任意值,对于不是Number类型的值,会先按前一篇文章中的规则隐式转换为Number,然后再自增(减),此时变量类型也会变成Number类型。

--  自减1
+  一元加 一元加最主要的应用就是将操作数转变为Number类型,相当于调用Number()转换。 
-  一元减 一元减则是在一元加的基础之上再取其相反数。
算术操作符 +  加

1、除了加(+)之外,如果操作数不是Number类型,会自动调用Number()转换为Number类型再进行计算。

2、对于加减(+-),除了作为算术运算符。还可以作为一元操作符(见上)。当然,由于字符串操作中对加号(+)的重载,还可以用于将任意数值(的字符串)相连,这也是第1点中为什么要除了加(+),它在含有非Number类型值时,会将所有操作数转换为字符串相连接。

3、与一般类C语言不同,在ES中,除(/)和取模(%)并不会区分整数和浮点数,比如 5 / 2 = 2.5 而不是2,5.3 % 3 = 2.3 而不是2。

4、任意运算,只要操作数含NaN,结果就是NaN。但并不是结果为NaN就一定有一个操作数为NaN,比如0/0也返回NaN。

5、对于含无穷Infinity的运算,规定比较多,这里就不列举了,可以参考原书,或者自行测试。

-  减
*  乘
/  除
%  取模
逻辑操作符

(布尔操作符)

!  逻辑非

首先将操作数转换为Boolean类型值,然后再取反。可以使用双重非!!将一个数值转换为相应的Boolean值。 

&&  逻辑与

1、当两个操作数相应的Boolean值均为true时,返回true

2、短路:当第一个操作数相应的Boolean值为false时,会直接返回false,不会再计算第二个操作数。这常常被应用在判断一个变量(属性)是否有定义,如:
if(object && object.name && object.name = 'linjisong'){ }
 这里会首先判断object存在,不存在的话就不会解析object.name从而阻止错误的发生,同样,也只有object.name存在,才会去比较这个值。

||  逻辑或

1、当两个操作数相应的Boolean值至少有一个为true时,返回true

2、短路:当第一个操作数相应的Boolean值为true时,会直接返回true,不会再计算第二个操作数。

3、逻辑或,除了用于一般的判断之外,还常常被应用在提供默认值的情况,如:

function Fn(obj){
   obj = obj || {};
}

这里如果调用Fn未传入obj,则会自动给obj赋值为undefined,然后因为undefined的相应Boolean值为false,所以会将一个空对象{}赋值给obj,如果调用传入了obj,则因为任意对象的Boolean值为true,所以就不会取后面的{},从而达到给obj一个默认值{}的效果。

这种方式还被应用在大型JS库的多个相对独立的文件中:
//jsLib
var jsLib;
//file1
(function (jsLib){
   jsLib = jsLib || {};
})(jsLib);

//file2
(function (jsLib){
   jsLib = jsLib || {};
})(jsLib);


使用这种方式,无论先加载哪个文件,都会判断jsLib是否已经定义,如果未定义就提供一个默认值,这样做可以使得相对独立模块可以不用考虑加载顺序。

关系操作符

(比较操作符)

 小于

1、只要有一个操作数是Number类型或Boolean类型值,就将两个操作数转换成Number类型值(如果需要转换)执行数值比较。

2、字符串比较,会逐个比较字符编码值。

3、操作符是对象时,调用valueOf()(如果没有,就调用toString()),再将结果按上面规则比较。

4、任意数和NaN比较返回false。

 小于或等于
>  大于
>=  大于或等于
==  相等

1、相等和不等(==、!=)在比较时,只要有必要,就会隐式类型转换。

2、全等和不全等(===、!==)在比较时,不会转换类型,如果类型不一致,直接为!==。

3、结合1、2,可以知道,a===b则一定有a==b,而a!=b则一定有a!==b。

!=  不等
===  全等
!==  不全等
賦值運算子 =  賦值  
複合算術賦值運算子  算術運算子加上= 對應算術運算符,有 =、-=、*=、/=、%= 
複合位元賦值運算子  位元運算子加= 對應位元運算符,有~=、&=、|=、^=、>=、>>>=
位元運算子 ~  按位非 按位取反,也即回傳反碼
&  按位與 按位對齊,逐位操作,只有兩個操作位均為1才回傳1,否則該位回傳0,最後將所有位操作結果組合回傳
|  按位或 按位對齊,逐位操作,只有兩個操作位均為0才返回0,否則該位返回1,最後將所有位操作結果組合回 
^  按位異或 按位對齊,逐位操作,兩個操作位不相同時返回1,否則該位返回0,最後將所有位操作結果組合返回
 左移 二進位數向左移位,左移不會改變符號位元 
>>  有符號右移 二進位數向右移位,高位以符合位元填入 
>>>  無符號右移 二進制數向右移位,直接右移,對於正數,結果和>>相同,對於負數,會把負數的二進制補碼當成正數的二進制碼處理
字串運算子  字串連接 相當於concat()函數,會先將所有運算元轉換為字串,然後再連接。注意,字串一旦創建就不會變更,執行字串連接時,在後台會有一個中間的連接和銷毀過程,這也是老舊瀏覽器在大量字串連接操作時運行緩慢的原因。
=  字串連接複合 a =b,相當於a=a b。 
物件運算子 .  屬性存取符 簡單的物件屬性存取符。
[]  屬性或(類別)陣列存取 透過[],可以存取名稱是一個變數或含有特殊字元的屬性。
new  呼叫建構子建立物件 傳回一個新建立的對象,在建構函式內部的this被指向這個新建立的物件。
delete  变量、属性删除 删除属性(变量可以看成是全局对象或执行环境的一个属性)。
void   返回undefined。
in  判断属性 对象属性或原型链上的属性。
instanceof  原型判断 比较同一个上下文中的对象是否为另一个对象的原型。
其它操作符 ?:  条件操作符 语法;var value = exp ? trueExp : falseExp。 相当于var value; if(exp){ value = trueExp;}else{value = falseExp;}
,  逗号操作符 主要用于声明多个变量,这也是很多JS库的流行做法。例如:var num1=1,num2=2,num3=3;
()  分组操作符

主要用途:

1、结合逗号操作符用于赋值。例如:var num = (5,1,4,8,0);这里num最后的值为0。

2、转换为表达式。比如eval('('+jsStr+')');又比如:
function fn(){
}//函数声明,不能直接调用
(function fn(){
})();//使用()将函数括起来,便可以直接调用
3、用于调用函数。比如fn();。

typeof  类型操作符

返回一个字符串值:Undefined类型—>'undefined'、Null类型—>'object'、Boolean类型—>'boolean'、Number类型—>‘number'、String—>'string'、内置Function对象的实例—>'function'、其它Object类型—>'object'。(有些浏览器实现略有不同)

說明幾點:

1、這裡的分類並不十分嚴格,例如按位非(~)、邏輯非(!)、delete、void、typeof,都可以算是一元操作符,而自增( )在很多資料中也被歸類為算術操作符之中。我在整理時則主要參考原書分類,也兼顧自然性。

2、加號( )的用法比較靈活,需注意,特別是用於計算時,忽略了其中的字串,會很容易犯錯。

3、typeof一般用來判斷簡單資料類型,如果是物件類型,因為大部分回傳的都是object,沒有多大實際用處,而instanceof的判斷也需要滿足同一個上下文的條件,否則也會出錯,對於物件類別的判斷會在後面講述物件時再詳細說明另一種更為穩健的方法。

4、先看下面的代碼:

複製代碼 代碼如下:

var numVal = 10.00,
strVal = '10',
strObj = new String('10');
console.info(numVal == strVal);//true
console. info(typeof (strVal strObj));//string

第一個輸出的竟然是true,是不是出乎你的意料?在這裡,由於==比較符發生了隱式類型轉換,會將Number類型轉換為String類型,然後Number類型的10.00因為小數點後沒有不是0的數值,會被解析成整數10,從而比較的時候會相等。第二個輸出是string,這其實還是比較容易理解的,strVal是字串,strObj是字串對象,兩者相加,會把對象轉換成字串,所以最終結果也是字串型別。
5、關於符號,重複一下幾個流行的用法(這裡不涉及正規表示式中的用法):
(1)使用一元加號( )轉換為Number型別。
(2)使用雙重邏輯非(!!)轉換為Boolean型別。
(3)使用邏輯與(&&)來偵測物件是否存在並進行後續操作。
(4)使用邏輯或(||)來提供函數參數預設值。
(5)使用分組(())來明確指定為表達式。
(6)使用花括號({})來定義物件字面量,JSON資料格式,程式碼區塊。
(7)使用中括號([])來定義數組字面量,JSON資料格式,存取數組,存取名稱是變數或特殊字元的屬性。
6、關於位元運算,雖然結果不是很直觀,但是運行效率高,也有很多有趣的應用,例如不使用中間變數直接交換兩個數值、判斷奇數和偶數、MD5加密等等,有興趣的朋友可以找相關資料自行研究。
陳述
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
JavaScript是用C編寫的嗎?檢查證據JavaScript是用C編寫的嗎?檢查證據Apr 25, 2025 am 12:15 AM

是的,JavaScript的引擎核心是用C語言編寫的。 1)C語言提供了高效性能和底層控制,適合JavaScript引擎的開發。 2)以V8引擎為例,其核心用C 編寫,結合了C的效率和麵向對象特性。 3)JavaScript引擎的工作原理包括解析、編譯和執行,C語言在這些過程中發揮關鍵作用。

JavaScript的角色:使網絡交互和動態JavaScript的角色:使網絡交互和動態Apr 24, 2025 am 12:12 AM

JavaScript是現代網站的核心,因為它增強了網頁的交互性和動態性。 1)它允許在不刷新頁面的情況下改變內容,2)通過DOMAPI操作網頁,3)支持複雜的交互效果如動畫和拖放,4)優化性能和最佳實踐提高用戶體驗。

C和JavaScript:連接解釋C和JavaScript:連接解釋Apr 23, 2025 am 12:07 AM

C 和JavaScript通過WebAssembly實現互操作性。 1)C 代碼編譯成WebAssembly模塊,引入到JavaScript環境中,增強計算能力。 2)在遊戲開發中,C 處理物理引擎和圖形渲染,JavaScript負責遊戲邏輯和用戶界面。

從網站到應用程序:JavaScript的不同應用從網站到應用程序:JavaScript的不同應用Apr 22, 2025 am 12:02 AM

JavaScript在網站、移動應用、桌面應用和服務器端編程中均有廣泛應用。 1)在網站開發中,JavaScript與HTML、CSS一起操作DOM,實現動態效果,並支持如jQuery、React等框架。 2)通過ReactNative和Ionic,JavaScript用於開發跨平台移動應用。 3)Electron框架使JavaScript能構建桌面應用。 4)Node.js讓JavaScript在服務器端運行,支持高並發請求。

Python vs. JavaScript:比較用例和應用程序Python vs. JavaScript:比較用例和應用程序Apr 21, 2025 am 12:01 AM

Python更適合數據科學和自動化,JavaScript更適合前端和全棧開發。 1.Python在數據科學和機器學習中表現出色,使用NumPy、Pandas等庫進行數據處理和建模。 2.Python在自動化和腳本編寫方面簡潔高效。 3.JavaScript在前端開發中不可或缺,用於構建動態網頁和單頁面應用。 4.JavaScript通過Node.js在後端開發中發揮作用,支持全棧開發。

C/C在JavaScript口譯員和編譯器中的作用C/C在JavaScript口譯員和編譯器中的作用Apr 20, 2025 am 12:01 AM

C和C 在JavaScript引擎中扮演了至关重要的角色,主要用于实现解释器和JIT编译器。1)C 用于解析JavaScript源码并生成抽象语法树。2)C 负责生成和执行字节码。3)C 实现JIT编译器,在运行时优化和编译热点代码,显著提高JavaScript的执行效率。

JavaScript在行動中:現實世界中的示例和項目JavaScript在行動中:現實世界中的示例和項目Apr 19, 2025 am 12:13 AM

JavaScript在現實世界中的應用包括前端和後端開發。 1)通過構建TODO列表應用展示前端應用,涉及DOM操作和事件處理。 2)通過Node.js和Express構建RESTfulAPI展示後端應用。

JavaScript和Web:核心功能和用例JavaScript和Web:核心功能和用例Apr 18, 2025 am 12:19 AM

JavaScript在Web開發中的主要用途包括客戶端交互、表單驗證和異步通信。 1)通過DOM操作實現動態內容更新和用戶交互;2)在用戶提交數據前進行客戶端驗證,提高用戶體驗;3)通過AJAX技術實現與服務器的無刷新通信。

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

SecLists

SecLists

SecLists是最終安全測試人員的伙伴。它是一個包含各種類型清單的集合,這些清單在安全評估過程中經常使用,而且都在一個地方。 SecLists透過方便地提供安全測試人員可能需要的所有列表,幫助提高安全測試的效率和生產力。清單類型包括使用者名稱、密碼、URL、模糊測試有效載荷、敏感資料模式、Web shell等等。測試人員只需將此儲存庫拉到新的測試機上,他就可以存取所需的每種類型的清單。

SublimeText3 Linux新版

SublimeText3 Linux新版

SublimeText3 Linux最新版

DVWA

DVWA

Damn Vulnerable Web App (DVWA) 是一個PHP/MySQL的Web應用程序,非常容易受到攻擊。它的主要目標是成為安全專業人員在合法環境中測試自己的技能和工具的輔助工具,幫助Web開發人員更好地理解保護網路應用程式的過程,並幫助教師/學生在課堂環境中教授/學習Web應用程式安全性。 DVWA的目標是透過簡單直接的介面練習一些最常見的Web漏洞,難度各不相同。請注意,該軟體中

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

強大的PHP整合開發環境

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser是一個安全的瀏覽器環境,安全地進行線上考試。該軟體將任何電腦變成一個安全的工作站。它控制對任何實用工具的訪問,並防止學生使用未經授權的資源。