1. 程式人生 > 其它 >JavaScript中Promise函式執行順序

JavaScript中Promise函式執行順序

Promise的執行順序記錄:

前言:Javascript執行環境是單執行緒的,也就是說JS環境中負責解釋和執行的執行緒只有一個;那麼Promise函式在JavaScript中執行時的順序(紙上得來終覺淺)!

D級:

testFunction() {
      console.log(`console 1`);
      new Promise((resolve, reject) => {
          console.log(`console 2`);
          resolve(console.log(`console 3`));
          reject(console.log(`console 
4`)) }).then().catch(() => { console.log(`consolve 5`) }); console.log(`console 6`) } //-->執行結果是 console 1;console 2;console 3;console 4;console 6

C級:

testFunction() {
      console.log(`console 1`);
      new Promise((resolve, reject) => {
          console.log(`console 
2`); resolve(console.log(`console 3`)); reject(console.log(`console 4`)) }).then(() => { setTimeout(() => { console.log(`console 7`) },0) }).catch(() => { console.log(`consolve 5`) }); console.log(`console
6`) } // -->console 1;console 2;console 3;console 4;console 6;console 7

B級:

testFunction() {
      console.log(`console 1`);
      new Promise((resolve, reject) => {
          console.log(`console 2`);
          resolve(console.log(`console 3`));
          reject(console.log(`console 4`))
      }).then(() => {
          setTimeout(() => {
              console.log(`console 7`);
              new Promise(() => {
                  console.log(`console 8`)
              }).then(console.log(`console 9`))
          },0)
      }).catch(() => {
          console.log(`consolve 5`)
      });
      console.log(`console 6`)
    } // -->console 1;console 2;console 3;console 4;console 6;console 7;console 8;console 9

A級:

testFunction() {
      console.log(`console 1`);
      setTimeout(() => {
          new Promise(() => {
              console.log(`console 10`);
          }).then(console.log(`console 11`));
      },0);
      new Promise((resolve, reject) => {
          console.log(`console 2`);
          resolve(console.log(`console 3`));
          reject(console.log(`console 4`))
      }).then(() => {
          setTimeout(() => {
              console.log(`console 7`);
              new Promise(() => {
                  console.log(`console 8`)
              }).then(console.log(`console 9`))
          },0)
      }).catch(() => {
          console.log(`consolve 5`)
      });
      console.log(`console 6`)
    }//-->console 1;console 2;console 3;console 4;console 6;console 10;console 11;console 7;console 8;console 9

S級:

testFunction() {
      console.log(`console 1`);
      setTimeout(() => {
          new Promise(() => {
              console.log(`console 10`);
          }).then(console.log(`console 11`));
      },0);
      let letP =new Promise(() => {
          setTimeout(() => {
              console.log(`console 12`);
          },0)
      });
      promiseFn(letP);
      function promiseFn(fn){
        console.log(`console 13`)
        return fn;
      };
      new Promise((resolve, reject) => {
          console.log(`console 2`);
          resolve(console.log(`console 3`));
          reject(console.log(`console 4`))
      }).then(() => {
          setTimeout(() => {
              console.log(`console 7`);
              new Promise(() => {
                  console.log(`console 8`)
              }).then(console.log(`console 9`))
          },0)
      }).catch(() => {
          console.log(`consolve 5`)
      });
      console.log(`console 6`)
    } //-->consolve 1;consolve 13;consolve 2;consolve 3;consolve 4;consolve 6;consolve 10;consolve 11;consolve 12;consolve 7;consolve 8;consolve 9

簡單小結:在一個函式中執行順序-->已申明的函式-->new Promise-->setTimeout;在Promise函式中後執行.then()函式;