在JavaScript中调用函数时使用"()"的优缺点是什么?

3

关于JavaScript中的"call"和"apply"方法,有很多解释。然而,我找不到任何有关使用()调用函数的解释。

例如:

var a = function(arg){  
    //arg.call();
    //arg.apply();
    //arg();
}

var myParam = function() {
    //do someting 
}

var instance = new a(myParam);

我应该使用哪种方式?使用 () 调用方法有什么缺点?


我相信这个问题并不难理解,但是你的示例代码与你的问题毫无关系。另一方面,我真诚地相信有很多网站和问题可以帮助你回答apply(...)等问题! - Matías Fidemraizer
你会为了没有实际好处而输入更多字符。这对于代码的可读性来说是不好的。 - Waleed Khan
如果您正常调用函数,则无法设置this的值。除此之外,.apply()允许您设置动态数量的参数。 - Tim S.
@Tims 请粘贴一小段代码。 - magirtopcu
@MatíasFidemraizer 只需提供一个链接,该链接调查了使用 apply 和 call 的情况。 - magirtopcu
@user1645941 请求失败! - Matías Fidemraizer
2个回答

3

选项

有三种方法可以调用函数。

Direct: myFunction(Object arg1, Object arg2, ...);
Call:   myFunciton.call(Object this, Object arg1, Object arg2, ...);
Apply:  myFunction.apply(Object this, Array args);

每个都有自己的特点。 call()apply() 唯一的缺点可能是它们的性能不佳。经过一些研究,发现它们比直接调用函数要慢一点。虽然如此之少,以至于根本不值得考虑。
该选择哪一个?
由于没有巨大的缺点,我们可以通过评估优点来选择一种方法。也就是说,比较功能并选择适合您情况的内容。 .call(); 与直接调用函数不同,.call() 允许您设置 this 关键字。除此之外,它几乎相同。那么为什么要设置 this 关键字呢?看下面的例子。
var element = document.getElementById('my-element');

doSomething(element, function(success) {
    if(success) {
        // something succeeded!

        // because I passed "element" as "this",
        // I can use "this" to do more stuff with "element"
        this.style.display = 'none';
    }
});


function doSomething(element, callback) {
    // do something with element

    // I'm done, let's call the callback
    callback.call(element, success);
}

正如你所看到的,回调函数中的 this 指的是我们一直在操作的元素。这就是为什么我们喜欢使用 this 的原因,因为它很有意义!尤其是在使用对象时。

.apply();

正如 .call() 非常类似于直接调用函数一样,.apply() 具有另一个特性。它不允许程序员定义一组参数,而是可以使用数组来定义参数。这使您可以拥有动态数量的参数。

您可能熟悉 Math.max()。此函数接受未定义数量的参数,并返回最高数字。

Math.max(1, 2, 3); // 3
Math.max(1, 3, 2); // 3
Math.max(1, 2, 3, 2, 3, 1, 2, 3); // 3

如果我们有一个数字数组,可能来自于某种数据源,我们想要获取其中最大的数字。显然以下方法可以达到目的:

var numbers = [1, 6, 2, 8, 10, 6, 13, 5, 2, 8, 7, 75, 23, 7, 12, 75];

// Prepare "max"
// Anything is greater than -Infinity
var max = -Infinity;

// Loop through all numbers
for(var i = 0; i < numbers.length; i++) {
    // Compare current number with existing max
    max = Math.max(max, numbers[i]);
}

您正在浪费宝贵的时间循环遍历所有数字,而您可以让本地代码为您完成。这就是 .apply() 发挥作用的地方。虽然我们可以设置 this,但 Math.max() 不使用 this 关键字,因此我们可以将其丢弃并使用 null 代替。不管数组中有多少个元素,这都无关紧要。

var numbers = [1, 6, 2, 8, 10, 6, 13, 5, 2, 8, 7, 75, 23, 7, 12, 75];
var max = Math.max.apply(null, numbers); // Apply all array elements as an own argument

结论

这些方法都没有明显的缺点。根据具体情况或个人喜好选择最合适的方法即可。


1
如果你不需要使用.call或者.apply提供的“特性”,即设置this或传递参数数组,那么就没有必要使用它们。
只使用()调用函数是“正常”的调用方式。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接