JavaScript 運算式與運算子 & 型別轉換筆記一

Thomas Hung
Thomas 學習筆記
9 min readApr 26, 2020

賦值(指定)運算子

運算子指定一個值給一個變數

如上圖,來作範例

let a = 100 + 10

我們將= 右邊指派給左邊a 值變數。

let a = 10
a += 100 //代表 a = a + 100
console.log(
a) //110

a += 100 表示先將 a + 100 運算後,再將結果指派給左邊 a 變數。

比較運算子

比較兩邊運算元的關係,並將比較結果回傳 truefalse ,運算元可以是 數值 、字串、表達式 、物件等。

寬鬆等於

let a= '1' 
a == 1 // true,因為 a 值自動轉換型別 Number('1')等於1

嚴格等於(不會自動轉換型別)

let a= '1' 
a === 1 // false

寬鬆不等於

let a= '1' 
a != 1 // false,因為 a 值自動轉換型別 Number('1')等於1

嚴格不等於(不會自動轉換型別)

let a= '1' 
a !== 1 // true

自動轉換型別規則:

  • 如果其中一個值是 Boolean 的情況下,會將 true 轉型數字Number()1false 轉變成數字 Number()0
  • 如果遇到字串與數字做比較情況下,則會將字串進行數字 Number() 轉型為數字後,再進行比較。
  • 如果其中一個是物件型別,而另一個是基本型別,物件型別會經由 valueOf() 方法取得基本型別值,再進行比較。
  • NaN 比較時不等於任何型別。

數值的大於 > 與小於 <

10 > 2   //true
1 < 3 //true
10 >= 1 //false

數值在比較時依數值的大小作比較,但如果遇到布林值、字串等等不同型別,就會自動轉型別,大致如下 :

  • 如兩個值都是數值,只做單純數字比較。
  • 如其中一個是數字時,另一個不是,則它會在背後先做數字 Number() 型別轉換,再做比較。
  • 如二個都是字串時,依照字母的順序來做比較(字母的順序是依Unicode 順序來判斷,可以使用字串的 String.prototype.charCodeAt() 方法取得 ,參考 :JavaScript String (字串)筆記)。
  • 如其中一個是布林值,是 true 會轉型為 1,是 false會轉型為 0 。
  • 如果其中一個是物件型別,而另一個是基本型別,物件型別會經由 valueOf() 方法取得基本型別值,再進行比較。

注意 => 這不是運算子,是 ES6 的箭頭函式。

算數運算子

用來做常見的數值運算

加號(+) & 減號(-)

如果要表示 1+2 的算式如下:

let a= 1 + 2
console.log(a) // 3

特殊的數字 Infinity、-Infinity、NaN,加減號的結果如下:

Infinity + Infinity      // Infinity  
-Infinity + -Infinity // -Infinity
-Infinity + Infinity // NaN
Infinity - Infinity // NaN
-Infinity - Infinity // -Infinity
-Infinity + Infinity // NaN

NaN ,如果其中一個是 NaN ,結果都是 NaN 如下:

NaN + 1         // NaN
Infinity + NaN // NaN
-Infinity + NaN // NaN
NaN - 1 // NaN
Infinity - NaN // NaN
-Infinity - NaN // NaN

在JavaScript中加號,如果任一方是字串時,加號還有另個用法,將運算元連接一起,也就是雙方自動轉型成字串,並連接一起如下範例:

10 + '100'    //'10100'
100 + 'ABC' //'100ABC'
'ABC' + 'DEF' //'ABCDEF'

以物件型別 Object 的情況來說,轉型時會去呼叫 valueOf() 方法取得數值,如果物件沒有valueOf() 方法,則會透過 toString()方法去取得字串,再使用Number() 得到數值。

10 - {} // NaN 通過由Number({})轉數字NaN
10 + {} //'10[object Object]' 通過{}.toString()轉[object Object]並相加
10 - [] // 10 通過由Number([])轉數字0
10 + [] //'10' 先通過[].toString()轉''(空字串)並相加

如果是字串與基本型別 null、undefined 做加號時,則會通過JavaScript中 toString() 函數來將它們轉變成字串'null''undefined' 。如果是布林值會轉成 truefalse

[] + {}  //"[object Object]"
{} + [] //0

因為([]).toString() 會被轉成 '' 空字串,而({}).toString() 會被轉成'[object Object]' 字串,在{} + [] 中,{} 只是個區塊沒有作用,+[] (強制被轉為數字)是物件中的陣列,它會先由toString() 會被轉成 '' 空字串,再經由Number() 轉為數字 0

如果是數字與基本型別 Boolean、null、undefined 做加減號時,則會通過JavaScript中 Number() 函數來將它們轉變成數字,布林值true 轉成數字為1且false轉成數字為 0, null 轉數字為 0 ,undefined轉數字為 NaN

如是物件,會先使用valueOf() 取得原始值,若沒有此方法時會用 toString() 基本型別且再用Number() 轉為數字。

'ABC' + null //'ABCnull'
'ABC' + undefined //'ABCundefined'
'ABC' - null //NaN
'ABC' - undefined //NaN
10 + null //10 透過Number(null)轉成0
10 + undefined //NaN 透過Number(undefined)轉成NaN
10 - null //10 透過Number(null)轉成0
10 - undefined //NaN 透過Number(undefined)轉成NaN

由於運算式的計算方式是, 由左而右且先乘除後加減的模式來運算,與括號優先運算。

在數字 Number()型別轉換,還有另一個方法就是加號(+),也可以做型別轉換如下:

+true   //1
+false //0
+null //0
+undefined //NaN
+function(){} //NaN

遞增( ++ ) & 遞減(- - )

遞增與遞減意思說明,當變數前後有++ 時變數再加 1,而遇到 -- 變數減 1 如下範例。

let a = 1
let b = 2
a++
console.log(a) // 2
b--
console.log(b) // 1

除了上述運算,++、-- 在位置上有不一樣結果如下:

let a = 1
let b = 2
console.log(a++) //回傳 1 **說明:先將變數結果回傳後變數再加 1**
console.log(a) //回傳 2 **說明:目前結果**
console.log(++a) //回傳 3 **說明:先將變數再加 1 後結果回傳**
console.log(b--) //回傳 2 **說明:先將變數結果回傳後變數再減 1**
console.log(b) //回傳 1 **說明:目前結果**
console.log(--b) //回傳 0 **說明:先將變數再減 1 後結果回傳**

特別範例

let year = 0
year = year++ //結果 0

為什麼呢?先看等號右邊這部份

year++  //**說明:它的值是 0 因為「先回傳值,再默默的進行 +1」**

再看等號左邊的 year

year = 0   //回傳 0  **說明:是因為 year++ 執行完的結果為 0 **

所以完整程式

let year = 0
year = year++ //結果 0

除數( / )

將第一個值除以第二個值並回傳商如下:

let a = 10 / 5 
a // 商數為 2

如果其中一方的值不是數字,會先以Number() 轉換再進行運算

除數為 0 時,回傳以下結果

1 / 0    //Infinity
10 / -0 //-Infinity
0 / 0 //NaN

取餘數( % )

將第一個值除以第二個值並回傳餘數如下:

let a = 10 % 5 
a // 餘數為 0

另個特別範例

let a = 5 % 10
a // 餘數為 5

也就是說,當 var1 < var2 時,使用 var1 % var2 取出來的數值會是 var1 。

參考 : MDN

被除數為Infinity 時,結果都是 NaN

Infinity % 0              // NaN 
Infinity % 10 // NaN
Infinity % Infinity // NaN
Infinity % -Infinity // NaN

如除數為Infinity 時,被除數是數值,則結果為被除數

10 % Infinity  // 10
100 % Infinity // 100

被除數是數值,而除數為 0 的情況下,則結果是 NaN

指數( ** )

將第一個數值為底,第二個數值為第一個數值次方,並回傳結果如下:

let a = 2 ** 3
console.log(a) // 8

參考:運算式與運算子

以上是我對運算式與運算子 & 型別轉換筆記 學習筆記 一 😉。

***如果有任何想法,也歡迎留言與我分享~***

--

--

Thomas Hung
Thomas 學習筆記

when you feel like quitting,think about why you started.