Fragen zum Aufrufen von Methoden in Javascript

Question

window.onload=init;
function init(){
    var takeNoteButton=document.getElementById("take-note");
    takeNoteButton.onclick=createNote;
}
function createNote(e){
    //dosomething
}

各位大神好，这段代码中对createNote函数的调用：
     takeNoteButton.onclick=createNote;
而实际的createNote(e)有个参数，这样也能调么！！

Answer 1

其实这段代码对函数的调用并不是这句

takeNoteButton.onclick = createNote;

留意一下日常写的代码，我们对函数的调用不都是 xxxxx()，xxx.xxx()或者xxx.call()等类似这样的形式吗？
而这句代码你可以理解为一个赋值语句，takeNoteButton 的 onclick 属性赋值为 createNote 这个函数名，实际引用指向下面声明的具体函数。

这样，浏览器在监听到takeNoteButton的点击事件发生的时候，你可以想象成，实际上就进行了takeNoteButton.onclick(event)这样的函数调用。

下面说下参数，函数调用传入的实参和函数声明的形参实际上是分开的，并不需要对应起来，并且声明时指定的参数不一定要传入（会作为undefined处理），调用时实际传入的参数，如果在声明的函数体内并没有用到，那也完全没有问题。

比如这个事件点击时调用的函数，它是由浏览器底层自己进行调用，并传入了事件对象作为实参。那么反推过来，我们在写具体的函数体的时候，可以用一个event也好，e也好，abc也好，随便一个符合规范的名字作为形参来取得实际传入的实参，当然也可以不用形参，用arguments这个类数组对象也能访问到实际传入的参数，比如：

var a = 1;
fn(a);
// 可以这样拿到a
function fn(param) {
    console.log(param);
}
// 也可以这样拿到a
function fn() {
    console.log(arguments[0]);
}

其实这也为我们写一些组件插件提供了参数设计的思路，在组件内部的函数调用上我们可以指定传入的实参，而这个实参具体的值可以设计为一个暴露出去的参数让外部传入，举个jQuery的简单栗子：

$.fn.plugin = function(option) {
    var defaultOp = {
        a : 'default a'
    };
    var options = $.extend(defaultOp, option || {});
    var fn = function(a){ console.log(a) };
    fn(options.a);
}

这段代码可以通过$().plugin()调用，输出默认的default a
也可以用过$().plugin({a : '123'}) 这样传入指定的参数，输出123
而我们实际写的函数，形参还是a，实际调用函数传入的参数还是options.a，并且做了外部不传入参数的默认值的处理。

Answer 2

js中函数的调用跟行参个数没有关系，js的函数参数是一个arguments的类数组，就是如果你传入一个参数，对应的就是arguments[0],两个参数的话就是argument[0]和argument[1]。所以行参合实参的个数不一定要完全吻合的，函数底层会根据你传入的参数个数来匹配的。

Answer 3

当然是可以的了，你可以理解onclick是个指针，指向createNote这个function，并不是真正调用它。调用这个onclick方法是浏览器来完成的，浏览器会传入e这个参数。

可以理解下面的代码：

var obj = {
    onclick: null
};

function test(msg) {
    console.log(msg);
}

obj.onclick = test;

---

// 当点击事件发生以后
if (obj.onclick && typeof obj.onclick === 'function') {
    obj.onclick("这是我传进去的参数，相当于e");
}

Answer 4

在js中，形参和实参不一定要一一对应，事件监听函数就相当于一个回调函数。

当事件发生时，浏览器就会调用这个函数并把事件对象传进去。

Answer 5

我觉得这个问题有些缺陷 因为你问函数可以调用吗 ？当然可以调用因为这个函数属于window下一个变量 其实函数也是变量！只是比较特殊 形参有但不一定非要有实参 如果你传入的实参比较特殊或者在在另外一个作用域下你要先获得实参才能传递 否则你用这个参数的时候回报错