如何在javascript中实现观察者模式? [英] how to implement observer pattern in javascript?

问题描述

我想在JavaScript中实现观察者模式:

Hi I'm tyring to implement observer pattern in JavaScript:

我的index.js :

$(document).ready(function () {
  var ironMan = new Movie();
  ironMan.setTitle('IronMan');
  ironMan.setRating('R');
  ironMan.setId(1);
  //  ironMan.setCast(['Robert Downey Jr.', 'Jeff Bridges', 'Gwyneth Paltrow']);

  var terminator = new Movie();
  terminator.setTitle('Terminator');
  terminator.setRating('P');
  terminator.setId(2);

  console.log(ironMan.toString());
  console.log(terminator.toString());

  ironMan.play();
  ironMan.stop();
  ironMan.download();
  ironMan.share('V. Rivas');

  console.log(ironMan.getCast()[0]);
});

我的电影:

var title;
var rating;
var id;
var observers;


function Movie() {
  observers = new ObserverList();
}

//function Movie (title, rating, id){
//  this. title = title;
//  this.rating =  rating;
//  this.id =id;
//  observers = new ObserverList();
//}

Movie.prototype.setTitle = function (newTitle) {
  this.title = newTitle;
}

Movie.prototype.getTilte = function () {
  return this.title;
}

Movie.prototype.setRating = function (newRating) {
  this.rating = newRating;
}

Movie.prototype.getRating = function () {
  return this.rating;
}

Movie.prototype.setId = function (newId) {
  this.id = newId;
}

Movie.prototype.getId = function () {
  return this.id;
}

Movie.prototype.play = function () {
  for (i = 0; i < observers.Count; i++) {
    console.log("palying...");
  }
}

Movie.prototype.stop = function () {
  for (i = 0; i < observers.Count; i++) {
    console.log("stoped");
  }
}

Movie.prototype.AddObserver = function (observer) {
  observers.Add(observer);
};

最终观察者:

function ObserverList() {
  this.observerList = [];
}

ObserverList.prototype.Add = function (obj) {
  return this.observerList.push(obj);
};

ObserverList.prototype.Empty = function () {
  this.observerList = [];
};

ObserverList.prototype.Count = function () {
  return this.observerList.length;
};

ObserverList.prototype.Get = function (index) {
  if (index > -1 && index < this.observerList.length) {
    return this.observerList[index];
  }
};

ObserverList.prototype.Insert = function (obj, index) {
  var pointer = -1;

  if (index === 0) {
    this.observerList.unshift(obj);
    pointer = index;
  } else if (index === this.observerList.length) {
    this.observerList.push(obj);
    pointer = index;
  }

  return pointer;
};

您能提供的任何帮助都会令我感激不尽.

Any help you can provide will me most grateful.

推荐答案

在JavaScript中，没有必要像Java中那样实现纯观察者模式，因为JavaScript具有称为功能编程的小功能.因此，只需使用类似 http://api.jquery.com/category/callbacks-object/之类的东西您的ObserverList.

In JavaScript, there is no point to implement pure observer pattern as in Java, because JavaScript has this little thing called functional programming. So just use something like http://api.jquery.com/category/callbacks-object/ instead of your ObserverList.

如果您仍然想使用对象，那么一切都取决于要传递给ObserverList.Add的对象.如果是某个对象，那么您需要写

If you still want to use your object, then everything depends on what do you want to pass to ObserverList.Add. If it is some object, then you need to write

for( i = 0; i < observers.Count; i++) { 
  observers[i].Notify("some data"); 
}

如果是函数，则需要编写

If it is a function then you need to write

for( i = 0; i < observers.Count; i++) { 
  observers[i]("Some data"); 
}

还可以使用Function.apply()或Function.call()为函数提供this

Also you can use Function.apply() or Function.call() to supply this to your function

这篇关于如何在javascript中实现观察者模式?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！