2024年最全JavaScript高级（十五）----promise，达内培训web前端开发

2401_84446610

于 2024-05-07 07:46:17 发布

阅读量158

点赞数 5

分类专栏：程序员文章标签：前端 javascript 开发语言

本文链接：https://blog.csdn.net/2401_84446610/article/details/138517799

版权

程序员专栏收录该内容

161 篇文章 2 订阅

订阅专栏

总结

框架原理真的深入某一部分具体的代码和实现方式时，要多注意到细节，不要只能写出一个框架。
算法方面很薄弱的，最好多刷一刷，不然影响你的工资和成功率😯
在投递简历之前，最好通过各种渠道找到公司内部的人，先提前了解业务，也可以帮助后期优秀 offer 的决策。
要勇于说不，对于某些 offer 待遇不满意、业务不喜欢，应该相信自己，不要因为当下没有更好的 offer 而投降，一份工作短则一年长则 N 年，为了幸福生活要慎重选择！！！

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

喜欢这篇文章文章的小伙伴们点赞+转发支持，你们的支持是我最大的动力！

  })
}

// 请求数据的接口2
function getData2() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      return resolve('getData2')
    }, 3000)
  })
}

btn.addEventListener('click', async () => {
  // 如果用户还没请求完成 则span会显示加载中
  text.innerHTML = '加载中.....'

  try {
    const res1 = await getData1();
    const res2 = await getData2();
    Promise.all([res1, res2])
      // 如果向后端请求的数据 全部请求成功 则把数据渲染到页面上
      .then(res => {
        let strHtml = '';
        res.forEach(item => strHtml += item)
        text.innerHTML = strHtml;
      })
  } catch (err) {
    // 如果reject被执行 会到 catch里面来 .. 可以执行相应的代码
    text.innerHTML = `某个接口请求失败,数据无法渲染`;
    console.log('某一个后端接口请求失败', err)
  }
})




Promise.all


* 接收的是数组，得到的结果也是数组，并且一一对应，也可以理解为Promise.all照顾跑的最慢的，最慢的跑完才结束。
* 只有当所有 Promise 实例都变成 fulfilled 状态，新 Promise 的状态才是 fulfilled 状态，返回所有 promise 实例的 resolve value 数组。
* 如果有一个 Promise 实例状态是 rejected 状态，则新 Promise 的状态是 rejected，返回第一个 promise reject 的 reason。
* 这样我们可以取到不同接口的所有数据。






### 总结

* 框架原理真的深入某一部分具体的代码和实现方式时，要多注意到细节，不要只能写出一个框架。

* 算法方面很薄弱的，最好多刷一刷，不然影响你的工资和成功率😯

* 在投递简历之前，最好通过各种渠道找到公司内部的人，先提前了解业务，也可以帮助后期优秀 offer 的决策。

* 要勇于说不，对于某些 offer 待遇不满意、业务不喜欢，应该相信自己，不要因为当下没有更好的 offer 而投降，一份工作短则一年长则 N 年，为了幸福生活要慎重选择！！！

  **[开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】](https://bbs.csdn.net/topics/618166371)**

![](https://i-blog.csdnimg.cn/blog_migrate/fcf45d5a8b01add7ef49679a488fd710.png)

喜欢这篇文章文章的小伙伴们点赞+转发支持，你们的支持是我最大的动力！