网站建设困难,上海传媒公司电话,免费视频网站建设,中国第八冶金建设公司网站第一次学的时候没学牢固
后面意识到promise的重要性之后 陆陆续续的看、查#xff0c;终于在今天 感觉好像明白点了
把自己敲的理解分享给大家 !DOCTYPE html html langen head meta charsetUTF-8 meta name终于在今天 感觉好像明白点了
把自己敲的理解分享给大家 !DOCTYPE html html langen head meta charsetUTF-8 meta nameviewport contentwidthdevice-width, initial-scale1.0 titlepromise/title /head body script // use strict 严格模式下 函数内this为undefined // console.log(this); // function myFunction() { // return this; // } // promise三个状态 pending初始 fulfilled成功 rejected失败 // 构造promise对象时候 传入的参数是一个函数 函数中接收两个参数 // resolve reject 都是函数 作用大概可以理解为 // 执行resolve时 把promise的状态从初始变成成功 promise状态变成fulfilled 执行.then方法 // then方法接受的参数也是一个函数 函数中携带一个参数 参数是resolve(res)返回的数据 // 执行reject时 把promise的状态从成功变成失败 promise状态变成rejected 执行catch方法 // catch方法接受的也是一个函数 函数中携带一个参数 该参数为rejecterr返回的数据 // promise的状态变化只有两条线 初始到成功或者初始到失败 状态一旦固定 就不会再发生改变 // 以下代码易证上述观点 const p new Promise((resolve, reject) { resolve(成功且执行.then) reject(失败且执行.catch) }) p.then((res) { console.log(res) }).catch((err) { console.log(err); }) // 以下代码为promise的链式调用 const pp new Promise((resolve, reject) { setTimeout(() { resolve(a) }, 1000) }).then(res { // console.log(res1, res); return new Promise((resolve, reject) { setTimeout(() { resolve(res a) }, 1000) }).then(res { // console.log(res2, res); return new Promise((resolve, reject) { setTimeout(() { resolve(res a) }, 1000) }) }).then(res { // console.log(res3, res); }) }) // 有些多余 看看如何简写使之优雅 // reject 如果不需要处理失败结果时 我们可以省略掉reject const ppp new Promise(resolve { resolve(a) }).then(res { // console.log(res4, res); return new Promise(resolve { resolve(res a) }) }).then(res { // console.log(res5, res); return new Promise(resolve { resolve(res a) }) }).then(res { // console.log(res6, res); }) // Promise 嵌套使用时 内层的Promise可以省略不写 所以我们可以直接把Promise相关的去掉 直接返回 const pppp new Promise(resolve { resolve(a) }).then(res { // console.log(res4, res);· return res a }).then(res { // console.log(res5, res); return res a }).then(res { // console.log(res6, res); }) // 再来简写个reject参数的promise链式调用 const pppppp new Promise((resolve, reject) { reject(a) }).catch(err { // console.log(err1, err); return new Promise((resolve, reject) reject(err a)) }).catch(err { // console.log(err2, err) return new Promise((resolve, reject) reject(err a)) }).catch(err { // console.log(err3, err); }) // 再把嵌套使用内层promise简化一下 把resolve去一下 注意 如果简化内层promise 需要将return换成throw const ppppppp new Promise((resolve, reject) { reject(a) }).catch(err { // console.log(err1, err); throw err a }).catch(err { // console.log(err2, err) throw err a }).catch(err { // console.log(err3, err); }) // promise的all方法 // promise.all方法 提供并行执行异步操作的能力 在所有异步操作完成之后 同意返回所有的结果 具体使用如下 // 重点是所有的异步操作完成之后 Promise.all( [ new Promise(resolve { resolve(ac) }), new Promise(resolve { resolve(bv) }) ] ).then(res { console.log(all, res); }) // all 接收到的是一个Promise实例化对象数组 数组长度取决于 Promise实例化对象的个数。 // 一般用于一些游戏类的素材比较多的应用打开网页时预先加载需要用到的各类资源所有的都加载完后再进行页面的初始化。 // promise的race方法 // 他的使用和all一样 返回结果不同 他是返回执行最快的那个promise Promise.race( [ new Promise(resolve { setTimeout(() { resolve(快的) }, 100) }), new Promise(resolve { setTimeout(() { resolve(慢的) }, 300) }) ] ).then(res { console.log(race, res); }) /script /body /html 大家最好跟着敲一下 因为确实迷糊 跟着敲 体会可能还好点
如果这些代码能对诸位有些许帮助 我会不胜荣幸
