There are explanations about the JavaScript methods "call" and "apply" in many places. However, I couldn't find any explanation about invoking functions using ().
For instance:
var a = function(arg){
//arg.call();
//arg.apply();
//arg();
}
var myParam = function() {
//do someting
}
var instance = new a(myParam);
Which way should I use? What are the disadvantages of calling a method using ()?
There are three ways to call functions.
Direct: myFunction(Object arg1, Object arg2, ...);
Call: myFunciton.call(Object this, Object arg1, Object arg2, ...);
Apply: myFunction.apply(Object this, Array args);
Each has it's own features. The only disadvantage of call() and apply() could be that their performance is bad. After some research it turned out that they are a tiny bit slower than calling a function direct. Though so little that it's not even worth considering.
Because there are no huge disadvantages, we can pick a method by judging the advantages only. That means, comparing the features and picking whatever suits your case.
.call();Unlike calling a function directly, .call() allows you to set the this keyword. Apart from that it's practically the same. So why would you want to set the this keyword? Have a look at the following example.
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);
}
As you can see, the this in the callback argument refers to the element we have been playing with. This is why we like to use this because... it makes sense! Especially when you use objects.
.apply();Just as .call() is very alike calling a function directly, .apply() comes with an other feature. Instead of allowing the programmer to define a set of arguments, an array can be used to define arguments. That allows you to have a dynamic amount of arguments.
You may be familiar with Math.max(). This function takes an undefined amount of arguments, and returns the highest number.
Math.max(1, 2, 3); // 3
Math.max(1, 3, 2); // 3
Math.max(1, 2, 3, 2, 3, 1, 2, 3); // 3
What if we have an array of numbers, from a feed perhaps, and we want to get the biggest number? This would obviously work:
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]);
}
You are wasting precious time looping through all numbers while you can make native code do it for you. That's where .apply() comes in handy. Though we have the ability to set this, Math.max() doesn't use the this keyword, so we can just discard it and use null instead. It doesn't matter how many elements you have in your array.
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
There are no (noticeable) disadvantages of any of these methods. Do whatever looks most appropriate for that case or what you like best.
If you don't need the "features" that .call or .apply provide, namely setting this or passing an array of arguments, then there is no need to use them.
Calling a function with just () is the "normal" way to call a function.
apply(...)and so on!!!!this. Other than that,.apply()allows you to set a dynamic amount of arguments.