张家口网站建设价格番禺制作网站企业

在 JavaScript 中，?.、?? 和 || 是三种不同的操作符。
1、?.：可选链操作符

?. 是一个可选链操作符，用于安全地访问嵌套属性，而不用担心中间的某个属性可能为 null 或 undefined，从而避免运行时错误。

const user = {name: "Alice",address: {city: "New York"}
};const city = user?.address?.city; // "New York"
const country = user?.address?.country; // undefined
const name = user?.name; // "Alice"
const age = user?.age; // undefined

2.??:空值合并操作符

?? 是一个空值合并操作符，用于提供默认值。它检查一个值是否为 null 或 undefined，如果是，则返回一个默认值；否则返回该值本身。

const user = {name: "Alice",age: null,hobbies: undefined,address: ""
};const name = user.name ?? "Unknown"; // "Alice"
const age = user.age ?? 25; // 25
const hobbies = user.hobbies ?? ["Reading", "Hiking"]; // ["Reading", "Hiking"]
const address = user.address ?? "No address"; // ""

3.||:逻辑或操作符

|| 是一个逻辑或操作符，用于提供默认值。它检查一个值是否为“falsy”，如果是，则返回一个默认值；否则返回该值本身。

const value = potentiallyFalsyValue || defaultValue;
//如果 potentiallyFalsyValue 是“falsy”（如 0、false、""、null、undefined、NaN 等），value 将是 defaultValue。
//如果 potentiallyFalsyValue 是任何其他值（包括 true、1、"hello" 等），value 将是 potentiallyFalsyValue。

• 如果 potentiallyFalsyValue 是“falsy”（如 0、false、""、null、undefined、NaN 等），value 将是 defaultValue。

• 如果 potentiallyFalsyValue 是任何其他值（包括 true、1、"hello" 等），value 将是 potentiallyFalsyValue。

const user = {name: "Alice",age: 0,hobbies: "",address: null
};const name = user.name || "Unknown"; // "Alice"
const age = user.age || 25; // 25
const hobbies = user.hobbies || ["Reading", "Hiking"]; // ["Reading", "Hiking"]
const address = user.address || "No address"; // "No address"

区别

1. ?.（可选链操作符）

   • 用途：安全地访问嵌套属性，避免因访问 null 或 undefined 而抛出错误。

   • 行为：如果中间的属性是 null 或 undefined，返回 undefined，而不是抛出错误。

   • 示例：user?.address?.city

2. ??（空值合并操作符）

   • 用途：提供默认值，仅当值为 null 或 undefined 时使用默认值。

   • 行为：如果值是 null 或 undefined，返回默认值；否则返回该值本身。

   • 示例：user.age ?? 25

3. ||（逻辑或操作符）

   • 用途：提供默认值，当值为“falsy”时使用默认值。

   • 行为：如果值是“falsy”（如 0、false、""、null、undefined、NaN 等），返回默认值；否则返回该值本身。

   • 示例：user.age || 25

拓展：

Falsy 值

Falsy 值 是那些在布尔上下文中会被转换为 false 的值。JavaScript 中有以下几种 falsy 值：

1. false：布尔值 false。

2. 0：数字 0。

3. -0：负零（在 JavaScript 中，-0 和 0 是等价的，但在某些情况下可以区分）。

4. 0n：BigInt 类型的 0n。

5. ""：空字符串。

6. null：表示“无”的值。

7. undefined：表示未定义的值。

8. NaN：表示“非数字”（Not-a-Number）。

Truthy 值

Truthy 值 是那些在布尔上下文中会被转换为 true 的值。几乎所有不是 falsy 的值都是 truthy 值，包括：

1. 非零数字：如 1, -1, 3.14 等。

2. 非空字符串：如 "hello", "0" 等。

3. 对象：包括数组（如 [1, 2, 3]）、函数（如 function() {}）等。

4. 布尔值 true。

5. 其他所有值：除了上述 falsy 值之外的所有值。