JS中怎樣操作程式碼執行的先後順序

這次帶給大家JS中怎樣操作程式碼執行的先後順序，JS操作程式碼執行先後順序的注意事項有哪些，下面就是實戰案例，一起來看一下。

一、js--->單執行緒

   嚴格意義上來說，javascript沒有多個執行緒的概念，所有的程式都是單執行緒依序執行的。

  1、什麼是單線程？

#   通俗點說，就是程式碼在執行過程中，另一段程式碼想要執行就必須等當前程式碼執行完成後才可以進行。我們拿一段程式碼來解釋一下吧

 for(var i=1;i<=3;i++){
   setTimeout(function(){
     console.log(i); //输出：4,4,4
   },0)
 }

  我們來看一下上面的這段程式碼，既然延時器時間設定為0，那麼應該執行一遍迴圈就應該立即列印出一個i，但是最終的列印結果為：4，4，4。之所以會出現上面的結果，正是因為js程式碼是單執行緒應用。

  在執行過程中，先遇到for迴圈，for迴圈先進入執行緒。當i=1時，循環走到setTimeOut後，此時的for迴圈還沒執行完成，setTimeOut就會被放入一個地方（線程池）等待執行。此時for迴圈繼續執行，當i=2時，for迴圈仍沒有執行完，這時的setTimeOut仍會被放在線程池中等待執行…依次類推，直到for迴圈轉完3遍後，for循環執行完了，此時線程空閒了，在線程池中等待執行的setTimeOut依次執行打印i，而for循環執行完成後，i變成了4，所以打印出了三個4。

  2、如果想要改變上面的狀況可以運用以下程式碼

//将var变为let
for(let i=1; i<=3; i++){
  setTimeOut(function(){
    console.log(i); //输出的结果为1，2，3
  },0);
}
//用自执行函数进行包裹
for(var i=1; i<=3; i++){
  !function(i){
    setTimeOut(function(){
      console.log(i); //输出的结果为1，2，3
    },0);
  }(i)
}

二、js中的函數作用域與程式碼的執行

#   >>>函數作用域

# 我們先來了解以下幾個概念：

#   1、在js語言中，沒有類似c語言這樣的區塊級作用域。

  2、js語言中的頂級作用域為window物件範圍內，稱為全域作用域，在全域作用域中宣告的變數為全域變數。

  3、js函數範圍內的變數只能在函數內部使用，函數外部無法使用，這樣的變數為局部變數。

  4、js函數可以嵌套，多個函數的嵌套構成了作用域的層層嵌套，這稱為js中的作用域鏈。

  5、js作用域鏈變數存取規則：

#     （1）、目前作用域內存在要存取的變數時，則使用目前作用域中的變數。

       （2）、目前作用域中不存在要存取的變數時，則會到上一層作用域中尋找，直到全域作用域。

  >>>執行順序

#    js程式碼執行分為兩個部分：

  1、程式碼的檢查載入階段（預編譯階段），此階段進行變數和函數的聲明，但是不對變數賦值，變數的預設值為undefined。

  2、程式碼的執行階段，此階段對變數進行賦值和函數的宣告。

看了上面的一些具體的概念，我們拿一段程式碼來舉例說明：

var a=1; //声明了一个全局变量
function func(){
  console.log(a); //输出：undefined。打印a，而在func这个作用域中已经声明了a变量，按照js的执行顺序，此时的a并未被赋值。
  var a=1;
  console.log(a); //输出：1。
}
func();

  看上面的程式碼：第一個a輸出undefined。原因：js作用域鏈的存取規則，目前作用域內存在要存取的變數a，所以使用目前作用域中的變數。再根據js程式碼的執行順序，此時的a只是宣告了而並未被賦值，預設​​為undefined，所以輸出undefined。

  而第二個a，輸出1，正是因為此時的a已經被宣告且被賦值，所以a輸出1。

相信看了本文案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！

推薦閱讀：

vue.js建構圖書管理平台的技術解答

vue.js常用指令總結歸納

JS按鈕停用並啟用使用詳解

以上是JS中怎樣操作程式碼執行的先後順序的詳細內容。更多資訊請關注PHP中文網其他相關文章！