実行順序 - 新しいオブジェクトの関数が定義されていません

Question

コンストラクタで定義された空のモジュールオブジェクトを含むappオブジェクトを作成しました。

var App = function() { 
    this.modules = {}; 
}; 

modulesオブジェクトには、アプリケーションを構成し、ロジックを含む他のオブジェクト（モジュール）への参照が含まれています。

Iこの

window.app = new App(); 
app.createModules(); 

createModules（のようなアプリケーションをインスタンス）はモジュールがアプリケーションのモジュールを持つオブジェクト満たします。それが終了すると、各モジュールのinit（）関数を呼び出すinitModules（）が実行されます。このようにして、他のオブジェクトに依存するオブジェクトが正しく読み込まれるように、実行順序を制御できるようにしたいと考えています。このためのコードは次のとおりです。現在obj.init上のコンソールログは、私はそのオブジェクトの初期化コードを実行することができないことを意味し、未定義戻っている

App.prototype.createModules = function() { 
    console.log("Creating Modules"); 
    this.modules = { 
     radio: new Radio(), 
     visualiser: new Visualiser() 
    }; 
    this.initModules(this.modules); 
} 
App.prototype.initModules = function() { 
    console.log("Initialising modules"); 
    for (var key in this.modules) { 
     if (this.modules.hasOwnProperty(key)) { 
      var obj = this.modules[key]; 
      console.log(obj); 
      console.log(obj.init); //logs 'undefined' 
     } 
    } 
} 

。しかし、私が電話するとページが終了するとき

app.modules.radio.init 

それは関数を返します。私はなぜこれが起こっているのか分からないようです。

乾杯！

var app = function() { 
    ... 
} 

window.app = new App(); 
app.createModules(); 

function Radio() { 
    ... 
} 
Radio.prototype.init = function() { 
    ... 
} 

function Visualiser() { 
    ... 
} 
Visualiser.prototype.init = function() { 
    ... 
} 

//Event code 

Codepen：https://codepen.io/anon/pen/EvggLZ?editors=0011

Answer 1

Here is the structure of app

はい、彼らはプロトタイプ上で作成される前にメソッドを呼び出します

EDIT は、ここでアプリの構造です。

window.app = new App(); 
app.createModules(); 

をスクリプトの下部に移動すると機能します。