EP.6 RE：從零開始的學習 JS 生活-第六日之運算子

前言

轉生第六日，這一篇將會來介紹運算子，雖然前面有接觸過一些運算子，但是這一篇會針對常見的運算子做一下介紹。

運算子

一般開發上，我們最常見的基本運算子就是等號運算子(=)以及點運算子(.)，那麼運算子其實還有其他種，例如加號運算子(+)、減號運算子(-)、乘號運算子(*)、除號運算子(/)、遞增運算子(++)、遞減運算子(--)、餘數運算子(%)等等，而上述這幾個又稱之為算術運算子。

當然還有另一種運算子，分別為大於運算子(>)、小於運算子(<)、大於等於運算子(>=)、小於等於運算子(<=)等等，以上這幾種運算子則是稱之為比較運算子。

最後還有一個運算子，叫做邏輯運算子，但是再轉生第六日暫時先不學習。

算術運算子

算術運算子在前面已經稍作介紹過，算術運算子顧名思義就是做計算的，所以我就直接來看範例比較快：

1
2
3
4
5
6
7
8
9
10
11
12
13

10 + 10; // 20
10 - 2; // 8
10 * 2; // 20
10 / 2; // 5

// 遞增運算子必須透過變數來增加
var a = 10;
a++; // 11 ++ 代表 +1

var b = 10;
b--; // 9 -- 代表 -1

10 % 4; // 2

比較運算子

而比較運算子就是在兩者之間或複數之間做出一個比較，比較後將會回傳布林值，也就是 true or false，所以這邊讓我們直接來看一下範例：

1
2
3
4

10 > 5; // true
10 < 5; // false
10 >= 10; // true，若是 10 > 10; 則為 false
10 <= 5; // false

另外比較運算子中還有幾個常見的運算子，分別為

• == & === - 相等運算子
• != & !== - 不相等運算子

那你可能會好奇等於預算子的 == & != 與 === & !== 有什麼差別，簡單來講 == & != 就是寬鬆比對，當你輸入 1 == '1'; 會得到 true，那 === & !== 就是嚴格比對，會連型別都替你做比對，所以當你輸入 1 === '1'; 是會得到 false 的。

實際開發也會建議使用嚴格比對取代寬鬆比對，所以我們就可以這樣子整理

• 一般相等 or 不相等 (寬鬆比對)
• 嚴格相等 or 不相等 (嚴格比對)

另外還有另一個特別的語法，也就是 Object.is，Object.is 是 ES6 才加入的語法，但是 Object.is 是屬於嚴格比對：

1
2

Object.is(1, '1'); // false
Object.is('1', '1'); // true

關於 Object.is 這個語法可以看 MDN 提供的文件說明

字串相加運算子

最後在講一個特別的運算子，也就是加號運算子(+)，其實加號運算子它非常特別，除了可以當作算術運算子之外，它當作字串相加運算子可以將兩個字串相加，例如：

1
2

var a = 'Hello' + ' World';
a; // Hello World

但是有一種狀況是一個是數字型別，另一個則是字串型別的狀況，前面我們知道加號運算子可以對數字相加，但是如果是這樣子的形式會發生什麼狀況呢?

1
2

var a = 1 + '1';
a; // 11

其實會得到 11 而不是 2，理解的方式很簡單，只要裡面有字串(也就是有單引號或雙引號包覆)，那麼就一定會是字串相加。

但是這邊也有一個滿特別的狀況，如果你改成減號運算子(-)，那就會變得很妙：

1
2

var a = 1 - '1';
a; // 0

你會發現竟然會得到答案 0，那這部分與 JavaScript 的自動轉換型別有關係，後面會在介紹這個東西。

最後如果你嘗試使用字串與字串做乘法的動作，只會得到一個錯誤訊息，也就是 NaN，而這意思是指 not a number 就是在說這不是一個數字：

1
2
3

var a = 'qq';
var b = 'aa';
a * b; // NaN

結尾

下一篇的 RE：從零開始的學習 JS 生活-第六日 將會介紹函式。