你必须知道的 7 种 JavaScript 运算符

运算符是一个符号，它告诉解释器执行特定的数学、关系或逻辑运算。运算符采用一个或多个操作数，并能够操纵目标值或操作数。

在本文中，您将通过示例了解 JavaScript 中的不同运算符以及如何使用它们。

这些是 JavaScript 支持的各种运算符：

  • 算术运算符
  • 赋值运算符
  • 字符串运算符
  • 比较运算符
  • 逻辑运算符
  • 按位运算符
  • 特殊运算符

    • 您可以使用算术运算符对操作数执行数学计算。JavaScript 提供了以下算术运算符：

    您可以使用加法运算符 ( + ) 对操作数执行加法。

    let a = 12;
    let b = 10;
    let result = a+b;
    console.log(result)
    console.log(1+2);
    console.log(a+6);

    输出：

    22
    3
    18

    使用减法运算符 ( - ) 从左操作数中减去右操作数。

    let a = 10;
    let b = 4;
    let result = a-b;
    console.log(result);
    console.log(23-20);

    输出：

    6
    3

    使用乘法运算符 ( * ) 将操作数相乘。

    let a = 10;
    let b = 4;
    let result = a*b;
    console.log(result);
    console.log(23*20);

    输出：

    40
    460

    您可以使用除法运算符 ( / ) 对操作数进行除法。

    let a = 10;
    let b = 4;
    let result = a/b;
    console.log(result);
    console.log(40/20);

    输出：

    2.5
    2

    模运算符 ( % ) 通过将两个操作数相除来返回整数余数。

    let a = 10;
    let b = 4;
    let result = a%b;
    console.log(result);
    console.log(40%20);

    输出：

    2
    0

    求幂运算符 ( ** ) 计算指数幂的底数 (base^exponent)。

    let a = 3;
    console.log(a**4);

    输出：

    81

    增量运算符 ( ++ ) 将整数值加一。

    let a = 3;
    // Value of a=4 and returns 4
    console.log(++a);
    // Value of a=5 and returns 4
    console.log(a++);
    // Value of a=5 and returns 5
    console.log(a);

    输出：

    4
    4
    5

    递减运算符 ( -- ) 将整数值减一。

    let a = 3;
    // Value of a=2 and returns 2
    console.log(--a);
    // Value of a=1 and returns 2
    console.log(a--);
    // Value of a=1 and returns 1
    console.log(a);

    输出：

    2
    2
    1

    一元加号运算符 ( + ) 会尝试将操作数转换为一个数字（如果它不是一个数字）。

    console.log(typeof("10"));
    console.log(typeof(+"10"));
    console.log(typeof(false));
    console.log(typeof(+false));

    输出：

    string
    number
    boolean
    number

    一元否定运算符 ( - ) 返回其操作数的否定。

    let a = 10;
    console.log(-a);

    输出：

    -10

    使用赋值运算符为变量赋值。JavaScript 提供了以下赋值运算符：

    您可以使用赋值运算符 ( = ) 将右操作数值分配给左操作数。

    // Assigning 10 to a
    let a = 10;
    console.log(a);

    输出：

    10

    加法赋值运算符 ( += ) 用于将左操作数和右操作数的值相加，并将结果分配给左操作数。

    let a = 10;
    let b = 5;
    // Equivalent to a = a+b
    a += b;
    console.log(a);

    输出：

    15

    减法赋值运算符 ( -= ) 将从左操作数中减去右操作数，并将结果分配给左操作数。

    let a = 10;
    let b = 5;
    // Equivalent to a = a-b
    a -= b;
    console.log(a);

    输出：

    5

    使用乘法赋值运算符 ( *= ) 将左操作数和右操作数的值相乘，并将结果分配给左操作数。

    let a = 10;
    let b = 5;
    // Equivalent to a = a*b
    a *= b;
    console.log(a);

    输出：

    50

    您可以使用除法赋值运算符 ( /= ) 将左操作数值除以右操作数值并将结果分配给左操作数。

    let a = 10;
    let b = 5;
    // Equivalent to a = a/b
    a /= b;
    console.log(a);

    输出：

    2

    余数赋值运算符 ( %= ) 将左操作数除以右操作数，并将余数分配给左操作数。

    let a = 10;
    let b = 5;
    // Equivalent to a = a%b
    a %= b;
    console.log(a);

    输出：

    0

    幂赋值运算符 ( **= ) 将左操作数提高到右操作数的幂，并将结果分配给左操作数。

    let a = 10;
    let b = 5;
    // Equivalent to a = a**b
    a **= b;
    console.log(a);

    输出：

    100000

    按位赋值运算符（<<=、>>=、>>>=、&=、^=、|=、&&=、||=、??=）的工作方式类似。您将在接下来的部分中了解按位运算符。

    连接运算符 ( + ) 用于连接（添加）字符串。

    let result = "Make" + "Use" + "Of";
    console.log(result);

    输出：

    MakeUseOf

    比较运算符用于比较操作数，并在比较的基础上返回一个逻辑值（真或假）。JavaScript 提供了以下比较运算符：

    如果操作数相等，则相等运算符 ( == ) 返回true。它只比较操作数的值，在比较时忽略它们的类型。

    console.log(2==4);
    console.log("2"==2);

    输出：

    false
    true

    如果操作数不相等，则不相等运算符 ( != ) 返回true。它在比较时也会忽略操作数的类型。

    console.log(2!=4);
    console.log(2!="2");

    输出：

    true
    false

    如果操作数相等，则严格相等运算符 ( === ) 返回true。它比较两者——比较时操作数的值和类型。

    console.log(2===4);
    console.log("2"===2);

    输出：

    false
    false

    如果操作数不相等，则严格不等于运算符 ( !== ) 返回true。它还比较两者——比较时操作数的值和类型。

    console.log(2 !== 4);
    console.log(2 !== "2");

    输出：

    true
    true

    如果左操作数大于右操作数，则大于运算符 ( > ) 返回 true。

    console.log(10>4);
    console.log(5>5);

    输出：

    true
    false

    如果左操作数大于或等于右操作数，则大于或等于运算符 ( >= ) 返回 true。

    console.log(10 >= 4);
    console.log(5 >= 5);

    输出：

    true
    true

    如果左操作数小于右操作数，则小于运算符 ( < ) 返回 true。

    console.log(10<4);
    console.log(5<5);

    输出：

    false
    false

    如果左操作数小于或等于右操作数，则小于或等于运算符 ( <= ) 返回 true。

    console.log(10 <= 4);
    console.log(5 <= 5);

    输出：

    false
    true

    根据官方MDN Docs，JavaScript 提供了以下逻辑运算符：

    用法：expr1 && expr2

    如果可以转换为 false，则返回 expr1；否则，返回 expr2。当布尔值，使用&&返回真如果两个操作数都是真实的; 否则，它返回false。

    console.log(true && false);

    输出：

    false

    用法：expr1 || 表达式2

    如果可以转换为 true，则返回 expr1；否则，返回 expr2。当与布尔值一起使用时，|| 返回真如果操作数是真实的; 如果两者都为假，则返回false。

    console.log(true || false);

    输出：

    true

    用法：!expr

    如果它的单个操作数可以转换为真，则返回假；否则，返回true。

    console.log(!true);

    输出：

    false

    JavaScript 提供以下按位运算符：

    此运算符对其整数参数的每一位执行布尔与运算。

    // In binary-
    // 4: 100
    // 1: 001
    console.log(4 & 1);

    输出：

    0

    此运算符对其整数参数的每一位执行布尔OR运算。

    console.log(4 | 1);

    输出：

    5

    此运算符对其整数参数的每一位执行布尔异或运算。

    console.log(4 ^ 1);

    输出：

    5

    此运算符反转操作数中的所有位。

    console.log(~4);

    输出：

    -5

    注意：JavaScript 在执行按位运算之前将数字转换为 32 位有符号整数。并且在执行操作时，它将结果转换回 64 位 JavaScript 数字。

    此运算符将其第一个操作数中的所有位向左移动第二个操作数中指定的位数。

    console.log(4<<1);

    输出：

    8

    此运算符将其第一个操作数中的所有位右移第二个操作数中指定的位数。

    console.log(4>>1);

    输出：

    2

    三元运算符是if-else 语句的简写。它根据条件为变量赋值，相同的语法是：

    condition ? value1 : value2

    如果条件为真，则运算符返回value1 的值。否则，它返回value2 的值。

    let result = (200>100) ? "Yes" : "No";
    console.log(result);

    输出：

    Yes

    该typeof运算操作用于查找一值或变量的数据类型。

    console.log(typeof(100));
    console.log(typeof("100"));

    输出：

    number
    string

    您可以在 JavaScript 中使用一行代码执行各种操作。无论您是需要对数组进行 shuffle，在浏览器中检测暗模式，生成随机 UUID，还是查找数组的平均值，都可以通过一行代码实现。

    标签: JavaScript 编程 编码技巧 Web开发