ES2020 nuevas características

Know Promise.all tiene la capacidad de realizar tareas asíncronas simultáneas. Pero su mayor problema es que si una de estas tareas anormalidades (rechazar), todas las tareas se cuelgan, Promise directamente en el estado de rechazo.

Imagínese este escenario: Su página tiene tres regiones, que corresponden a las tres de la interfaz de datos independientes, el uso concurrente Promise.all a tres interfaces, una interfaz de servicios si alguno de la situación anormal se rechazan, lo que puede conducir a las tres páginas todos los datos regionales no puede hacerse debido a rechazar cualquier retroceso entrará en la captura, obviamente, esto es inaceptable, de la siguiente manera:

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: "服务异常"}
})

ventaja Promise.allSettled
necesitamos un mecanismo, si las tareas concurrentes, ya sea una tarea normal o anormal, se devuelve el estado correspondiente (cumplen o rechazadas) y los resultados (debido al valor de negocio o rechazar la razón), entonces pase interior filtro en la lógica de negocio para filtrar el resultado deseado, la accesibilidad de este negocio va a ser capaz de maximizar la protección del estado actual de, y Promise.allSettled es resolver este problema.

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';
  }));
});

ES2020 proporciona una manera fácil: String.prototype.matchAll, que devuelve un iterador

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
]
*/