第7章
JavaScript表達式與運算符

◎本章教學微視頻：15個　38分鐘

學習指引

JavaScript腳本語言同其他語言一樣，有其自身的表達式和算術運算符。本章將詳細介紹JavaScript的表達式與運算符，主要內容包括賦值表達式與運算符、算術表達式與運算符、比較運算符以及運算符優先級等。

重點導讀

• 掌握常用表達式的使用方法。
• 掌握常用運算符的使用方法。
• 掌握JavaScript運算符的優先級。

7.1　表達式

表達式是用于JavaScript腳本運行時進行運算的式子，可以包含常量、變量、運算符等。表達式類型由運算及參與運算的操作數類型決定，其基本類型包括賦值表達式、算術表達式、布爾表達式和字符串表達式等。

7.1.1　賦值表達式

在JavaScript中，賦值表達式的一般語法形式為：“變量 賦值運算符 表達式”，在計算過程中是按照自右而左結合的。其中，有簡單的賦值表達式，如i=1；也有定義變量時給變量賦初始值的賦值表達式，如var str="Happy JavaScript!"；還有使用比較復雜的賦值運算符連接的賦值表達式，如k+=18。

【例7-1】（實例文件：ch07\Chap7.1.html）賦值表達式的應用示例。

相關的代碼示例請參考Chap7.1.html文件，然后雙擊該文件，在IE瀏覽器里面運行的結果如圖7-1所示。

提示：由于運算符的優先級規定較多并且容易混淆，為提高程序的可讀性，在使用多操作符的運算時，盡量使用括號“()”來保證程序的正常運行。

7.1.2　算術表達式

算術表達式就是用算術運算符連接的JavaScript語句。如“i+j+k;”“20-x;”“a*b;”“j/k;”“sum%2;”等即為合法的算術運算符的表達式。算術運算符的兩邊必須都是數值，若在“+”運算中存在字符或字符串，則該表達式將是字符串表達式，因為JavaScript會自動將數值型數據轉換成字符串型數據。例如，“”好好學習”+i+“天天向上”+j;”表達式將被看作是字符串表達式。

【例7-2】（實例文件：ch07\Chap7.2.html）算術表達式的應用示例。

相關的代碼示例請參考Chap7.2.html文件，然后雙擊該文件，在IE瀏覽器里面運行的結果如圖7-2所示。從運算結果中可以看出，通過算術表達式對字符串和數字進行了加法運算。

7.1.3　布爾表達式

布爾表達式一般用來判斷某個條件或者表達式是否成立，其結果只能為true或false。

【例7-3】（實例文件：ch07\Chap7.3.html）布爾表達式的應用示例。

相關的代碼示例請參考Chap7.3.html文件，然后雙擊該文件，在IE瀏覽器里面運行的結果如圖7-3所示，從上述代碼中可以看出多次使用了布爾表達式進行數值的判斷。

運行該段代碼，在顯示的文本框中輸入2016，單擊“確定”按鈕后，系統先判斷文本框是否為空，再判斷文本框輸入的數值是否合法，最后判斷其是否為閏年并彈出相應的提示框，如圖7-4所示。

同理，如果輸入值為2019，單擊“確定”按鈕，得出的結果如圖7-5所示。

7.1.4　字符串表達式

字符串表達式是操作字符串的JavaScript語句。JavaScript的字符串表達式只能使用“+”與“+=”兩個字符串運算符。如果在同一個表達式中既有數字又有字符串，同時還沒有將字符串轉換成數字的方法，則返回值一定是字符串型。

【例7-4】（實例文件：ch07\Chap7.4.html）字符串表達式的應用示例。

相關的代碼示例請參考Chap7.4.html文件，然后雙擊該文件，在IE瀏覽器里面運行的結果如圖7-6所示。從運算結果中可以看出，一般表達式“4+5+6”，結果為15；而在表達式“4+5+'6'”中，表達式按照從左至右的運算順序，先計算數值4、5的和，結果為9，再計算之后的和轉換成字符串型，與最后的字符串連接，最后得到的結果是字符串“96”。

7.2　運算符

運算符是在表達式中用于進行運算的符號，例如運算符“=”用于賦值、運算符“+”用于把數值加起來，使用運算符可進行算術、賦值、比較、邏輯等各種運算。

7.2.1　運算符概述

運算符用于執行程序代碼運算，會針對一個以上操作數項目來進行運算。例如2+3，其操作數是2和3，而運算符則是“+”。JavaScript的運算符可以分為賦值運算符、算術運算符、比較運算符、邏輯運算符、條件運算符、位運算符、字符串運算符、位操作運算符和移位運算符等。

7.2.2　賦值運算符

賦值運算符是將一個值賦給另一個變量或表達式的符號。最基本的賦值運算符為“=”主要用于將運算符右邊的操作數的值賦給左邊的操作數。

【例7-5】（實例文件：ch07\Chap7.5.html）賦值運算符的應用示例。

相關的代碼示例請參考Chap7.5.html文件，然后雙擊該文件，在IE瀏覽器里面運行的結果如圖7-7所示。

另外，在JavaScript中，賦值運算符還可與算術運算符和位運算符組合，從而產生許多變種。在賦值運算符中，除“=”運算符之外，其他運算符都是先將運算符兩邊的操作數做相關處理，將處理之后的結果賦給運算符左操作符。如操作符“-=”，先將兩個操作數相減，再將結果賦給左操作數。

【例7-6】（實例文件：ch07\Chap7.6.html）賦值運算符的復雜應用示例。

相關的代碼示例請參考Chap7.6.html文件，然后雙擊該文件，在IE瀏覽器里面運行的結果如圖7-8所示。

7.2.3　算術運算符

算術運算符用于各類數值之間的運算，JavaScript的算術運算符包括加（+）、減（-）、乘（*）、除（/）、求余（%）、自增（++）、自減（--）共7種。算術運算符是比較簡單的運算符，也是在實際操作中經常用到的操作符。

【例7-7】（實例文件：ch07\Chap7.7.html）算術運算符的應用示例。

相關的代碼示例請參考Chap7.7.html文件，然后雙擊該文件，在IE瀏覽器里面運行的結果如圖7-9所示。

單擊頁面中的“算術運算”按鈕后，使用JavaScript算術運算符進行相關運算，具體運行結果如圖7-10所示。

提示：算術運算符中需要注意自增與自減運算符。如果++或--運算符在變量后面，執行順序為“先賦值后運算”；如果++或--運算符在變量前面，執行順序則為“先運算后賦值”。

7.2.4　比較運算符

比較運算符在邏輯語句中使用，用于連接操作數組成比較表達式，并對操作符兩邊的操作數進行比較，其結果為邏輯值true或false。

【例7-8】（實例文件：ch07\Chap7.8.html）比較運算符的應用示例。

相關的代碼示例請參考Chap7.8.html文件，然后雙擊該文件，在IE瀏覽器里面運行的結果如圖7-11所示。

注意：在各種運算符中，比較運算符“==”與賦值運算符“=”是完全不同的：運算符“=”是用于給操作數賦值；而運算符“==”則是用于比較兩個操作數的值是否相等。

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

【例7-9】（實例文件：ch07\Chap7.9.html）區別比較運算符和賦值運算符的應用示例。

相關的代碼示例請參考Chap7.9.html文件，然后雙擊該文件，在IE瀏覽器里面運行的結果如圖7-12所示。

從運行結果中可以看出，執行語句“param==15”后返回結果為邏輯值true，然后通過賦值運算符“=”將其賦給變量test1，因此test1最終的結果為true；同理，執行語句“param=15”后返回結果為15并將其賦給變量test2。

7.2.5　邏輯運算符

邏輯運算符用于測定變量或值之間的邏輯，操作數一般是邏輯型數據。在JavaScript中，邏輯運算符包含邏輯與（&&）、邏輯或（||）、邏輯非（!）等。在邏輯與運算中，如果運算符左邊的操作數為false，系統將不再執行運算符右邊的操作數；在邏輯或運算中，如果運算符左邊的操作數為true，系統同樣地不再執行右邊的操作數。

【例7-10】（實例文件：ch07\Chap7.10.html）邏輯運算符的應用示例。

相關的代碼示例請參考Chap7.10.html文件，然后雙擊該文件，在IE瀏覽器里面運行的結果如圖7-13所示。

從運算結果中可以看出，邏輯與、邏輯或是短路運算符。在表達式“(score < 200) && (score = 500)”中，由于條件score<200的結果為false，程序將不再繼續執行“&&”之后的腳本，因此，score的值仍為350；同理，在表達式“(score > 200) || (score = 500)”中，條件 score>200的結果為true，score的值仍然為350。

7.2.6　條件運算符

條件運算符是構造快速條件分支的三目運算符，可以看作是“if…else…”語句的簡寫形式，其語法形式為“邏輯表達式?語句1:語句2;”。如果“?”前的邏輯表達式結果為true，則執行“?”與“:”之間的語句1，否則執行語句2。由于條件運算符構成的表達式帶有一個返回值，因此，可通過其他變量或表達式對其值進行引用。

【例7-11】（實例文件：ch07\Chap7.11.html）條件運算符的應用示例。

相關的代碼示例請參考Chap7.11.html文件，然后雙擊該文件，在IE瀏覽器里面運行的結果如圖7-14所示。

從運算結果中可以看出，首先語句對表達式“x < 10”成立與否進行判斷，結果為false，然后根據判斷結果執行“：”后的表達式“-x”，并通過賦值符號將其賦給變量y，因此變量y最終的結果為-23。

7.2.7　字符串運算符

字符串運算符是對字符串進行操作的符號，一般用于連接字符串。在JavaScript中，字符串連接符“+=”與賦值運算符類似：將兩邊的操作數（字符串）連接起來并將結果賦給左操作數。

【例7-12】（實例文件：ch07\Chap7.12.html）字符串運算符的應用示例。

相關的代碼示例請參考Chap7.12.html文件，然后雙擊該文件，在IE瀏覽器里面運行的結果如圖7-15所示。

7.2.8　位運算符

位運算符是將操作數以二進制為單位進行操作的符號。在進行位運算之前，通常先將操作數轉換為二進制整數，再進行相應的運算，最后的輸出結果以十進制整數表示。此外，位運算的操作數和結果都應是整型。

在JavaScript中，位運算符包含按位與（&&）、按位或（||）、按位異或（||）、按位非（!）等。

• 按位與運算：將操作數轉換成二進制以后，如果兩個操作數對應位的值均為1，則結果為1，否則結果為0。例如，對于表達式41&23， 41轉換成二進制數00101001，而23轉換成二進制數00010111，按位與運算后結果為00000001，轉換成十進制數為1。
• 按位或運算：將操作數轉換為二進制后，如果兩個操作數對應位的值中任何一個為1，則結果為1，否則結果為0。例如，對于表達式41||23，按位或運算后結果為00111111，轉換成十進制數為63。
• 按位異或運算：將操作數轉換成二進制后，如果兩個操作數對應位的值互不相同時，則結果為1，否則結果為0。例如，對于表達式41^23，按位異或運算后結果為00111110，轉換成十進制數為62。
• 按位非運算：將操作數轉換成二進制后，對其每一位取反（即值為0則取1，值為1則取0）。例如，對于表達式～41，將每一位取反后結果為11010110，轉換成十進制數為-42。

【例7-13】（實例文件：ch07\Chap7.13.html）位運算符的應用示例。

相關的代碼示例請參考Chap7.13.html文件，然后雙擊該文件，在IE瀏覽器里面運行的結果如圖7-16所示。

7.2.9　移位運算符

移位運算符與位運算符相似，都是將操作數轉換成二進制，然后對轉換之后的值進行操作。JavaScript位操作運算符有3個：<<、>>、>>>。

【例7-14】（實例文件：ch07\Chap7.14.html）移位運算符的應用示例。

相關的代碼示例請參考Chap7.14.html文件，然后雙擊該文件，在IE瀏覽器里面運行的結果如圖7-17所示。

上述代碼的運行過程如下：首先將十進制數25轉換成二進制為00011001，然后將其左移2位，右邊的空位由0補齊，結果為01100100，轉換成十進制數即為100；將其右移2位，結果是00000110，轉換成十進制為6；將其邏輯右移2位，因其為正數，結果仍為6。同理，十進制數-28轉換成二進制是11100100，將其左移2位后為10010000，轉換成十進制數是-112；將其進行算術右移2位，得到的結果是11111001，轉換成十進制是-7。由于負數在邏輯右移的過程中，符號位會隨著整體一起往右移動，相當于無符號數的移動，變成一個32位的正數，因為符號位不存在了。因此，-28在邏輯右移前從第32位到符號位的位置全部由1填充，得到的結果為11111111111111111111111111100100再邏輯右移2位后為0011111111111111111111111111 1001，轉換成十進制是1073741817。

7.2.10　其他運算符

除前面介紹的幾種之外，JavaScript還有一些特殊運算符，下面對其進行簡要介紹。

1．逗號運算符

逗號運算符用于將多個表達式連接為一個表達式，新表達式的值為最后一個表達式的值。其語法形式為“變量=表達式1，表達式2”。

【例7-15】（實例文件：ch07\Chap7.15.html）逗號運算符的應用示例。

相關的代碼示例請參考Chap7.15.html文件，然后雙擊該文件，在IE瀏覽器里面運行的結果如圖7-18所示。從運行結果中可以看到，變量a最終取值為最后一個表達式（d=56）的結果。

2．void運算符

void運算符對表達式求值，并返回undefined。該運算符通常用于避免輸出不應該輸出的值，其語法形式為“void 表達式”。

【例7-16】（實例文件：ch07\Chap7.16.html）void運算符的應用示例。

相關的代碼示例請參考Chap7.16.html文件，然后雙擊該文件，在IE瀏覽器里面運行的結果如圖7-19所示。從運行結果中可以看到，變量a最終被標記為undefined。

3．typeof運算符

typeof運算符返回一個字符串指明其操作數的數據類型，返回值有6種可能：number、string、boolean、object、function和undefined。typeof運算符的語法形式為“typeof 表達式”。

【例7-17】（實例文件：ch07\Chap7.17.html）typeof運算符的應用示例。

相關的代碼示例請參考Chap7.17.html文件，然后雙擊該文件，在IE瀏覽器里面運行的結果如圖7-20所示。從運行結果中可以看到，null類型的操作數的返回值為object。

7.3　運算符優先級

在JavaScript中，運算符具有明確的優先級與結合性。優先級用于控制運算符的執行順序，具有較高優先級的運算符先于較低優先級的運算符執行；結合性則是指具有同等優先級的運算符將按照怎樣的順序進行運算，結合性有向左結合和向右結合。圓括號可用來改變運算符優先級所決定的求值順序。

【例7-18】（實例文件：ch07\Chap7.18.html）用（）改變運算順序的應用示例。

相關的代碼示例請參考Chap7.18.html文件，然后雙擊該文件，在IE瀏覽器里面運行的結果如圖7-21所示。

從運行結果中可以看到，由于乘法的優先級高于加法，因此，表達式“3+4*5”的計算結果為23；而在表達式“(3+4)*5”中則被括號“（）”改變了運算符的優先級，括號內部分將優先于任何運算符而被最先執行，因此該語句的結果為35。

7.4　就業面試技巧與解析

7.4.1　面試技巧與解析（一）

面試官：談談你對跳槽的看法。

應聘者：我個人認為正常的跳槽能促進人才合理流動，應該支持；頻繁的跳槽對單位和個人雙方都不利，應該反對。

7.4.2　面試技巧與解析（二）

面試官：為什么選擇這個崗位？

應聘者：這一直是我的興趣和專長，經過這幾年的磨煉，也累積了一定的經驗及人脈，相信我一定能勝任這個崗位。