我认为提出问题的最好方法是举个例子。 在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属性的更改。
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();
虽然我不确定这个解决方案的效率如何,但它可以完成工作
答案 0 :(得分:2)
这个问题有很多不同的方法。让我解释两种常见的模式:
The observer pattern。需要被告知其他对象(“观察者”)中的变化的每个对象被传递到需要被通知的对象的“寄存器”方法(“观察”)。被观察对象保留了为其注册的所有观察者的内部数组。被观察者还为它所代表的DOM元素(onclick,onchange等)上的所有相关输入事件注册处理程序。当观察者被改变时,它通过调用其中的常用方法通知所有观察者。
The controller pattern。所有对象都由中央控制器对象管理。控制器保留所有需要管理的对象的数组。所有输入事件都由控制器处理。当输入事件发生时,它确定由于此事件需要更改哪些对象并更改它们。