JavaScript所有运算符的用法以及使用场景： https://blog.csdn.net/peijiajing/article/details/153183143?spm=1011.2124.3001.6209

上一遍文章我总结了所有的JavaScript 运算符，这篇文章就补充一下详解吧

JavaScript 提供了丰富的运算符，用于执行各种操作。下面我将全面介绍各类运算符的用法、解释和使用场景。

1. 算术运算符

使用场景：

1. 数学计算
2. 数字处理
3. 循环计数

let a = 10, b = 3;

// 加法
console.log(a + b); // 13

// 减法
console.log(a - b); // 7

// 乘法
console.log(a * b); // 30

// 除法
console.log(a / b); // 3.333...

// 取余
console.log(a % b); // 1

// 指数
console.log(a ** b); // 1000 (10的3次方)

2. 赋值运算符

使用场景：

1. 变量赋值和更新
2. 计数器递增/递减

let x = 10;

// 基本赋值
x = 5;

// 加法赋值
x += 3; // 等同于 x = x + 3

// 减法赋值
x -= 2; // 等同于 x = x - 2

// 乘法赋值
x *= 4; // 等同于 x = x * 4

// 除法赋值
x /= 2; // 等同于 x = x / 2

// 取余赋值
x %= 3; // 等同于 x = x % 3

// 指数赋值
x **= 2; // 等同于 x = x ** 2

3. 比较运算符

使用场景：

1. 条件判断
2. 循环控制
3. 数据验证

let a = 5, b = "5", c = 10;

// 相等 (只比较值)
console.log(a == b); // true

// 严格相等 (比较值和类型)
console.log(a === b); // false

// 不相等
console.log(a != c); // true

// 严格不相等
console.log(a !== b); // true

// 大于
console.log(c > a); // true

// 小于
console.log(a < c); // true

// 大于等于
console.log(a >= 5); // true

// 小于等于
console.log(a <= 4); // false

4. 逻辑运算符

使用场景：

1. 条件组合
2. 默认值设置
3. 安全地访问嵌套属性

let a = 5; // 二进制: 101
let b = 3; // 二进制: 011

// 按位与
console.log(a & b); // 1 (二进制: 001)

// 按位或
console.log(a | b); // 7 (二进制: 111)

// 按位异或
console.log(a ^ b); // 6 (二进制: 110)

// 按位非
console.log(~a); // -6

// 左移
console.log(a << 1); // 10

// 右移
console.log(a >> 1); // 2

// 无符号右移
console.log(a >>> 1); // 2

5. 位运算符

使用场景：

1. 底层操作
2. 权限控制
3. 性能优化

let a = 5; // 二进制: 101
let b = 3; // 二进制: 011

// 按位与
console.log(a & b); // 1 (二进制: 001)

// 按位或
console.log(a | b); // 7 (二进制: 111)

// 按位异或
console.log(a ^ b); // 6 (二进制: 110)

// 按位非
console.log(~a); // -6

// 左移
console.log(a << 1); // 10

// 右移
console.log(a >> 1); // 2

// 无符号右移
console.log(a >>> 1); // 2

6. 一元运算符

使用场景：

1. 计数器操作
2. 类型检查
3. 对象属性管理

let x = 10;

// 正号
console.log(+x); // 10

// 负号
console.log(-x); // -10

// 自增 (前缀)
console.log(++x); // 11

// 自增 (后缀)
console.log(x++); // 11 (但x变为12)

// 自减 (前缀)
console.log(--x); // 11

// 自减 (后缀)
console.log(x--); // 11 (但x变为10)

// 类型判断
console.log(typeof x); // "number"

// 删除属性
let obj = {a: 1, b: 2};
delete obj.a;
console.log(obj); // {b: 2}

7. 三元运算符

使用场景：
1.简单的条件赋值
2. 替代简单的if-else语句

let age = 18;
let canVote = age >= 18 ? "可以投票" : "不能投票";
console.log(canVote); // "可以投票"

// 嵌套三元
let score = 85;
let grade = score >= 90 ? "A" : 
            score >= 80 ? "B" : 
            score >= 70 ? "C" : "D";
console.log(grade); // "B"

8. 逗号运算符

使用场景：
1.在循环中同时操作多个变量
2. 执行多个表达式但只返回最后一个

let a = (1, 2, 3); // a = 3

// 在for循环中使用
for (let i = 0, j = 10; i < j; i++, j--) {
    console.log(i, j);
}

9. 运算符优先级示例

// 了解优先级很重要
let result = 10 + 5 * 2; // 20, 不是30
console.log(result);

// 使用括号明确优先级
let result2 = (10 + 5) * 2; // 30
console.log(result2);

实际应用示例

// 表单验证
function validateForm(email, age) {
    // 使用逻辑运算符进行多重验证
    return email && email.includes('@') && 
           age && age >= 18 && age <= 100;
}

// 权限检查
function checkPermission(user, permission) {
    return user && 
           user.roles && 
           user.roles.includes('admin') || 
           user.permissions.includes(permission);
}

// 计算折扣
function calculateDiscount(price, isMember, coupon) {
    let discount = isMember ? 0.1 : 0; // 会员10%折扣
    discount += coupon || 0; // 加上优惠券折扣
    return price * (1 - discount);
}

// 安全访问嵌套数据
function getUserCity(user) {
    return user?.address?.city ?? "未知";
}

总结
JavaScript 运算符是编程的基础工具，掌握它们的使用方法和适用场景对于编写高效、可读性强的代码至关重要。记住：

1. 了解运算符优先级 - 避免意外的计算结果
2. 使用严格相等 - 避免类型转换带来的问题
3. 利用现代运算符 - 如可选链和空值合并提高代码安全性
4. 适当使用括号 - 提高代码可读性