Können einfache Javascript-Objekte Ereignisse haben?

Question

Können einfache Javascript-Objekte Ereignisse mit ihnen verbunden haben? Sagen Sie etwas wie folgt aus:

obj = new Object(); 
obj.addEventListener('doSomething', foo, true); 

Ich weiß, dass ich dies mit jQuery tun kann, aber ist es möglich, ohne Bibliothek?

Answer 1

Sie müssen Ihre eigene Funktionalität dafür implementieren, aber das ist nicht sehr schwer.

var obj = { 
    events: {}, 
    addEventListener: function(eventName, handler) { 
     if(!(eventName in this.events)) 
      this.events[eventName] = []; 

     this.events[eventName].push(handler); 
    }, 

    raiseEvent: function(eventName, args) { 
     var currentEvents = this.events[eventName]; 
     if(!currentEvents) return; 

     for(var i = 0; i < currentEvents.length; i++) { 
      if(typeof currentEvents[i] == 'function') { 
       currentEvents[i](args); 
      } 
     } 
    }, 

    click: function() { 
     // custom 'click' function. when this is called, you do whatever you 
     // want 'click' to do. and then raise the event: 

     this.raiseEvent('onClick'); 
    } 
}; 

Answer 2

Nr. addEventListener ist eine Funktion des DOM, nicht JS.

Answer 3

Ich denke, Sie werden feststellen, dass in reinem JavaScript nur DOM-Objekte Ereignisse haben können.

Answer 4

Nein, nicht in dem Ausmaß, dass Sie einen Event-Handler zu einem Objekt hinzufügen können. Sie könnten jedoch ein eigenes Ereignissystem für Objekte schreiben, wenn Sie eine Art API oder Bibliothek für andere Skripte schreiben, mit denen Sie interagieren können.

Answer 5

Nicht direkt, aber Sie fügen die erforderliche publish/subscribe Infrastruktur zu jedem von ihnen hinzu.

Answer 6

Nr

Allerdings könnten Sie Ihre eigene Implementierung machen durch addEventListener und andere Funktionen und Speichern einer Liste der Handler für jedes Ereignis zu schreiben.

Zum Beispiel: (Ungeprüfte)

function addEventListener(name, handler) { 
    if (!this.events) this.events = {}; 
    if (!this.events[name]) this.events[name] = []; 
    this.events[name].push(handler); 
} 

function removeEventListener(name, handler) { 
    if (!this.events) return; 
    if (!this.events[name]) return; 
    for (var i = this.events[name].length - 1; i >= 0; i--) 
     if (this.events[name][i] == handler) 
      this.events[name].splice(i, 1); 
} 

function raiseEvent(name, args) { 
    if (!this.events) return; 
    if (!this.events[name]) return; 
    for (var i = 0; i < this.events[name].length; i++) 
     this.events[name][i].apply(this, args); 
} 


var obj = ...; 
obj.addEventListener = addEventListener; 
obj.removeEventListener = removeEventListener; 
obj.raiseEvent = raiseEvent; 

Answer 7

Nein, die einzige Sache, die JavaScript-Objekte haben, sind Eigenschaften. Die Werte dieser Eigenschaften sein kann:

• Ein Grundwert
• Ein Objekt (einschließlich eines Funktionsobjekt)

Answer 8

Sie eine addEventListener Methode definieren können alle Zuhörer Objekte zu sammeln, und Ihr Code kann sie jederzeit anrufen. Es ist nur OO-Programmierung. Definieren Sie den addXListener, fügen Sie das als Parameter übergebene Objekt hinzu, und wenn etwas passiert, rufen Sie seine Methode auf.

Ja.

Aber denken Sie daran, dass UI-Ereignisse die durch HTML/Javascript definierten sind, also, was Sie programmieren würden, ist nur für Ihr "obj" -Objekt, um über IHRE Ereignisse zu informieren.

Am Beispiel:

FunnyProcessor 
+ addStartListener(...) 
+ addProcessingListener(...) 
+ addEndListener(...) 
+ doStuff() 

und doSuff zuerst die Start Hörer anrufen, neben etwas Schleife tun und für jede Iteration Anrufverarbeitungs Hörer, und am Ende Anrufendsignal Hörer.