ES2020の新機能

知っPromise.allは、同時非同期タスクを実行する能力を持っています。しかし、その最大の問題は、これらのタスクの異常の一つは、(拒否)場合は、すべてのタスクの状態が拒否に直接、約束をハングアップするということです。

このシナリオを想像して:あなたのページには、3つのページにつながる異常な状況ISのいずれかが拒否した場合に三つの独立したインターフェイスデータ、3つのインタフェース、一つのインタフェースサービスへの同時使用Promise.allに対応する3つの領域を、持っています任意のプルバックはキャッチを入力します拒否しているため、すべての地域のデータをレンダリングすることができない、次のように、明らかに、これは、受け入れられません。

Promise.all([
  Promise.reject({code: 500, msg: '服务异常'}),
  Promise.resolve({ code: 200, list: []}),
  Promise.resolve({code: 200, list: []})
])
.then((ret) => {
  // 如果其中一个任务是 reject,则不会执行到这个回调。
  console.log(res)
  RenderContent(ret);
})
.catch((error) => {
  // 本例中会执行到这个回调
  console.log(error)
  // error: {code: 500, msg: "服务异常"}
})

Promise.allSettled利点
我々は同時タスク、どちらか正常か異常なタスクは、対応するステータス(履行または拒否)、その結果(によるビジネス価値へか理由を拒否)を返した場合、その内部にフィルタを通過し、メカニズムが必要です望ましい結果アウトフィルタへのビジネス・ロジックは、この事業のアクセシビリティの現在の状態の保護を最大化することができるようになります、とPromise.allSettledは、この問題を解決することです。

Promise.allSettled([
  Promise.reject({code: 500, msg: '服务异常'}),
  Promise.resolve({ code: 200, list: []}),
  Promise.resolve({code: 200, list: []})
])
.then((ret) => {
  /*
      0: {status: "rejected", reason: {...}}
      1: {status: "fulfilled", value: {...}}
      2: {status: "fulfilled", value: {...}}
  */
  // 过滤掉 rejected 状态,尽可能多的保证页面区域数据渲染
  RenderContent(ret.filter((el) => {
      console.log(el)
      return el.status !== 'rejected';
  }));
});

String.prototype.matchAll、イテレータを返します。ES2020は、簡単な方法を提供します

var str = '<text>JS</text><text>正则</text>';
var allMatchs = str.matchAll(/<\w+>(.*?)<\/\w+>/g);

for (const match of allMatchs) {
  console.log(match);
}
/*
第一次迭代返回:
[
    "<text>JS</text>",
    "JS",
    index: 0,
    input: "<text>JS</text><text>正则</text>",
    groups: undefined
]

第二次迭代返回:
[
    "<text>正则</text>",
    "正则",
    index: 15,
    input: "<text>JS</text><text>正则</text>",
    groups: undefined
]
*/
公開された155元の記事 ウォン称賛57 ビュー60000 +

おすすめ

転載: blog.csdn.net/weixin_43764814/article/details/104463555