60. nodeJs和前端es的相同和不同-CSDN博客

本文链接：https://blog.csdn.net/qq_30811721/article/details/132158035

59期问题及答案

1. 什么是可选链操作符，请举例说明

可选链操作符（Optional Chaining Operator）是ES11（ES2020）中引入的一个新特性，它允许我们在访问可能不存在的属性或方法时，避免出现错误，并且简化了对多层嵌套对象的访问。它使用问号（?）来标识。

在使用可选链操作符之前，我们可能需要使用多个条件判断来确保对象或属性存在，例如：

if (obj && obj.foo && obj.foo.bar) {
  // 处理 obj.foo.bar
}

而使用可选链操作符后，可以通过一种更简洁的方式来访问多层嵌套对象的属性：

if (obj?.foo?.bar) {
  // 处理 obj.foo.bar
}

当属性或方法不存在时，可选链操作符会返回undefined，而不是抛出错误。这样，我们可以在代码中直接使用可选链操作符来访问可能不存在的属性，而无需手动进行多次条件判断。

下面是一个示例：

const user = {
  name: 'Alice',
  address: {
    city: 'New York',
    zipcode: '12345'
  }
};

// 使用可选链操作符访问可能不存在的属性
const city = user?.address?.city; // 'New York'
const country = user?.address?.country; // undefined

console.log(city);
console.log(country);

在上面的示例中，user对象中存在address属性，因此user?.address?.city会返回'New York'。而user?.address?.country中country属性并不存在，所以返回undefined。这样，我们可以安全地访问嵌套对象的属性，而不用担心因为属性不存在而导致的错误。

2. 知道解构吗？下面的数据结构如何一行直接结构出数组第一项数据

// 如何一行代码取出下面list的第一项

const res = {data: {list: [{id: 1}]}}

可以使用解构一行代码来取出res.data.list的第一项数据，如下所示：

const { data: { list: [firstItem] } } = res;

在上述代码中，我们使用了对象解构的语法，{ data: { list: [firstItem] } }表示从res对象中解构出data属性，然后从data属性中解构出list属性，并将其中的第一项数据赋值给firstItem变量。最终firstItem变量的值为{ id: 1 }，即res.data.list的第一项数据。

3. 了解？？操作符吗？说明其用途及使用场景

它是空值合并操作符（Nullish Coalescing Operator）。

空值合并操作符用于判断一个值是否为 null 或 undefined，如果是，则返回一个指定的默认值，否则返回该值本身。

其语法为：a ?? b

其中，a是要检查的值，b是默认值。如果a的值为 null 或 undefined，则返回b；否则返回a的值。

空值合并操作符主要用于简化处理可能为 null 或 undefined 的情况，并提供一个默认值。

例如：

const name = null;
const defaultName = "John";
const result = name ?? defaultName;
console.log(result); // Output: "John"

在上述例子中，name的值为 null，使用空值合并操作符，将返回defaultName的值，即输出为 "John"。

使用场景包括：

设置默认参数值：

function greet(name) {
  const defaultName = "Guest";
  const result = name ?? defaultName;
  console.log(`Hello, ${result}!`);
}

greet(); // Output: "Hello, Guest!"
greet("Alice"); // Output: "Hello, Alice!"

处理对象属性：

const person = { name: null, age: 25 };
const defaultName = "Unknown";

const name = person.name ?? defaultName;
const age = person.age ?? 0;

console.log(name); // Output: "Unknown"
console.log(age); // Output: 25

在上述例子中，通过空值合并操作符，我们为可能为 null 的属性提供了默认值。

请注意，空值合并操作符仅在值为 null 或 undefined 时才会返回默认值，对于其他“假值”（如空字符串、false、0）都不会触发默认值的返回。