|
|
@@ -0,0 +1,113 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang="en">
|
|
|
+
|
|
|
+<head>
|
|
|
+ <meta charset="UTF-8">
|
|
|
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
+ <title>Document</title>
|
|
|
+</head>
|
|
|
+
|
|
|
+<body>
|
|
|
+ <script>
|
|
|
+ /**
|
|
|
+ * js执行机制
|
|
|
+ * 单线程
|
|
|
+ * 同步代码 异步代码
|
|
|
+ * Promise 将异步转为同步流程的对象
|
|
|
+ * 三种状态
|
|
|
+ * pending 等待
|
|
|
+ * fulfilled 成功
|
|
|
+ * reject 失败
|
|
|
+ * 状态一旦改变 不可逆
|
|
|
+ */
|
|
|
+ // setTimeOut setInterval
|
|
|
+ // 基础写法
|
|
|
+ new Promise((resolve, reject) => {
|
|
|
+ setTimeout(() => {
|
|
|
+ console.log("你好")
|
|
|
+ }, 2000)
|
|
|
+ // resolve();
|
|
|
+ reject();
|
|
|
+ }).then(res => {
|
|
|
+ console.log('1')
|
|
|
+ }).catch(err => {
|
|
|
+ console.log('2')
|
|
|
+ }).finally(() => {
|
|
|
+ // 无论结果 成功失败 全部执行
|
|
|
+ console.log("哈哈哈哈")
|
|
|
+ })
|
|
|
+ // 链式调用
|
|
|
+ // const news = new Promise((resolve, reject) => {
|
|
|
+ // setTimeout(() => {
|
|
|
+ // console.log("你好")
|
|
|
+ // resolve();
|
|
|
+ // reject();
|
|
|
+ // }, 2000)
|
|
|
+ // })
|
|
|
+
|
|
|
+ // news.then(res => {
|
|
|
+ // console.log('11')
|
|
|
+ // })
|
|
|
+ // news.catch(err => {
|
|
|
+ // console.log('22')
|
|
|
+ // })
|
|
|
+
|
|
|
+ // 回掉地狱
|
|
|
+ // setTimeout(() => {
|
|
|
+ // setInterval(() => {
|
|
|
+ // setTimeout(() => {
|
|
|
+ // })
|
|
|
+ // })
|
|
|
+ // })
|
|
|
+
|
|
|
+ // 静态方法
|
|
|
+ const p1 = new Promise((resolve, reject) => {
|
|
|
+ resolve();
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ const p2 = new Promise((resolve, reject) => {
|
|
|
+ reject();
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ const p3 = new Promise((resolve, reject) => {
|
|
|
+ reject();
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ // Promise.all 全部成功才成功 一个失败则失败
|
|
|
+ // promise中的方法并行执行
|
|
|
+ // resolve 返回的结果是数组
|
|
|
+ // Promise.all([p1,p2,p3]).then(res => {
|
|
|
+ // console.log('成功',res)
|
|
|
+ // }).catch((err) => {
|
|
|
+ // console.log("失败",err)
|
|
|
+ // })
|
|
|
+
|
|
|
+ // Promise.race 谁先执行完成 返回其结果 无论成功或失败
|
|
|
+ // Promise.race([p2, p1, p3]).then(res => {
|
|
|
+ // console.log('成功', res)
|
|
|
+ // }).catch((err) => {
|
|
|
+ // console.log("失败", err)
|
|
|
+ // })
|
|
|
+
|
|
|
+
|
|
|
+ // Poromise.allSettled 无论成功失败 全部等待执行完成 返回每一个的状态
|
|
|
+ // Promise.allSettled([p2, p1, p3]).then(res => {
|
|
|
+ // console.log('成功', res)
|
|
|
+ // }).catch((err) => {
|
|
|
+ // console.log("失败", err)
|
|
|
+ // })
|
|
|
+
|
|
|
+
|
|
|
+ // Promise.any 一个成功就成功 全部失败才失败
|
|
|
+ Promise.any([p2, p1, p3]).then(res => {
|
|
|
+ console.log('成功', res)
|
|
|
+ }).catch((err) => {
|
|
|
+ console.log("失败", err)
|
|
|
+ })
|
|
|
+ </script>
|
|
|
+</body>
|
|
|
+
|
|
|
+</html>
|
zheng