Передача ссылок объектов между модулями

Question

Я довольно новичок в javascript и пытаюсь изучить некоторые из лучших практик. Я не понимаю, почему я не могу получить доступ к ссылке ctx в следующем коде. Журнал выводит ссылку context2d из myApp.init(). Могу ли я не показывать частную переменную объекта в операторе return модуля myApp? Я думал, что начинаю понимать основы этого языка, но меня расстраивает эта, казалось бы, простая концепция. Спасибо за вашу помощь.

window.onload = function() { 
    myApp.init(); 
    console.log(myApp.ctx);  // logs undefined 
}; 

var myApp = (function() {  

    var canvas, 
     ctx, 
     init = function() { 
      canvas = document.getElementById("canvas"); 
      ctx = canvas.getContext('2d'); 
      console.log(ctx);  // logs valid context2d object 
     }; 

    return { 
     init : init, 
     ctx : ctx 
    }; 

}()); 

myApp.board = (function() { 

    var ctx = myApp.ctx; 

    return { 
     ctx : function() { console.log(ctx); } // logs undefined 
    }; 

}()); 

Answer 1

Вам нужно позвонить init() для ctx быть определены. Однако, к этому моменту, уже слишком поздно, поскольку myApp содержит исходное значение ctx.

У вас точно такая же проблема с var ctx = myApp.ctx;. Это получает значение ctx, когда определено значение board. Он не изменится, если изменится myApp.ctx.

---

Это должно работать:

var myApp = new function() { 
    var canvas; 

    this.init = function() { 
     canvas = document.getElementById("canvas"); 
     this.ctx = canvas.getContext('2d'); 
     console.log(this.ctx);  // logs valid context2d object 
    }; 
}; 

myApp.board = new function() { 
    this.ctx = function() { console.log(myApp.ctx); } 
}; 

Используя new ключевое слово, функции становятся Конструкторы (и вызываются немедленно) - this относится к объекту создается.