兩個

  javascript是一種描述型腳本語言,它不同於java或C#等編譯性語言,它不需要進行編譯成中間語言,而是由瀏覽器進行動態地解析與執行。這裏有一個很重要的概念—代碼塊。

代碼塊:

 JavaScript中的代碼塊是指由<script>標籤分割的代碼段。

 <script type="text/javascript">
      alert("這是代碼塊一");
</script>
<script type="text/javascript">
      alert("這是代碼塊二");
</script>

JS是按照代碼塊來進行編譯和執行的,代碼塊間相互獨立,但變量和方法共享。

<script type="text/javascript">
      alert(str);//因爲沒有定義str,所以瀏覽器會出錯,下面的不能運行
      alert("我是代碼塊一");//沒有運行到這裏
      var test = "我是代碼塊一變量";
</script>
<script type="text/javascript">
      alert("我是代碼塊二"); //這裏有運行到
      alert(test); //彈出"我是代碼塊一變量"
</script>

上面的代碼中代碼塊一中運行報錯,但不影響代碼塊二的執行,這就是代碼塊間的獨立性,而代碼塊二中能調用到代碼一中的變量,則是塊間共享性。

<script type="text/javascript">
    fn1();//運行結果:第二個函數
    function fn1(){
      console.log("第一個函數");
    }
    function fn1(){
      console.log("第二個函數");
    }
</script>
<script type="text/javascript">
    function fn1(){
      console.log("第三個函數");
    }
</script>

上面代碼中,第一個塊中的第二個函數覆蓋了第一個,而第二個塊中的第三個函數卻沒有覆蓋前面的。

<script type="text/javascript">
      Fn();  //瀏覽器報錯:"undefined"
</script>
<script type="text/javascript">
      function Fn(){ //函數1
          alert("執行了函數1");
      }
</script>

爲什麼運行上面的代碼瀏覽器會報錯呢?聲明函數不是會在預處理期就會被處理了嗎,怎麼還會找不到Fn()函數呢?其實這是一個理解誤點,我們上面說了JS引擎是按照代碼塊來順序執行的,其實完整的說應該是按照代碼塊來進行預處理和執行的,也就是說預處理的只是執行到的代碼塊的聲明函數和變量,而對於還未加載的代碼塊,是沒法進行預處理的,這也是邊編譯邊處理的核心所在。

現在,讓我們來總結整理下:

step 1. 讀入第一個代碼塊。

step 2. 做語法分析,有錯則報語法錯誤(比如括號不匹配等),並跳轉到step5。

step 3. 對var變量和function定義做“預編譯處理”(永遠不會報錯的,因爲只解析正確的聲明)。

step 4. 執行代碼段,有錯則報錯(比如變量未定義)。

step 5. 如果還有下一個代碼段,則讀入下一個代碼段,重複step2。

step6. 結束。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章