4

私の質問をする最良の方法は、例をあげることだと思います。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にアクセスする他のオブジェクトに適用/表示する必要があります。

OBJECTMANAGERCLASSを使って自分の質問に答えることができました

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();​

このソリューションがどれほど効率的かはわかりませんが、それで仕事は終わります

4

1 に答える 1

2

この問題には多くの異なるアプローチがあります。2つの一般的なパターンについて説明します。

  1. The observer pattern. Each object which needs to be informed about changes in other objects ("observer"), is passed to the "register" method of the objects it needs to be informed about ("observed"). The observed object keeps an internal array of all observers which registered for it. The observed also registers handlers for all relevant input events on the DOM element it represents (onclick, onchange etc). When the observed is changed, it informs all observers by calling a common method in them.

  2. The controller pattern. All objects are managed by a central controller object. The controller keeps arrays of all objects which need to be managed. All input events are handled by the controller. When an input event occurs, it determines which objects need to be changed because of this event and changes them.

于 2012-09-22T12:14:31.330 に答える