包含的 Javascript 腳本的加載順序

Question

我的 JS/HTML 應用程序正在加載一些我已設置為包含的對象文字的控制器：

例如：page1Controller.js

var page1 = {
  initialize() {
    $(".page").removeClass('on');
    $("#page1").addClass('on');
  },
  doThis: function() {
    // script here
  },
  doThat: function() {
    // Script here
  }
}

例如：navigation.js

var navigation = {
  bindEvents: function() {
    var page1Button = document.getElementById('page1Button');
    page1Button.addEventListener('click', this.loadPage1, false);
  },
  loadPage1: function() {
    page1.initialize();
  },
  loadPage2: function() {
    page2.initialize();
  }
}

注意：navigation.js.bindEvents() 在 pageLoad/deviceLoad 事件之后運行（它是一個 phonegap 應用程序）。

腳本包含在我的 HTML 頁面底部，如下所示：

<script src="page1Controller.js"></script>
<script src="page2Controller.js"></script>
<script src="page3Controller.js"></script>
<script src="page4Controller.js"></script>
<script src="navigation.js"></script>

我的理解是，默認情況下，腳本將同步加載 - 按照它們在 HTML 頁面中出現的順序一個接一個地加載。

但是，當我從 navigation.js 調用 say page3.doThat() 時，doThat 函數未定義，盡管其他一些控制器中的函數工作正常。 是否是這樣，即使腳本按順序加載，navigation.js 也可能在 page3Controller.js 已“注冊”它的功能完全之前加載？

Answer 1

答案是在一組 HTML 腳本標簽中按順序加載腳本的情況下，每個腳本都在下一個腳本之前完整加載到內存中，從而使后面調用的腳本可以訪問早期腳本中的函數。 感謝@TJ Crowder 在他的評論中指出這一點。