逻辑运算符 - JS

真值与假值

  1. 无、空、未定义、零等,一般被计算机认为是假;
  2. 有、非空、已定义、非零等,一般被计算机认为是真;
  3. 能够布尔转化为 true 的值叫做真值,能够布尔转化为 false 的值叫做假值
  4. 能够布尔转化为 false 的表达式的如下:
    • null
    • NaN
    • 0
    • 空字符串(""'' 或 ``);
    • [];
    • undefined

与(&&

  1. 基本语法:x && y
  2. 含义:(从左往右运算)如果 x 为假值就得到 x,否则得到 y;
  3. 可以级联:x && y && zx && y || z(与或级联);
  4. 可以是值、表达式、语句(x, y, z);
  5. 优先级比或高;
  6. 特性:
    • 从左往右,遇到真值继续向右执行、遇到假值立刻停止(假止)并返回;
    • 全部为真值时,就得到最后一个数据或执行最后一个语句(取尾)。
1 && 0 && 100		// 0
1 && 10 && 100		// 100
a && b || c && d	// 等价于 (a && b) || (c && d)

或(||

  1. 基本语法:x || y
  2. 含义:(从左往右运算)如果 x 为真值就得到 x,否则得到 y;
  3. 可以级联:x || y || zx || y && z(或与级联);
  4. 可以是值、表达式、语句(x, y, z);
  5. 优先级比与低;
  6. 特性:
    • 从左往右,遇到假值继续向右执行、遇到真值立刻停止(真止)并返回;
    • 全部为假值时,就得到最后一个数据或执行最后一个语句(取尾)。
0 || 1 || ''		// 1
0 || null || ''		// ''
a && b || c && d	// 等价于 (a && b) || (c && d)

非(!

  1. 语法:!x
  2. 含义:将 x 转换成布尔值后取反
  3. 结果是一个布尔值;
  4. 比其他逻辑运算符优先级都高。

空值合并运算符(??

意义

  1. 传统与或非都是将(表达式/值/语句)转成布尔值(true/false),再进行逻辑运算;
  2. 但是诸如 0''[] 等会被转成 false 的数据,在很多场景下都是有效值,不应该被忽略;
  3. 空值合并,只针对 nullundefined,所以不用转成布尔值,而是直接判断数据类型,进而运算。

使用

  1. 语法:x ?? y
  2. 含义:(从左往右运算)如果 x 既不是 null 也不是 undefined 就得到 x,否则得到 y;
  3. 自级联x ?? y ?? z
  4. 可以是值、表达式、语句(x, y, z);
  5. 特性:和 || 相似;
  6. 注意:
    • ?? 不能与 &&||混合级联使用,需要使用小括号错开优先级
    • 常用于分配默认值,即给 x 分配默认值 y。
1 && 0 ?? 1		// 报错
(1 && 0) ?? 1	// 不报错
let onShowName;
onShowName = username ?? '匿名'		// 当 username 为 null 或未定义时,显示 匿名
/* 下面是一个等效表达 */
onShowName = (username !== null && username !== undefined) ? username : onShowName;

使用与或代替条件语句

根据 &&|| 的特性:

  1. 代替单 if 语句:条件 && 语句1当条件为真值时,继续执行语句1
  2. 代替单 if 语句:条件 && 语句1当条件为假值时,继续执行语句1
  3. 与或 代替 if-else 语句:条件 && 语句1 || 语句2当条件为真值时,执行语句1,否则执行语句2
/* 一个比较大小的函数 */
function compare(a, b) { return a > b && a || b; }
/* 下面是一个等效表达 */
function compare(a, b) {
	if (a > b) {
		return a;
	}
	else {
		return b;
	}
}

你可能感兴趣的:(#,JS,基本语法,javascript,前端,学习,笔记,ecmascript)