Not Using Prototype Properly?

[MrFish]

tldr; JS Bin link at the bottom. So here is my situation. I've got a few classes that I want to have custom event listening and dispatching so I can write code like this-

Obj.addEventListener("load", new Callback(this, function(){	 /// do stuff after load}));  Obj.prototype.load = function(){	 /// do some stuff	this.dispatchEvent("load");} Obj.load();

I need this because I'm doing asynchronous ajax calls and I need some processes to wait on those completing. This is the simplest and easiest to manageable in my opinion. So I'm using prototype to extend all classes off of my StandardObject class. Here is the relevant code-

/** Author: Micah Williamson** Events* -  error* -  log* -  warning*/function StandardObject(){this.eventListeners = [];}StandardObject.prototype.eventListeners = null;StandardObject.prototype.dispatchEvent = function(evtName, evtData){for(var i = 0; i < this.eventListeners.length; i++){  var Evt = this.eventListeners[i];  if(Evt.name == evtName)  {   var callback = Evt.callback;     if(Evt.callback.toString() == "Callback")   {	var obj = Evt.callback.obj;	var func = Evt.callback.func;	obj.callback = func;	obj.callback(evtData);   }   else if(evtData != null)	obj.callback(evtData);     if(Evt.once)   {	this.removeEventListener(Evt);   }  }}}StandardObject.prototype.addEventListener = function(nm, callback, once){var Evt = new Event();Evt.name = nm;Evt.callback = callback;Evt.once = once; this.eventListeners.push(Evt); return Evt;}StandardObject.prototype.removeEventListener = function(Evt){var found = false;var newEventStack = [];for(var i = 0; i < this.eventListeners.length; i++){  var E = this.eventListeners[i];  if(E == Evt)   found = true;  else   newEventStack.push(E);}this.eventListeners = newEventStack; if(found == false)  this.warn("event attempted to be removed but not found");}StandardObject.prototype.toString = function(){return "StandardObject";}// Helper StandardObjectsfunction Event(){this.name = "Undefined";this.callback = function(){};}function Callback(obj, func){this.obj = obj;this.func = func;}Callback.prototype.toString = function(){return "Callback";}

(sorry for the bad indentation. dreamweaver is terrible at formatting) And the code I'm testing-

/** Author: Micah Williamson** include <StandardObject.js>*  PageSettingsEditor extends StandardObject** Events* -  load* -  urlchange* -  savestart* -  save*/function PageSettingsEditor(){}PageSettingsEditor.prototype = new StandardObject();PageSettingsEditor.prototype.load = function(){var that = this; // Some ajax stuff that.dispatchEvent("load", data);}// Modifiers // AccessorsPageSettingsEditor.prototype.toString = function(){return "PageSettingsEditor";}

The problem is if I run this code-

window.onload = function()  {	 PSE1 = new PageSettingsEditor();	 PSE2 = new PageSettingsEditor();	 PSE1.addEventListener("load", new Callback(PSE1, function()												{													alert(this);												}));	 PSE2.addEventListener("load", new Callback(PSE2, function()												{													alert(this);												}));	PSE1.dispatchEvent("load");  }

I get 2 popups when only PSE1 dispatched load. I'm guessing this has something to do with prototype. You can see a running example with this JSBin. http://jsbin.com/okegab/1/edit So what am I missing?

[MrFish]

Ok I think I've identified the problem but I don't know how to solve it.

PSE1 = new PageSettingsEditor();PSE2 = new PageSettingsEditor();if(PSE1.prototype == PSE2.prototype){    alert("ur effed");}

But this only affects arrays so far from what I can tell. http://jsbin.com/ojinar/1/edit

[MrFish]

Well I found a solution but I'm not too happy with it because I'm completely confused. Doing this.test.push(1); Added 1 to both sub classes test array seen here- http://jsbin.com/ojinar/1/edit Instead I did this- this.test = [1]; Seen here- http://jsbin.com/uxacop/1/edit I can make this work for tonight but I don't know why it would work that way. Javascript needs better inheritance.

Edited February 12, 2013 by MrFish