TypeScript 运算符详解
TypeScript 的运算符与 JavaScript 完全一致（因为 TS 是 JS 的超集），包括算术、比较、逻辑、赋值、位运算等。TypeScript 的优势在于类型检查会结合运算符进行静态分析，能在编译时捕获潜在的类型错误。
以下按类别详细列出常用运算符，并标注 TypeScript 特有的类型影响。
1. 算术运算符（Arithmetic Operators）
| 运算符 | 描述 | 示例 | 结果 | TS 类型注意点 |
|---|---|---|---|---|
+ | 加法 | 5 + 3 | 8 | 字符串拼接："a" + "b" → "ab" |
- | 减法 | 5 - 3 | 2 | |
* | 乘法 | 5 * 3 | 15 | |
/ | 除法 | 10 / 3 | 3.333… | |
% | 取模（余数） | 10 % 3 | 1 | |
** | 幂（ES2016+） | 2 ** 3 | 8 | |
++ | 自增 | let a = 1; a++; | 2 | |
-- | 自减 | let a = 2; a--; | 1 |
TS 示例：
let num: number = 10 + 5; // OK
let str: string = "Hello" + " TS"; // 字符串拼接
// let error: number = "10" + 5; // 编译错误（strict 模式下）：结果为 string "105"
let fixed: number = Number("10") + 5; // 正确2. 比较运算符（Comparison Operators）
返回 boolean 类型。
| 运算符 | 描述 | 示例 | 结果 |
|---|---|---|---|
== | 松散相等（类型转换） | 5 == "5" | true |
=== | 严格相等（类型+值） | 5 === "5" | false |
!= | 松散不相等 | 5 != "5" | false |
!== | 严格不相等 | 5 !== "5" | true |
> | 大于 | 5 > 3 | true |
< | 小于 | 5 < 3 | false |
>= | 大于等于 | 5 >= 5 | true |
<= | 小于等于 | 3 <= 5 | true |
推荐始终使用 === 和 !==，避免类型转换带来的意外。
3. 逻辑运算符（Logical Operators）
| 运算符 | 描述 | 示例 | 结果/行为 |
|---|---|---|---|
&& | 逻辑与（短路） | true && false | false |
|| | 逻辑或（短路） | true || false | true |
! | 逻辑非 | !true | false |
?? | 空值合并（Nullish Coalescing） | null ?? "default" | “default”（仅 null/undefined 时生效） |
TS 类型影响：逻辑运算符常用于类型缩小（Type Narrowing）。
function greet(name: string | null) {
const realName = name ?? "Guest"; // realName 类型被缩小为 string
console.log(`Hello ${realName.toUpperCase()}`); // 安全调用
}4. 赋值运算符（Assignment Operators）
| 运算符 | 描述 | 等价写法 |
|---|---|---|
= | 简单赋值 | a = b |
+= | 加法赋值 | a = a + b |
-= | 减法赋值 | a = a - b |
*= | 乘法赋值 | a = a * b |
/= | 除法赋值 | a = a / b |
%= | 取模赋值 | a = a % b |
**= | 幂赋值 | a = a ** b |
5. 位运算符（Bitwise Operators）
对数字的二进制位操作（常用于性能优化或底层编程）。
| 运算符 | 描述 | 示例 |
|---|---|---|
& | 位与 | 5 & 1 → 1 |
| | 位或 | 5 | 1 → 5 |
^ | 位异或 | 5 ^ 1 → 4 |
~ | 位非 | ~5 → -6 |
<< | 左移 | 5 << 1 → 10 |
>> | 带符号右移 | 5 >> 1 → 2 |
>>> | 无符号右移 | 5 >>> 1 → 2 |
6. 三元条件运算符（Ternary Operator）
condition ? exprIfTrue : exprIfFalse示例：
let status: string = age >= 18 ? "成人" : "未成年";
// TS 类型推断：status 为 string7. 类型相关特殊运算符
这些是 TypeScript 独有的（仅在类型系统中存在，编译后消失）：
| 运算符 | 描述 | 示例 |
|---|---|---|
typeof | 类型查询（类型空间） | type Name = typeof username; // string |
keyof | 获取对象类型的所有键 | type Keys = keyof User; // "name" | "age" |
in | 遍历联合类型中的键 | type Check<P in keyof T> = ... |
as | 类型断言（Assertion） | let el = document.querySelector("div") as HTMLDivElement; |
! | 非空断言（Non-null Assertion） | let name = user.name!;（断言不为 null/undefined） |
?. | 可选链（Optional Chaining） | user?.profile?.avatar |
?? | 空值合并（已在上文） |
8. 最佳实践建议
- 始终使用严格相等：
===和!== - 优先使用
??而非||：当你只想处理null/undefined时。 - 利用可选链和非空断言减少运行时错误：
let length = str?.length ?? 0; // 安全- 开启
strictNullChecks：强制处理 null/undefined。
小结：常用运算符速查
| 类别 | 常用运算符 |
|---|---|
| 算术 | + - * / % ** ++ -- |
| 比较 | === !== > < >= <= |
| 逻辑 | && || ! ?? |
| 赋值 | = += -= *= /= **= |
| 类型安全 | ?. ?? ! as typeof keyof |
如果您想深入某个运算符（如可选链的详细用法、位运算实战、或类型运算符如 keyof/in），或者需要完整代码示例，请随时告诉我！
