javascript的call方法简单总结

分手后的思念是犯贱 2022-05-11 06:28 180阅读 0赞

关于call这个方法大家应该都会用到过，我也一样，但是一直没有深入了解，今天学习的时候总结了call的两个主要用处：

1、继承

2、回调的时候设置回调方法的调用对象

### 继承 ###

就是调用父类的构造方法，来进行初始化：

### 设置回调方法中的对象 ###

如：我们自己做一个事件控制系统的时候，需要把监听事件类型、回调以及回调的对象保存在一个列表里，等到发事件的时候再依次调用这些方法。

如下代码：

CallbacksInvoker.prototype.invoke = function (key, p1, p2, p3, p4, p5) {
        var list = this._callbackTable[key];
        if (list) {
            var rootInvoker = !list.isInvoking;
            list.isInvoking = true;
    
            var callbacks = list.callbacks;
            var targets = list.targets;
            for (var i = 0, len = callbacks.length; i < len; ++i) {
                var callback = callbacks[i];
                if (callback) {
                    var target = targets[i];
                    if (target) {
                        callback.call(target, p1, p2, p3, p4, p5);
                    }
                    else {
                        callback(p1, p2, p3, p4, p5);
                    }
                }
            }
    
            if (rootInvoker) {
                list.isInvoking = false;
                if (list.containCanceled) {
                    list.purgeCanceled();
                }
            }
        }
    };

上面的代码中this.\_callbackTable保存了所有事件的列表，list是该控制器接收到事件后，事件类型等于key的所有回调函数列表。

然后callback调用的时候可以用：

callback.call(target, p1, p2, p3, p4, p5);

这样，是最为标准、精美的使用方式。

然而，我或者也有些初学者刚开始时是这样写的：

target.callback(p1, p2, p3, p4, p5);

我之前这样写过，调用不成功或者会出现bug。

所以在此也总结一下，不能用"target.callback(p1, p2, p3, p4, p5);"调用回调方法。

而应该用标准的call，也就是"callback.call(target, p1, p2, p3, p4, p5);"这种方法。