提前返回的问题

Question

var addEvent = function(el, type, fn, capture) {
    if (window.addEventListener) {
        el.addEventListener(type, function(e) {
            fn.call(el, e);   ------这一行代码不懂什么意思
        }, capture);
    } else if (window.attachEvent) {
        el.attachEvent("on" + type, function(e) {
            fn.call(el, e);
        });
    } 
};

document.getElementById("myBtn").addEventListener("click", myFunction);

function myFunction() {
    document.getElementById("demo").innerHTML = "Hello World";
}

为什么不直接写成

el.addEventListener(type, fn, capture)
这不是多此一举吗

Answer 1

fn.call(el, e);

fn参数应该是一个回调函数，fn.call的作用是调用fn函数并且以第一个参数el作为this指针，然后fn的参数的实参为第二个参数e，也就是上一级回调的参数。

很简单addEvent方法是给el元素添加一个事件回调函数fn，事件发生时调用fn，fn内部的this指针指向el，fn得到的参数是事件的参数。