zsydgithub 1 anno fa
parent
commit
0711aeb68e

+ 30 - 0
es6/promise练习/1.html

@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+</head>
+
+<body>
+  <script>
+    console.log('start')
+
+    const p = new Promise((resolve, reject) => {
+      console.log('1')
+      resolve('2')
+    })
+
+    p.then(res => {
+      console.log(res)
+    })
+
+    console.log('end')
+    
+
+  </script>
+</body>
+
+</html>

+ 30 - 0
es6/promise练习/2.html

@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+</head>
+
+<body>
+  <script>
+    /* resolve方法不会终端函数运行 */
+    console.log('start')
+    
+    const p = new Promise((resolve, reject) => {
+      console.log(1)
+      resolve(2)
+      console.log(3)
+    })
+
+    p.then(res => {
+      console.log(res)
+    })
+
+    console.log('end')
+  </script>
+</body>
+
+</html>

+ 28 - 0
es6/promise练习/3.html

@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+</head>
+
+<body>
+  <script>
+    console.log('start')
+
+    const p = new Promise((resolve, reject) => {
+      console.log(1)
+    })
+
+    p.then(res => {
+      console.log(2)
+    })
+
+    console.log('end')
+
+  </script>
+</body>
+
+</html>

+ 38 - 0
es6/promise练习/4.html

@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+</head>
+
+<body>
+  <script>
+
+    /* 
+      同步先行  异步靠后
+      同步按照顺序调用
+    */
+    console.log('start')
+
+    const fn = () => {
+      return new Promise((resolve, reject) => {
+        console.log(1)
+        resolve(2)
+      })
+    }
+
+    console.log(3)
+
+    fn().then(res => {
+      console.log(res)
+    })
+
+    console.log('end')
+
+  </script>
+</body>
+
+</html>

+ 28 - 0
es6/promise练习/5.html

@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+</head>
+
+<body>
+  <script>
+    console.log('start')
+
+    Promise.resolve(1).then((res) => {
+      console.log(res)
+    })
+
+    Promise.resolve(2).then(res => {
+      console.log(res)
+    })
+
+    console.log('end')
+
+  </script>
+</body>
+
+</html>

+ 27 - 0
es6/promise练习/6.html

@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+</head>
+
+<body>
+  <script>
+    console.log('start')
+
+    setTimeout(() => {
+      console.log('setTimeout')
+    }, 0)
+
+    Promise.resolve().then(() => {
+      console.log('resolve')
+    })
+
+    console.log('end')
+  </script>
+</body>
+
+</html>

+ 34 - 0
es6/promise练习/7.html

@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+</head>
+
+<body>
+  <script>
+    const p = new Promise((resolve, reject) => {
+      console.log(1)
+      setTimeout(() => {
+        console.log('timerStart')
+        resolve('resolve')
+        console.log('timerEnd')
+      }, 0)
+      console.log(2)
+    })
+
+    p.then((res) => {
+      console.log(res)
+    })
+
+    console.log('end')
+    //1 2 end resolve  timerStart timerEnd 
+    //1 2 end timerStart timerEnd resolve
+
+  </script>
+</body>
+
+</html>

+ 34 - 0
es6/promise练习/8.html

@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+</head>
+
+<body>
+  <script>
+    /* 
+      1. 首先执行所有的微任务
+      2. 执行宏任务
+      3. 再次执行新添加进来的微任务
+      4. 执行下一个宏任务
+    */
+    const timer1 = setTimeout(() => {
+      console.log(1)
+
+      const promise1 = Promise.resolve().then(() => {
+        console.log('promise1')
+      })
+    }, 0)
+
+    const timer2 = setTimeout(() => {
+      console.log('timer2')
+    }, 0)
+
+  </script>
+</body>
+
+</html>

+ 43 - 0
es6/promise练习/9.html

@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+</head>
+
+<body>
+  <script>
+    const p = new Promise((resolve, reject) => {
+      resolve(0)
+      console.log(1)
+      setTimeout(() => {
+        console.log('timerStart')
+        resolve('resolve')
+        console.log('timerEnd')
+        setTimeout(() => {
+          console.log('aa')
+          reject(10)
+        }, 10)
+      }, 0)
+      console.log(2)
+    })
+    p.then((res) => {
+      console.log(res)
+      // setTimeout(()=>{
+      //   console.log('ttttimer')
+      // },0)
+      const promise4 = Promise.resolve().then(() => {
+        console.log('promise1')
+      })
+    })
+    console.log('end')
+    //1 2 end 0 timerstart timerend aa ttt
+    //1 2 end 0 timerstart timerend ttt aa
+    //1 2 end 0 tttt timerstart timerend  aa
+  </script>
+</body>
+
+</html>