Can someone explain this code using the .bind() function to me?

Question

I encountered this snippet (event handling) from the jQuery source code:

var events = ['click', 'focus', 'blur', …];
jQuery.each(event,function(i,name){
    jQuery.prototype[name] = function(fn){
        return this.bind(name,fn);
    };
});

Can someone explain this to me? How does the this.bind(name,fn); work the same as element.addEventListener('event','callback()')?

I know the basics of javascript, but I do not know the more advanced parts of JavaScript. Since I taught myself, there are many holes in my JavaScript knowledge. If anyone knows of a good source I could learn more advanced JavaScript from I would like to hear that too.

Thank you.

Answer 1

it's quite simple we have all events in an array [click, focus ...] easily we apply a foreach on that array and next part of code assign a function to jQuery prototype $.fn.click() which will become $('#me').click(), and finally this click(); function calls $.fn.bind(); which will call addEventListener() later, that's it.

if you still wondering where is addEventListener() read about bind() in jQuery.