Как спроектировать эту архитектуру?

Question

У меня есть 3 класса:

function A(data){
    this.data = data || [];
}    
A.prototype.remove = function(index){
    // remove index from this.data;
};
function B(data){
    this.data = data || [];
}  
B.prototype.add = function(x){
    this.data.push(x);
};
B.prototype.update = function(index, x){
    this.data[index] = x;
};
function C(data){  
    this.data = data || [];
}
C.prototype.add = function(x){
    this.data.push(x);
};
var a = new A(xx);
var b = new B(xx);
var c = new C(xx);

Есть отношения:
если я вызову a.remove(i) для удаления элемента, b добавит его к data.
если я позвоню b.update(i, x), c добавит x к своему data.
Как я мог бы разработать это с наименьшей связью?

ps: это просто пример, чтобы продемонстрировать ситуацию, пожалуйста, не заботьтесь об инициализации и т. Д.

Answer 1

Я бы использовал события для слабой связи в лучшем виде. В качестве базы я рекомендую использовать Backbone.js (см. Раздел «Backbone.Events»), он занимает очень мало места и обеспечивает отличную поддержку пользовательских событий. Краткое описание из документов:

События - это модуль, который можно смешивать с любым объектом, давая объекту возможность связывать и запускать пользовательские именованные события.

Это может выглядеть так:

function A(data){
    this.data = data || [];
}    
A.prototype.remove = function(index){
    // remove index from this.data;
    // dispatch A_Remove event
    this.trigger("A_Remove", this.data);
};
function B(data){
    this.data = data || [];
}  
B.prototype.add = function(x){
    this.data.push(x);
};
B.prototype.update = function(index, x){
    this.data[index] = x;
    this.trigger("B_Update", x);
};
function C(data){  
    this.data = data || [];
}
C.prototype.add = function(x){
    this.data.push(x);
};
var a = new A(xx);
var b = new B(xx);
var c = new C(xx);

// mixin event support to your objects
_.extend(a, Backbone.Events);
_.extend(b, Backbone.Events);
_.extend(c, Backbone.Events);

// event listener for A_Remove event
a.bind("A_Remove", function(data) {
    b.add(data);
});
// event listener for B_Update event
b.bind("B_Update", function(data) {
    c.add(data);
});

При таком подходе, основанном на событиях, ваши классы настолько слабо связаны, насколько это возможно, нет необходимости, чтобы A, B или C знали друг о друге. В то же время вы получаете максимальную гибкость - в любой момент вы можете добавить больше слушателей или типы событий.

Мне кажется, это лучшее решение.

Answer 2

Я бы добавил обратные вызовы в класс A и класс B

function A(data, callback) {
  this.data = data || [];
  this.callback = callback || function() {};
}

A.prototype.remove = function(index) {
  // remove index from this.data;
  this.callback(this.data[index]);
}
...
var b = new B(xx);
var a = new A(xx, function(e) {b.add(e);});