IT课程 JavaScript基础 040_运算符

JavaScript 运算符用于对数学运算、比较、逻辑运算等操作并返回结果。

算术运算符

• +：加法
• -：减法
• *：乘法
• /：除法
• %：取余数
• **：求幂

示例：

let a = 5;
let b = 2;

console.log(a + b);  // 输出 7
console.log(a - b);  // 输出 3
console.log(a * b);  // 输出 10
console.log(a / b);  // 输出 2.5
console.log(a % b);  // 输出 1
console.log(a**b);  // 输出 25

---

赋值运算符

• =：赋值
• +=：加法赋值
• -=：减法赋值
• *=：乘法赋值
• /=：除法赋值
• %=：取余赋值
• **=：求幂赋值
• ??=：空赋值，当变量值为null或undefined时才会进行赋值

示例：

let x = 5;
x += 2;  // x = x + 2; 输出 7
x -= 2;  // x = x - 2; 输出 3
x *= 2;  // x = x * 2; 输出 10
x /= 2;  // x = x / 2; 输出 2.5
x %= 2;  // x = x % 2; 输出 1
x **= 2;  // x = x ** 2; 输出 25
x ??= 2;  // 输出 5，当x为null或undefined时赋值为2
console.log(x);

---

比较运算符

• ==：相等（值的类型会自动转换）
• ===：全等（值和类型都相等）
• !=：不相等
• !==：不全等
• >：大于
• <：小于
• >=：大于等于
• <=：小于等于

遇到非数值时，会先转换为数值后再比较，当遇到字符串时，会逐位地比较字符的 Unicode 编码。

示例：

let a = 5;
let b = '5';
let c = 10;

console.log(a == b);   // 输出 true，值相等
console.log(a === b);  // 输出 false，类型不相等
console.log(a != b);   // 输出 false，值相等
console.log(a !== b);  // 输出 true，类型不相等
console.log(a > c);  // 输出 false，5 < 10
console.log(a < c);  // 输出 true，5 < 10
console.log(a >= c);  // 输出 false，5 <= 10
console.log(a <= c);  // 输出 true，5 <= 10

---

逻辑运算符

逻辑运算符在处理操作数时，会将其转化为布尔值，并返回这个操作数的初始值。

&&：逻辑与

用于判断条件是否同时为 true。如果所有条件都为 true，那么整个表达式的结果为 true；否则，结果为 false。
与运算从左到右依次寻找第一个 false ，如果找到 false 就停止计算，并返回这个操作数的初始值（短路求值）。如果最终没有 false 则返回最后一个 true。

||：逻辑或

用于判断条件中至少有一个为 true 的情况。如果至少有一个条件为 true，那么整个表达式的结果为 true；如果所有条件都为 false，结果为 false。
或运算从左到右依次寻找第一个 true ，如果找到 true 就停止计算，并返回这个操作数的初始值（短路求值）。如果最终没有 true 则返回最后一个 false。

!：逻辑非

用于对一个布尔值进行取反操作。如果一个值为 true，使用逻辑非运算符将其取反为 false；如果一个值为 false，将其取反为 true。
逻辑非还可以用于将非布尔值转换为布尔值。它会将任何非 null、undefined、0、NaN、""（空字符串）的值转换为 true，而上述值本身都被转换为 false。

示例：

let a = true;
let b = false;
let c = "hello";
let d = null;

console.log(a && b);  // 输出 false
console.log(c && d);  // 输出 null
console.log(a || b);  // 输出 true
console.log(c || d);  // 输出 hello
console.log(!a);      // 输出 false
console.log(!d);      // 输出 true

---

三元运算符

• condition ? expr1 : expr2：如果条件为真，则返回 expr1，否则返回 expr2。

示例：

let age = 18;
let status = (age >= 18) ? '成年人' : '未成年人';
console.log(status);  // 输出 '成年人'

---

空值合并运算符

空值合并运算符（Nullish Coalescing Operator）是用于处理默认值的运算符，通常用于确保一个变量具有非空（非 null 和非 undefined）的值。该运算符的语法是 ??。

当使用空值合并运算符时，它会返回第一个定义（非 null 和非 undefined）的操作数，如果第一个操作数为 null 或 undefined，则返回第二个操作数。

示例：

let num1 = 0;
let num2 = 1;
let result = num1 ?? num2;
console.log(result);  // 输出 0，因为 num 不为 null 或 undefined

let user;
console.log(user ?? "匿名"); // 输出 匿名，因为 user 未定义

---

位运算符

• &：按位与
• |：按位或
• ^：按位异或
• ~：按位取反
• <<：左移
• >>：右移
• >>>：无符号右移

示例：

let a = 5;  // 二进制：0101
let b = 3;  // 二进制：0011

console.log(a & b);   // 输出 1（按位与）
console.log(a | b);   // 输出 7（按位或）
console.log(a ^ b);   // 输出 6（按位异或）
console.log(~a);      // 输出 -6（按位取反）
console.log(a << 1);  // 输出 10（左移）
console.log(a >> 1);  // 输出 2（右移）

---

其他运算符

• typeof：返回一个字符串，表示未经计算的操作数的类型。
• instanceof：用于测试对象是否是指定类型的实例。

示例：

let str = 'Hello';
console.log(typeof str);  // 输出 'string'

let arr = [1, 2, 3];
console.log(arr instanceof Array);  // 输出 true

---

+（加号）

在 JavaScript 中，加号 + 有多重用途，包括数学运算、字符串拼接和一元操作。

数学运算

示例：

let a = 5;
let b = 3;
let result = a + b;
console.log(result);  // 输出 8

如果都是数字，+ 被用于执行数学加法。

字符串拼接

示例：

let str1 = 'Hello';
let str2 = ' World';
let result = str1 + str2;
console.log(result);  // 输出 'Hello World'

如果其中一个操作数是字符串，+ 将执行字符串拼接。

一元加法运算符

示例：

let str = '42';
let num = +str;
console.log(num);  // 输出 42

在单个操作数前使用 +，它可以将操作数转换为数字，这是一元加法运算符的功能。

类型转换

示例：

let num = 42;
let str = '10';
let result = num + str;  // 隐式类型转换（类型强制转换）
console.log(result);  // 输出 '4210'

如果其中一个操作数是字符串，+ 会进行类型转换，将其他操作数转换为字符串，然后执行字符串拼接。

连接数组

示例：

let arr1 = [1, 2, 3];
let arr2 = [4, 5, 6];
let result = arr1 + arr2;
console.log(result);  // 输出 '1,2,34,5,6'

当一个操作数是数组时，+ 会将数组转换为字符串，然后进行字符串拼接。

特殊情况

示例：

let specialResult1 = '1' + 2 + 3;
console.log(specialResult1);  // 输出 '123'

let specialResult2 =  2 + 3 + '1';
console.log(specialResult2);  // 输出 '51'

specialResult1，因为字符串出现在 + 的最左边，后续的数字会被当作字符串进行拼接。
specialResult2，因为字符串出现在 + 的最右边，之前的数字会先进行数学运算后再进行拼接。

---

-（减号）

在 JavaScript 中，减号 - 是一个用于执行数学减法的运算符。

数学减法

示例：

let a = 5;
let b = 3;
let result = a - b;
console.log(result);  // 输出 2

如果都是数字，- 被用于执行数学减法。

一元减法运算符

示例：

let num = 42;
let result = -num;
console.log(result);  // 输出 -42

在单个操作数前使用 -，它可以执行一元减法运算，将操作数变为其相反数。

类型转换

示例：

let num1 = 42;
let str = '10';
let result = num1 - str;
console.log(result);  // 输出 32

如果其中一个操作数是字符串，- 会进行类型转换，将其他操作数转换为数字，然后执行数学减法。

特殊情况

示例：

let specialResult = '10' - 2;
console.log(specialResult);  // 输出 8

在这个特殊的情况下，因为字符串中的内容可以被成功转换为数字，- 会执行数学减法。

---

=、==、===（赋值、宽松相等、严格相等）

在 JavaScript 中，等号 = 是赋值运算符，而 == 和 === 是比较运算符。宽松相等会将两个操作数转换为相同类型，然后再进行比较。在条件判断中，通常使用 === 进行严格相等性比较，因为它不会进行类型转换。

赋值运算符

= 用于将右侧的值赋给左侧的变量。

示例：

let x = 5;
let y = 'Hello';
console.log(x);  // 输出 5
console.log(y);  // 输出 'Hello'

在这个例子中，= 将右侧的值赋给左侧的变量 x 和 y。

比较运算符

== 和 === 用于比较两个值的相等性。

示例：

let a = 5;
let b = '5';

console.log(a == b);   // 输出 true
console.log(a === b);  // 输出 false

== 进行相等性比较时，会进行类型转换，null == undefined 输出 true。
=== 进行相等性比较时，要求值和类型都相等，null === undefined 输出 false。
NaN 不等于任何值，包括 NaN 本身。

---

++、--（自增、自减）

在 JavaScript 中，自增（++）和自减（--）是用于增加或减少变量值的操作符。

自增运算符 (++)

使用后会使得原来的变量立刻增加 1。
前置自增，返回自增后的值（新值）；
后置自增，返回自增前的值（旧值）；

前置自增示例：

let a = 5;
// 前置自增，先增加 1，然后再使用新的值
let b = ++a;
console.log(b);  // 输出 6
console.log(a);  // 输出 6

在这个例子中，a 先增加了 1，然后 b 获取了新的 a 值（6）。

后置自增示例：

let x = 5;
// 后置自增，先使用当前值，然后再增加 1
let y = x++;
console.log(y);  // 输出 5
console.log(x);  // 输出 6

在这个例子中，y 先获得了 x 的当前值（5），然后 x 的值增加了 1。

自减运算符 (–)

使用后会使得原来的变量立刻减少 1。
前置自减，返回自减后的值（新值）；
后置自减，返回自减前的值（旧值）；

前置自减示例：

let p = 10;
// 前置自减，先减少 1，然后再使用新的值
let q = --p;
console.log(q);  // 输出 9
console.log(p);  // 输出 9

在这个例子中，p 先减少了 1，然后 q 获取了新的 p 值（9）。

后置自减示例：

let m = 8;
// 后置自减，先使用当前值，然后再减少 1
let n = m--;
console.log(n);  // 输出 8
console.log(m);  // 输出 7

在这个例子中，n 先获得了 m 的当前值（8），然后 m 的值减少了 1。

运算符优先级：

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Operator_precedence