2015-03-13 160 views
0

所以我讀了HTML 5 CSS培訓指導爲Microsoft證書時,我在這段代碼跌跌撞撞:混淆函數表達式和聲明

CalculatorLibrary.js

(function() { 

    this.calculatorNamespace = this.calculatorNamespace || {}; 
    var ns = this.calculatorNamespace; 

    ns.initialize = function() { 
     var calculator = new ns.Calculator(); 
     $("button[id^='btnNumber']").on('click', calculator.numberClick); 
     $('#btnPlus').on('click', calculator.plusClick); 
     $('#btnMinus').on('click', calculator.minusClick); 
     $('#btnClearEntry').on('click', calculator.clearEntry); 
     $('#btnClear').on('click', calculator.clear); 
     calculator.clear(); 
    }; 

    ns.Calculator = (function() { 

     function Calculator() { 

     } 

     //Some prototype code 

     return Calculator; 
    })(); 

})(); 

現在我不明白爲什麼這不會拋出一個錯誤,當解析到達這一行時:

var calculator = new ns.Calculator(); 

此代碼調用fu此時此刻還沒有被讀取的nction表達式。爲什麼這個工作?我一直認爲只有函數聲明可以在聲明它們的行之前被調用。

這是因爲它是一個IIFE,它有一些我不知道的魔法?

編輯:

初始化獲取我的index.html調用(車身底部):

<script src="../../../Exercise1Completed/WebCalculatorSolution/packages/jQuery.1.8.2/Content/Scripts/jquery-1.8.2.js"></script> 
    <script type="text/javascript" src="Scripts/CalculatorLibrary.js"></script> 
    <script type="text/javascript"> 
      $(function(){ 
       calculatorNamespace.initialize(); 
      }); 
     </script> 
+0

'納秒的誤差叫ns.initialize。 initialize'實際上並沒有被稱爲 – 2015-03-13 17:25:59

+0

FYI,這個代碼會在ES5嚴格模式下產生一個錯誤,因爲'this'將會是'undefined'。 – JLRishe 2015-03-13 17:31:08

+0

我認爲這是全局對象(窗口)在這裏? – 2015-03-13 17:34:39

回答

0

因爲我在這是CalculatorLibrary.js之後定義一個腳本這造成沒有造成錯誤,當我提出這一段代碼的CalculatorLibrary.js上我得到了我希望

2
var calculator = new ns.Calculator(); 

包含在ns.initialize函數中 - 也就是說,它不會得到評估,直到ns.initialize實際上被稱爲。在它被調用的時候,下面的代碼,因此ns.Calculator = ...將會運行並且可用。

+0

我不明白:解析器第一次讀取文件,看到iife並調用它,在iife內沒有函數聲明,因此ns.initialize和ns.Calculator都是未定義的。解析器開始執行代碼並在initialize中跳轉(在DOM負載中執行)並看到新的ns.undefined? – 2015-03-13 17:32:45

+0

'ns.initialize = function()...'是一個函數聲明 - 它不會在您發佈的代碼中調用,其他的東西會調用它。直到這種情況發生,它纔會運行內容。 – 2015-03-13 17:35:46

+0

@RobinHellemans我覺得你不理解javascript是如何在更基礎的層面上工作的。將函數分配給變量時,該函數不運行該函數。在你的代碼中沒有發佈你有'ns.initialize()'這就是實際運行功能 – 2015-03-13 17:36:12