TypeScript 中的运算符
本文解释了 TypeScript 中的运算符。
YouTube Video
TypeScript 中的运算符
TypeScript 中的运算符用于执行数值计算、值比较和逻辑操作。由于 TypeScript 使用与 JavaScript 类似的运算符,因此易于上手,但 TypeScript 通过类型安全允许进行更严格的操作。
主要运算符如下:。
算术运算符
算术运算符用于数值计算。
| 运算符 | 描述 | 示例 | 结果 |
|---|---|---|---|
+ |
加法 | 5 + 3 |
8 |
- |
减法 | 5 - 3 |
2 |
* |
乘法 | 5 * 3 |
15 |
/ |
除法 | 5 / 2 |
2.5 |
% |
求余数 | 5 % 2 |
1 |
++ |
增量(前缀) | let x = 5; ++x |
6 |
-- |
减量(前缀) | let x = 5; --x |
4 |
1let a = 10; // Initialize variable 'a' with the value 10
2let b = 3; // Initialize variable 'b' with the value 3
3
4// Perform and display arithmetic operations between 'a' and 'b'
5console.log("Addition (a + b): ", a + b); // 13
6console.log("Subtraction (a - b): ", a - b); // 7
7console.log("Multiplication (a * b):", a * b); // 30
8console.log("Division (a / b): ", a / b); // 3.333...
9console.log("Modulus (a % b): ", a % b); // 1
10
11// Demonstrate post-increment operation on 'a'
12// Output the current value of 'a' (10), then increment
13console.log("Post-increment (a++): ", a++);
14// Display the incremented value of 'a' (11)
15console.log("Value of 'a' after increment:", a);
16
17// Demonstrate pre-increment operation on 'a'
18// Increment 'a' first (12) then output
19console.log("Pre-increment (++a): ", ++a);
20
21// Demonstrate post-decrement operation on 'a'
22// Output the current value of 'a' (12), then decrement
23console.log("Post-decrement (a--): ", a--);
24// Display the decremented value of 'a' (11)
25console.log("Value of 'a' after decrement:", a);
26
27// Demonstrate pre-decrement operation on 'a'
28// Decrement 'a' first (10) then output
29console.log("Pre-decrement (--a): ", --a);赋值运算符
赋值运算符将右边的值分配给左边的变量。
| 运算符 | 描述 | 示例 | 结果 |
|---|---|---|---|
= |
赋值 | x = 10 |
x = 10 |
+= |
加法并赋值 | x += 5 |
x = 15 |
-= |
减法并赋值 | x -= 5 |
x = 5 |
*= |
乘法并赋值 | x *= 2 |
x = 20 |
/= |
除法并赋值 | x /= 2 |
x = 5 |
%= |
求余数并赋值 | x %= 3 |
x = 1 |
1let z = 5;
2z += 3;
3console.log(z); // Outputs: 8
4
5z *= 2;
6console.log(z); // Outputs: 16
比较运算符
比较运算符用于比较值,并返回 true 或 false。
| 运算符 | 描述 | 示例 | 结果 |
|---|---|---|---|
== |
相等(不进行类型比较) | 5 == "5" |
true |
=== |
严格相等(包括类型) | 5 === "5" |
false |
!= |
不相等(不进行类型比较) | 5 != "5" |
false |
!== |
严格不相等(包括类型) | 5 !== "5" |
true |
> |
大于 | 5 > 3 |
true |
< |
小于 | 5 < 3 |
false |
>= |
大于或等于 | 5 >= 5 |
true |
<= |
小于或等于 | 5 <= 3 |
false |
1console.log('5 == "5" :', 5 == "5"); // Outputs: true
2console.log('5 === "5" :', 5 === "5"); // Outputs: false
3console.log('5 != "5" :', 5 != "5"); // Outputs: false
4console.log('5 !== "5" :', 5 !== "5"); // Outputs: true
5console.log('5 > 3 :', 5 > 3); // Outputs: true
6console.log('5 < 3 :', 5 < 3); // Outputs: false
7console.log('5 >= 5 :', 5 >= 5); // Outputs: true
8console.log('5 <= 3 :', 5 <= 3); // Outputs: false
逻辑运算符
逻辑运算符用于组合逻辑表达式。
| 运算符 | 描述 | 示例 | 结果 |
|---|---|---|---|
&& |
逻辑与 | true && false |
false |
|| |
逻辑或 | true || false |
true |
! |
取反 | !true |
false |
1console.log('true && false :', true && false); // Outputs: false
2console.log('true || false :', true || false); // Outputs: true
3console.log('!true :', !true); // Outputs: false
逻辑运算符的优先级
在 TypeScript 中,逻辑运算符通常按照顺序先评估 NOT,然后是 AND,最后是 OR。
NOT 优先级最高
NOT 是一元运算符,它具有最高优先级。
1console.log(!true || false); // false
AND 的优先级高于 OR
AND 的优先级高于 OR,因此会先评估 AND 部分。
1console.log(true || false && false); // true
因此,首先计算 AND(&&)部分,其结果会传递给 OR(||)。
AND 和 OR 进行短路评估
在 TypeScript 中,AND 和 OR 进行短路评估。如果结果由左侧的值决定,则不会评估右侧的表达式。
1let a = false && console.log("This will not be printed");
2console.log(a); // false
3
4let b = true || console.log("This will not be printed");
5console.log(b); // true
在上述两种情况下,console.log() 都不会执行。
明确定义优先级
使用括号明确表达式分组可以避免对优先级的误解。
1console.log(true || (false && false)); // true
自然语言与程序解释之间的差异
在使用逻辑运算符时,需注意自然语言中的歧义。例如,在短语“一只白色的狗或一只猫”中,它可能意味着“一只白色的狗或任何一只猫”或“一只白色的狗或一只白色的猫”。在代码中,它可以这样写:。
1if (isWhite && isDog || isCat) {
2 console.log(' "A white dog" or "a cat of any color" ');
3}
4
5if (isWhite && (isDog || isCat)) {
6 console.log(' "A white dog" or "a white cat" ');
7}由于自然语言可能存在歧义,因此在编写代码和设计系统时需要谨慎。
按位运算符
按位运算符在位级别操作数字。
| 运算符 | 描述 | 示例 | 结果 |
|---|---|---|---|
& |
逻辑与 | 5 & 1 |
1 |
| ` | ` | 逻辑或 | 5 | 1 |
^ |
异或 (XOR) | 5 ^ 1 |
4 |
~ |
取反 (NOT) | ~5 |
-6 |
<< |
左移 | 5 << 1 |
10 |
>> |
右移(有符号) | 5 >> 1 |
2 |
>>> |
右移(无符号) | 5 >>> 1 |
2 |
1console.log('5 & 1 :', 5 & 1); // Outputs: 1 (AND operation)
2console.log('5 | 1 :', 5 | 1); // Outputs: 5 (OR operation)
3console.log('5 ^ 1 :', 5 ^ 1); // Outputs: 4 (XOR operation)
4console.log('~5 :', ~5); // Outputs: -6 (NOT operation)
5console.log('5 << 1 :', 5 << 1); // Outputs: 10 (Left shift operation)
6console.log('5 >> 1 :', 5 >> 1); // Outputs: 2 (Right shift operation)
7console.log('5 >>> 1:', 5 >>> 1); // Outputs: 2 (Unsigned right shift operation)
三元运算符
三元运算符根据条件表达式的结果返回不同的值。
1let age = 20;
2let access = (age >= 18) ? "Allowed" : "Denied";
3console.log(access); // Outputs: Allowed
类型操作符
TypeScript 的类型操作符包括以下内容:。
| 操作符 | 描述 | 示例 | 结果 |
|---|---|---|---|
typeof |
返回变量的类型 | typeof 123 |
"number" |
instanceof |
检查对象是否属于特定类 | arr instanceof Array |
true |
is |
作为类型保护,检查值是否为特定类型 | value is string |
true or false |
1console.log(typeof "Hello"); // "string"
2console.log(typeof 42); // "number"
3
4let arr: number[] = [1, 2, 3];
5console.log("arr instanceof Array : ", arr instanceof Array); // true
6
7// Example of Type Guard
8function isString(value: any): value is string {
9 return typeof value === "string";
10}
11
12let value: any = "Hello";
13if (isString(value)) {
14 console.log("Value is a string:", value); // "Value is a string: Hello"
15}类型操作符用于检查值的类型或将其转换为特定类型。
typeof操作符返回变量的类型。instanceof操作符检查对象是否属于特定类。is操作符用于检查值是否为特定类型。它是 TypeScript 类型保护的一部分。
总结
- 算术运算符: 用于执行基本计算。
- 赋值运算符: 用于向变量赋值。
- 比较运算符: 用于比较值。
- 逻辑运算符: 用于组合逻辑条件。
- 位运算符: 用于按位操作。
- 三元运算符: 根据条件返回值。
- 类型操作符可以检查值的类型。
在TypeScript中,这些运算符可以有效地用于编写复杂的计算和条件表达式。
您可以在我们的YouTube频道上使用Visual Studio Code跟随上述文章进行学习。 请也查看我们的YouTube频道。