[快速入门前端 41] JavaScript：运算式和运算子 (2) 指定运算子、比较运算子、逻辑运算子

运算子

指定运算子

指定运算子通常用来指定一个值给变数 ( 赋值 )，最基本的就是我们常用到的运算符 =，会将符号右边的值赋予到左边的变数中。

运算子意义範例=将符号右边的值赋予到左边的变数中a = 3、a = b+=a += b 等同于 a = a + b ( 将 ab 相加后指定回 a 变数 )2 += 1 等于 3-=a -= b 等同于 a = a - b ( 将 a-b 后指定回 a 变数 )2 -= 1 等于 1*=逻辑同 +=，a *= b 等同于 a = a * b2 *= 2 等于 4/=逻辑同 +=，a /= b 等同于 a = a / b6 /= 2 等于 3%=逻辑同 +=，a %= b 等同于 a = a % b5 %= 3 等于 2

範例

let a = 5;console.log(a); // 答案为 5a += 5;console.log(a); // 答案为 10a -= 2;console.log(a); // 答案为 8a/=4;console.log(a); // 答案为 2

比较运算子

比较运算子可以用来比较符号两边运算元的关係，比较后如果关係成立会回传 true，不成立则回传 false。运算元可以是数值、字串、表达式或物件等。而对于不同型态的值，JavaScript 会尝试将他们转型到同样型态后，再做比较，通常是先转到数值型态。

运算子意义範例==等于3 == 3 为 true、2 == 3 为 false!=不等于3 != 3 为 false、2 != 3 为 true===严格等于，不会自动转型，只要型态不同即返回 false2 === 2 为 true、2 === ‘2’案为 false!==严格不等于，不会自动转型，只要型态不同即返回 true2 !== 2 为 false、2 !== ‘2’ 为 true>大于3 > 2 为 true、3 > 3 为 false>=大于等于3 >= 2 为 true、3 >= 3 为 true<小于3 < 4 为 true、3 < 3 为 false<=小于等于3 <= 4 为 true、3 <= 3 为 true

比较运算 - 等于延伸

== 和 != 不严格规範型态，若型态不同会自动转型

console.log(1 == "1"); // trueconsole.log("5" != 5); // false

undefined 和 null 相等

console.log(undefined == null); // true

NaN 和任何值都不相等，包含 NaN 本身

console.log(NaN == null); // falseconsole.log(NaN == NaN); // false

=== 和 !== 会判断类型是否相同

console.log("123" === 123); // false 类型不同，直接为 false (不相等)console.log("123" !== 123); // true 类型不同，直接为 true

比较运算 - 大于和小于延伸

比较运算子通常用来做数字型态的比较，规则与数学中的比大小相同

console.log(5 > 4); // trueconsole.log(4 >= 4); // trueconsole.log(4 < 3); // false

当比较运算子左右两边都是字串型态时，不会将其转为数字型态，而是从第一个字元开始比较

console.log("a" < "bb"); // true (会从第一个字元开始比较，而 a < b)console.log("abc" > "bdf"); // false

当两字串型态的数字比较时会遵循字串比较的规则，所以会造成问题

console.log("11234455" > "5"); // false (会从第一个字元开始比较，而 5 > 1，所以 "5" 比较大)console.log("55" < "545"); // false (若第一个字元相同则往下比第二个字元)

逻辑运算子

逻辑运算子是用来做布林值的逻辑判断，会根据内容回传 true 或 false，主要有 && 、||、! 三种运算符号，分别代表 且、或、非。

运算子意义範例&&且 ( 运算子前后都必须为 true )3 == 3 && 4 == 4 为 true ( 前后皆为 true )、2 == 3 && 4 == 4 为 false``!非 ( 表否定，逻辑为 false 则为 true )!3 == 2 为 true ( 因为 3 == 2 为 false)

&& 範例：必须满足所有条件才成立 (为 true)

语意为 且，每个条件都为 true 时才返回 true

console.log(true && true); //trueconsole.log(false && true); // false (任一条件为 false 时即不成立)console.log(false && false); // false

多个 && 连接

console.log(true && true && true); // true console.log(true && false && true); // false console.log(false && true && true); // false  console.log(false && false && true); // false 

结合比较运算子和变数

console.log(2==2 && 3-1==2); // truelet a = 10;let b = 5;console.log(a > 1 && b < 6); // trueconsole.log(a > 10 && b < 6); // false (前者为 false)console.log(a > 10 && b < 3); // false (两者皆 false)

|| 範例：满足任一条件就成立 (为 true)

语意为 或，只要有一个条件是 true 就返回 true

console.log(true || true); // true console.log(true || false); // true (满足一个条件)console.log(false || true); // true (满足一个条件)console.log(false || false); // false (无满足条件，两者皆 false)

多个 || 连接

console.log(true || true || true); // true console.log(true || false || true); // true console.log(false || true || true); // trueconsole.log(false || false || false); // false

结合比较运算子和变数

console.log(2==2 || 2-1==1); // true console.log(2==3 || 2-1==1); // true (后者为 true)console.log(2==3 || 2-1==2); // false (两者皆 false)

! 範例：表示否定

语意为 非，会回传相反值

console.log(!true); // falseconsole.log(!false); // true

与其他逻辑运算子和比较运算子共同使用

console.log(!false && 2==2); // trueconsole.log(!true || 2==3 ); // falseconsole.log(!false ); // true

---

上一篇：[快速入门前端 40] JavaScript：运算式和运算子 (1) 算数运算子和一元运算子
下一篇：[快速入门前端 42] JavaScript：运算式和运算子 (3) 三元运算子与运算子的优先性
系列文章列表：[快速入门前端] 系列文章索引列表