javascript - addEventListener's binding behavior -

why addeventlistener change context functions without context not functions binded context? there rule of priority, or precedence?

taking following example:

function listenera(e) {   console.log(e.type, this); } function listenerb(e) {   console.log(e.type, this); }  target.addeventlistener('click', listenera); // click dom element target.addeventlistener('click', listenerb.bind(listenerb)); // click function (){} 

jsfiddle: https://jsfiddle.net/6up68xlw/

i wonder why different this since both functions run callback addeventlistener , expect same behaviour, either create new context both, or keep current (even if undefined).

function.prototype.bind

the bind() function creates new function (a bound function) same function body (internal call property in ecmascript 5 terms) function being called on (the bound function's target function) value bound first argument of bind(), which cannot overridden.