JavaScript 新特性概览

JavaScript 作为前端开发的核心技术之一，每年都会带来许多新的特性和改进。以下是一些 JavaScript 的新特性，让我们一起来看看吧！

新特性列表

1. Promise.any()

   • Promise.any() 方法接受一个 promise 可迭代的参数，并返回一个新的 promise。这个新的 promise 在传入的 promise 中任何一个被解决（fulfilled）后，也会被解决，并且返回第一个被解决的值。

2. WeakRef

   • WeakRef 对象允许你创建一个弱引用到对象，弱引用不会阻止垃圾回收器回收该对象。

3. 可选链操作符 (?.)

   • 可选链操作符 ?. 允许你安全地访问嵌套对象属性，即使某些属性可能不存在。

4. 空值合并运算符 (??)

   • 空值合并运算符 ?? 会返回它的左侧操作数，如果左侧操作数是 null 或 undefined，否则返回右侧操作数。

5. 动态导入 (import())

   • import() 函数允许你动态地导入模块，这对于按需加载和分割代码非常有用。

图片展示

Promise.any() 示例

const promise1 = new Promise((resolve, reject) => {
  setTimeout(() => resolve('Promise 1 resolved'), 1000);
});

const promise2 = new Promise((resolve, reject) => {
  setTimeout(() => resolve('Promise 2 resolved'), 500);
});

Promise.any([promise1, promise2]).then((value) => {
  console.log(value);
});

WeakRef 示例

const myObject = { name: 'JavaScript' };

const weakRef = new WeakRef(myObject);

console.log(weakRef.deref()); // 输出: { name: 'JavaScript' }

myObject = null;

console.log(weakRef.deref()); // 输出: undefined

可选链操作符示例

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

console.log(user.profile?.address?.city); // 输出: 'New York'

空值合并运算符示例

const message = null;
const defaultValue = 'Default message';

console.log(message ?? defaultValue); // 输出: 'Default message'

动态导入示例

async function loadModule() {
  const module = await import('./module.js');
  console.log(module);
}

loadModule();

扩展阅读

想要了解更多关于 JavaScript 新特性的信息，可以访问我们的 JavaScript 新特性文档。

希望这些新特性能够帮助你更好地开发 JavaScript 应用程序！🎉