1. 程式人生 > 實用技巧 >ES6 module && 任意兩個整數相加 && async/await、promise和setTimeout的執行順序

ES6 module && 任意兩個整數相加 && async/await、promise和setTimeout的執行順序

一、ES6module:

1.它是輸出成一個物件的引用,而不是值的複製;

2.import是非同步載入;

3.模組是在靜態程式碼編譯的階段,就編譯成了一種輸出的介面。而ES5的commonJS是在執行時載入執行的

ES6module的引入:

如果是<script>標籤形式引入,需要加type="model",標籤內可以新增defer或async,兩個的區別是:

defer:js模組下載完成後,會等到DOM渲染完成才去執行;

async:js模組下載完成後會立馬執行,如果此時有DOM在渲染,那麼DOM的渲染會暫時中止,等到JS執行完成後,再繼續接著執行剛剛被中止的DOM渲染程序。

二、任意兩個整數相加:

  // 兩數相加
    solve (v, l) {
      let r = []
      let sup = 0
      let sub = v.length - l.length
      let s = sub >= 0 ? v : l
      let f = new Array(Math.abs(sub)).fill('0').join('')
      let t = sub > 0 ? f + l : f + v
      for (let i = s.length - 1; i >= 0; i--) {
        let sum 
= parseInt(s[i]) + parseInt(t[i]) + sup if (i === 0) { r = [sum, ...r] } else { if (sum >= 10) { r = [sum % 10, ...r] } else { r = [sum, ...r] } sup = Math.floor(sum / 10) } } // console.log(r.join(''))
return parseInt(r.join('')) }

三、async/await、promise和setTimeout寫出以下程式碼的列印順序:

async function async1() {
    console.log('async1 start');
    await async2();
    console.log('asnyc1 end');
}
async function async2() {
    console.log('async2');
}
console.log('script start');
setTimeout(() => {
    console.log('setTimeOut');
}, 0);
async1();
new Promise(function (reslove) {
    console.log('promise1');
    reslove();
}).then(function () {
    console.log('promise2');
})
console.log('script end');

結果:

  1. script start
  2. async1 start
  3. async2
  4. promise1
  5. script end
  6. asnyc1 end
  7. promise2
  8. setTimeOut

分析:

1、執行console.log('script start'),輸出script start
2、執行setTimeout,是一個非同步動作,放入巨集任務非同步佇列中;
3、執行async1(),輸出async1 start,繼續向下執行;
4、執行async2(),輸出async2,並返回了一個promise物件,await讓出了執行緒,把返回的promise加入了微任務非同步佇列,所以async1()下面的程式碼也要等待上面完成後繼續執行;
5、執行new Promise,輸出promise1,然後將resolve放入微任務非同步佇列;
6、執行console.log('script end'),輸出script end
7、到此同步的程式碼就都執行完成了,然後去微任務非同步佇列裡去獲取任務
8、接下來執行resolve(async2返回的promise返回的),輸出了async1 end
9、然後執行resolve(new Promise的),輸出了promise2
10、最後執行setTimeout,輸出了settimeout