实例化的javascript对象如何相互通信?

时间:2012-09-22 12:01:22

标签: javascript oop javascript-objects

我认为提出问题的最好方法是举个例子。 在Javascript中,想象一下以下场景:

function Tab(options) {
     this.options = options;
}

Tab.prototype.doSomething = function () { 
         if(...){
             //change tab1's options
             //tab1.disabled = true 
         }else{
             //change tab2's options
             //tab2.disabled = true
         } 
         //call a method on of mySlider instance (NOT myOtherSlider instance)
         //mySlider.helloWorld();
}

//slider class
function Slider(options) {
   ....
}
Slider.prototype.helloWorld = function () {
       ...
       //Access tab1's properties
       //tab1.disabled should be "TRUE" since it was changed previously

       //Access tab2's properties 
       ...
}
function Accordion() {
     this.name = 'accordion';
      var tab1          = new Tab({disabled: true}),
          tab2          = new Tab({disabled: false),
          mySlider      = new Slider({color: red}),
          myOtherSlider = new Slider({color: blue});
}

我希望所有类都知道已经在自己的类和其他类中实例化的对象。

重要的部分是实例同步。例如,应该对访问tab1的任何其他对象应用/可见对tab1属性的更改。


我设法通过使用OBJECT MANAGER CLASS

来回答我自己的问题
function ObjectManager (){
}

ObjectManager.objects = {};

ObjectManager.register = function (name, object) {
    var t = this;
    t.objects[name] = object;
}

ObjectManager.getObject = function (name) {
    var t = this;
    return t.objects[name];
}

function Tab () {
    this.name = 'tab object';
}

Tab.prototype.init = function (name) {
    var t = this;
    t.name = name;
}

Tab.prototype.changeProperty = function () {
    var tab1 = ObjectManager.getObject('tab1');
        tab1.name = 'changed tab1 name';
}    

function Accordion() {
    var tab1 = new Tab();
        tab1.init('tab number 1');

    var tab2 = new Tab();
        tab2.init('tab number 2');

        ObjectManager.register('tab1', tab1);
        ObjectManager.register('tab2', tab2);
        console.log(ObjectManager.objects);
        tab2.changeProperty();
        console.log(ObjectManager.objects);
        console.log(tab1.name);
}

var accordion = new Accordion();​

虽然我不确定这个解决方案的效率如何,但它可以完成工作

1 个答案:

答案 0 :(得分:2)

这个问题有很多不同的方法。让我解释两种常见的模式:

  1. The observer pattern。需要被告知其他对象(“观察者”)中的变化的每个对象被传递到需要被通知的对象的“寄存器”方法(“观察”)。被观察对象保留了为其注册的所有观察者的内部数组。被观察者还为它所代表的DOM元素(onclick,onchange等)上的所有相关输入事件注册处理程序。当观察者被改变时,它通过调用其中的常用方法通知所有观察者。

  2. The controller pattern。所有对象都由中央控制器对象管理。控制器保留所有需要管理的对象的数组。所有输入事件都由控制器处理。当输入事件发生时,它确定由于此事件需要更改哪些对象并更改它们。