Ich versuche, Code von einem Drittanbieter Opensource-Projekt kennen zu lernen.Welche Art von Javascript-Syntax ist das?
Ich habe in JS seit einiger Zeit programmiert, aber ich bin nicht in der objektorientierten oder funktionalen Programmierung Teil, wenn es noch nicht.
Ich habe gelesen, wie JavaScript eine Prototypsprache ist und über Designmuster, die Ihnen "objektorientierte" Funktionalität wie Vererbung usw. geben können. Also werde ich es irgendwann bekommen.
Ich versuche herauszufinden, welche Art von Syntax das Folgende ist, so dass ich mich auf das Kennenlernen konzentrieren kann, da ich es natürlich für meine zukünftige Programmierung in einem Projekt brauche.
Wenn jemand mir helfen kann, die hier verwendete Syntax zu identifizieren und auf einige Referenzen zu verweisen, wo ich online darüber lesen kann, wäre das sehr hilfreich.
Danke, Harriet
WaveSurfer.Regions = {
init: function (wavesurfer) {
this.wavesurfer = wavesurfer;
this.wrapper = this.wavesurfer.drawer.wrapper;
/* Id-based hash of regions. */
this.list = {};
},
/* Add a region. */
add: function (params) {
var region = Object.create(WaveSurfer.Region);
region.init(params, this.wavesurfer);
this.list[region.id] = region;
region.on('remove', (function() {
delete this.list[region.id];
}).bind(this));
return region;
},
/* Remove all regions. */
clear: function() {
Object.keys(this.list).forEach(function (id) {
this.list[id].remove();
}, this);
},
enableDragSelection: function (params) {
var my = this;
var drag;
var start;
var region;
function eventDown(e) {
drag = true;
if (typeof e.targetTouches !== 'undefined' && e.targetTouches.length === 1) {
e.clientX = e.targetTouches[0].clientX;
}
start = my.wavesurfer.drawer.handleEvent(e);
region = null;
}
this.wrapper.addEventListener('mousedown', eventDown);
this.wrapper.addEventListener('touchstart', eventDown);
this.on('disable-drag-selection', function() {
my.wrapper.removeEventListener('touchstart', eventDown);
my.wrapper.removeEventListener('mousedown', eventDown);
});
function eventUp(e) {
drag = false;
if (region) {
region.fireEvent('update-end', e);
my.wavesurfer.fireEvent('region-update-end', region, e);
}
region = null;
}
this.wrapper.addEventListener('mouseup', eventUp);
this.wrapper.addEventListener('touchend', eventUp);
this.on('disable-drag-selection', function() {
my.wrapper.removeEventListener('touchend', eventUp);
my.wrapper.removeEventListener('mouseup', eventUp);
});
function eventMove(e) {
if (!drag) { return; }
if (!region) {
region = my.add(params || {});
}
var duration = my.wavesurfer.getDuration();
if (typeof e.targetTouches !== 'undefined' && e.targetTouches.length === 1) {
e.clientX = e.targetTouches[0].clientX;
}
var end = my.wavesurfer.drawer.handleEvent(e);
region.update({
start: Math.min(end * duration, start * duration),
end: Math.max(end * duration, start * duration)
});
}
this.wrapper.addEventListener('mousemove', eventMove);
this.wrapper.addEventListener('touchmove', eventMove);
this.on('disable-drag-selection', function() {
my.wrapper.removeEventListener('touchmove', eventMove);
my.wrapper.removeEventListener('mousemove', eventMove);
});
},
disableDragSelection: function() {
this.fireEvent('disable-drag-selection');
}
};
Es ist ein Objektliteral. Nichts viel mehr als das. – vlaz
Das sieht ziemlich einfach aus. Mit welchen Teilen hast du ein Problem? – vothaison
Das Problem, das ich habe, ist, dass es ein anderes Stück Code gibt, der dem gleichen Muster folgt - und es einen Ereignishandler auslöst. Ich habe mich registriert, um Benachrichtigungen über diesen Event-Handler zu erhalten, muss aber einen Anruf tätigen. Ich kann nicht herausfinden, wie ich vorgehen soll ... Hier ist ein Beispiel, wenn das hilft. http://codepen.io/BusyBee/pen/bwXYmx – Harriet