From a22077b849d95f154324c8c516765ab729dd23ed Mon Sep 17 00:00:00 2001
From: kangkai <kangk26@foxmail.com>
Date: Fri, 09 Apr 2021 16:04:39 +0800
Subject: [PATCH] 代码整理
---
Promise.html | 96 ++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 96 insertions(+), 0 deletions(-)
diff --git a/Promise.html b/Promise.html
index e69de29..008df6e 100644
--- a/Promise.html
+++ b/Promise.html
@@ -0,0 +1,96 @@
+<html>
+ <head>
+ <title>Promise</title>
+ <script type='text/javascript'>
+ //1.链式回调 通过多次调用 then() 可以添加多个回调函数，它们会按照插入顺序进行执行。
+ const doSomething = () => new Promise((resolve,reject)=>{setTimeout(() => {
+ console.log("在setTimeout中做了些事");
+ reject();
+ }, 10);});
+ const successCallBack = () => {
+ console.log("成功的回调");
+ };
+ const successCallBack1 = () => new Promise((resolve,reject)=>{setTimeout(() => {
+ console.log("成功的回调1");
+ reject();
+ }, 10);});
+ const failureCallBack = () => {
+ console.log("失败的回调");
+ };
+ //返回Promise对象，输出"在setTimeout中做了些事"文本，但是没有执行reject回调。
+ const promise = doSomething();
+ //执行promise对象的reject回调failureCallBack()，输出“失败的回调”文本，返回promise2对象，由于failureCallBack()方法中没有手动创建Promise所以这里返回的是默认的Promise对象
+ const promise2 = promise.then(successCallBack,failureCallBack);
+ //执行promise2默认回调successCallBack(),返回默认对象promise3
+ const promise3 = promise2.then(successCallBack,failureCallBack);
+ //简写
+ doSomething().then(successCallBack,failureCallBack).then(successCallBack,failureCallBack);
+ //successCallBack1返回用户自己创建的Promise，并且指定了回调函数
+ doSomething().then(successCallBack,failureCallBack).then(successCallBack,failureCallBack).then(successCallBack1,failureCallBack).then(successCallBack,failureCallBack);
+
+ //.catch()、finally()
+ const promise4 = new Promise((resolve,reject)=>{setTimeout(() => {
+ console.log("promise4：在setTimeout中做了些事");
+ console.log("选择路径[A]");
+ resolve("路径：A0");
+ //reject("路径：A1");
+ },10)})
+ .then(resolvePara => new Promise((resolve2,reject2) => {
+ console.log("promise4 then1：成功的回调");
+ throw new Error("是错误哦");
+ console.log(resolvePara);
+ console.log("选择路径[B]");
+ resolve2(resolvePara + " B0");
+ //reject2(resolvePara + " B1");
+ }), rejectPara => new Promise((resolve2,reject2) => {
+ console.log("promise4 then1：失败的回调");
+ console.log(rejectPara);
+ console.log("选择路径[B]");
+ resolve2(resolvePara + " B0");
+ //reject2(resolvePara + " B1");
+ }))
+ .then(resolvePara => new Promise((resolve3,reject3) => {
+ console.log("promise4 then1 then2：成功的回调");
+ console.log(resolvePara);
+ console.log("选择路径[C]");
+ resolve3(resolvePara + " C0");
+ //reject3(resolvePara + " C1");
+ }), rejectPara => new Promise((resolve3,reject3) => {
+ console.log("promise4 then1 then2：失败的回调");
+ console.log(rejectPara);
+ console.log("选择路径[C]");
+ resolve3(resolvePara + " C0");
+ //reject3(resolvePara + " C1");
+ }))
+ .catch(rejectPara => {
+ console.log("promise4 catch：异常的回调");
+ console.log(rejectPara);
+ })
+ .finally(() => {
+ console.log("promise4 finally：执行完毕");
+ })
+ //通常，一遇到异常抛出，浏览器就会顺着 Promise 链寻找下一个 onRejected 失败回调函数或者由 .catch() 指定的回调函数。
+ //finally不管成功失败都会执行内部代码，不接受参数。
+
+
+ //2.在本轮 事件循环 运行完成之前，回调函数是不会被调用的。
+ console.log("在本轮 事件循环 运行完成之前，回调函数是不会被调用的，你看我是最先执行的");
+ //3.即使异步操作已经完成（成功或失败），在这之后通过 then() 添加的回调函数也会被调用。
+ const promise5 = new Promise((resolve)=>{
+ setTimeout(()=>{
+ console.log("promise5 执行的异步操作");
+ resolve();
+ },10);
+ });
+ setTimeout(()=>{
+ promise5.then(() => {
+ console.log("promise5 即使异步操作已经完成（成功或失败），在这之后通过 then() 添加的回调函数也会被调用");
+ });
+ },1000);
+ //3.
+ </script>
+ </head>
+ <body>
+
+ </body>
+</html>
\ No newline at end of file
--
Gitblit v1.9.3