ES2019的实用妙招

2023-10-17 03:31:07

ES2019：JavaScript开发的狂欢节

行分隔符和段分隔符的崛起

过去的编码岁月里，在字符串文字中使用行分隔符和段分隔符是一件麻烦事，它们会被视为行终止符而导致错误。然而，ES2019改变了这一局面，现在，您可以在字符串文字中自由使用这些符号，这在处理多行字符串或与JSON数据交互时非常方便。

示例：

const multilineString = `
    Line 1
    Line 2
    Line 3
`;

console.log(multilineString);

输出：

Line 1
Line 2
Line 3

私有类字段：让数据隐身

ES2019引入的私有类字段可谓是编码界的一大福音。它允许您在类中定义私有字段，这些字段只能在类内部访问，外部世界对它们视而不见。这对于封装数据和提高代码的可维护性大有裨益。

示例：

class Person {
  #name;

  constructor(name) {
    this.#name = name;
  }

  getName() {
    return this.#name;
  }
}

const person = new Person('John Doe');

console.log(person.getName()); // 'John Doe'
console.log(person.#name); // ReferenceError: #name is not defined

输出：

John Doe

可选链式操作符：安全访问的秘密武器

可选链式操作符（?.）是ES2019的另一大亮点。它能够安全地访问可能为null或undefined的对象属性或方法。这个特性让您告别繁琐的条件检查，让代码更加简洁易读。

示例：

const person = {
  name: 'John Doe',
  address: {
    street: '123 Main Street',
    city: 'Anytown',
    state: 'CA',
    zip: '12345',
  },
};

const address = person?.address;
const city = address?.city;

console.log(city); // 'Anytown'

输出：

Anytown

数组的flatMap()方法：扁平化数组的利器

flatMap()方法是ES2019赋予数组的一项强大功能。它将数组的每个元素映射到一个新数组，然后将这些新数组连接成一个单一数组。这个方法在处理嵌套数据结构或将数组元素转换为其他类型的数据时非常有用。

示例：

const numbers = [1, 2, 3, 4, 5];

const doubledNumbers = numbers.flatMap(number => [number, number * 2]);

console.log(doubledNumbers); // [1, 2, 2, 4, 3, 6, 4, 8, 5, 10]