ES 2022 即将新增特性

1. error.cause

这是一个关于错误捕获的特性，下文代码列举了过去我们常使用的三种捕获错误的方式。

async function test() {
  const fileInfo= await fetch('/test')
    .catch(err => {
      // 下面三种是过去常用的一些捕获错误的代码方式
      
      // 1. throw new Error('下载资源失败: ' + err.message);
      
      // 2. const wrapErr = new Error('下载资源失败');
      //    wrapErr.cause = err;
      //    throw wrapErr;
      
      // 3. class CustomError extends Error {
      //      constructor(msg, cause) {
      //        super(msg);
      //        this.cause = cause;
      //      }
      //    }
      //    throw new CustomError('下载失败', err);
    })
}

await test(); // => Uncaught Error: 下载失败: Failed to fetch

新特性是在 Error 构造函数上添加一个附加选项参数 cause，其值将作为属性分配给错误实例。因此，可以将错误链接起来。

async function test() {
  const fileInfo= await fetch('/test')
    .catch(err => {
      throw new Error('下载资源失败', { cause: err });
    });
}

try {
  await test();
} catch (e) {
  console.log(e);
  console.log('Caused by', e.cause);
}
// Error: 下载资源失败
// Caused by TypeError: Failed to fetch

2. Top-level await

意思就是可以再顶部使用await 实际

实际使用的场景
例如动态加载模块

const strings = await import(`/i18n/${navigator.language}`);

3. Object.hasOwn(obj, propKey)

这是检查obj对象自身属性propKey的一种安全方法。它类似于Object.prototype.hasOwnProperty但它支持所有对象类型。

const proto = {
  protoProp: 'protoProp',
};
 
const obj = {
  __proto__: proto,
  objProp: 'objProp',
};
 
console.log('protoProp' in obj); // output - true.
console.log(Object.hasOwn(obj, 'protoProp')) // output - false
console.log(Object.hasOwn(proto, 'protoProp')); // output - true.