南郑县城乡建设局网站,济南公司做网站,好订单网服装加工接单,物流公司怎么做Promise击鼓传花的游戏 Promise系列导航前言一、学习Promise的原因二、揭开击鼓传花游戏的面纱补充小知识 Promise系列导航 1.Promise本质击鼓传花的游戏 2.Promise四式击鼓 3.Promise击鼓传花 4.Promise花落谁家知多少 前言 #x1f468;#x1f4bb;#x1f468;… Promise击鼓传花的游戏 Promise系列导航前言一、学习Promise的原因二、揭开击鼓传花游戏的面纱补充小知识 Promise系列导航 1.Promise本质击鼓传花的游戏 2.Promise四式击鼓 3.Promise击鼓传花 4.Promise花落谁家知多少 前言 记录学习成果以便温故而知新 Promise系列文章是本人学习VUE的准备知识所以就归为VUE系列了。根据MDN的描述应该是“JavaScript 标准内置对象”特此说明。Promise系列文章主要是学习MDN中 Promise的心得体会MDN地址。 一、学习Promise的原因
在学VUE时遇到了如下代码如何返回的问题。
html2canvas(this.$refs.imgBox, {height: this.$refs.imgBox.scrollHeight, width: this.$refs.imgBox.scrollWidth,
}).then((canvas) {canvas.toDataURL(image/png)
});然后发现这好像是Promise知识点然后发现如下方法能解决
async saveImg(){const img await getImg();
}
getImg(){return html2canvas(this.$refs.imgBox, {height: this.$refs.imgBox.scrollHeight, width: this.$refs.imgBox.scrollWidth,}).then((canvas) {return canvas.toDataURL(image/png)});
}二、揭开击鼓传花游戏的面纱
MDN说 Promise 对象表示异步操作最终的完成或失败以及其结果值。 MDN又说 一个 Promise 必然处于以下几种状态之一 待定pending初始状态既没有被兑现也没有被拒绝。已兑现fulfilled意味着操作成功完成。已拒绝rejected意味着操作失败。 MDN然后是一张状态图看着挺美由于害怕有盗图嫌疑就不贴过来了。
回归正题上一段经典代码
new Promise((resolve, reject) {console.log(构造函数内: (typeof resolve));//就没人好奇resolve究竟是个啥console.log(构造函数内: (typeof reject));//就没人好奇reject究竟是个啥console.log(开始击鼓);Math.random()0.5 ? resolve(紫牡丹) : reject(黄牡丹)
})
.then(flower { console.log(flower); return 魏紫 }, flower { console.log(flower); return 姚黄 })
.then(flower console.log(flower))
.catch(flower console.log(flower))//由于代码中没有抛出异常这行并不执行
.finally(() console.log(姚黄魏紫开次第不觉成恨俱零凋));console.log(构造函数外: (typeof resolve));//就没人好奇resolve究竟是个啥
console.log(构造函数外: (typeof reject));//就没人好奇reject究竟是个啥两次的执行结果 从以上代码与执行结果看除了好奇的输出外正好是个击鼓传花的过程。
基于“击鼓传花”的游戏把状态按照游戏的语境重新定义一下
状态游戏中 待定pending开始击鼓已兑现fulfilled合称敲定传紫牡丹统称传花已拒绝rejected传黄牡丹
由于MDN每个方法基本都是洋洋洒洒的大段所以后面分“Promise四式击鼓”、“Promise击鼓传花”与“Promise花落谁家知多少”三个专题来介绍
以下3个方法在“Promise四式击鼓”专题介绍 Promise() constructorPromise.reject()Promise.resolve()async function 以下3个方法在“Promise击鼓传花”专题介绍 Promise.prototype.then()Promise.prototype.catch()Promise.prototype.finally() 以下4个方法在“Promise花落谁家知多少”专题介绍 Promise.all()Promise.any()Promise.race()Promise.allSettled() 补充小知识
魏紫姚黄原指宋代洛阳两种名贵牡丹品种一出于魏仁浦家一出于姚氏民家故以此为名。后泛指名贵花卉。也作“姚黄魏紫”。出处宋·欧阳修《绿竹堂独饮》诗:“姚黄魏紫开次第不觉成恨俱零凋。” 以上的出处来自某度老师。
既然玩的是击鼓传花的游戏那就要传高雅的“魏紫姚黄”因为“姚黄”也就是黄牡丹她有个“黄”字所以只能委屈其代表“已拒绝”。