How to Use JavaScript’s apply() Method Like a Pro | Exploring JavaScript’s apply() | The Secret to Flexible Function Calls

In JavaScript, the apply() method is your key to unlocking greater flexibility and reusability in your code. Imagine being able to take a function and effortlessly apply it to different objects, all while handling multiple arguments with ease. That’s exactly what apply() does—it allows you to invoke a function with a specific this context, using arguments neatly packaged in an array.

Whether you’re dealing with dynamic data or just looking to write more elegant and efficient code, mastering the apply() method is a must. In this blog, we’ll dive into how apply() works, how it compares to the call() method, and how you can use it to elevate your JavaScript skills. Get ready to add a new level of versatility to your coding toolkit!

Method Reuse

With the apply() method, you can write a method that can be used on different objects.

The JavaScript apply() Method

The apply() method is similar to the call() method (previous chapter).

In this example the fullName method of person is applied on person1:

Example

const person = {
  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
}

const person1 = {
  firstName: "Non",
  lastName: "coder"
}

// This will return "Non coder":
person.fullName.apply(person1);

The Difference Between call() and apply()

The difference is:

The call() method takes arguments separately.

The apply() method takes arguments as an array.

Note :

The apply() method is very handy if you want to use an array instead of an 
argument list.

The apply() Method with Arguments

The apply() method accepts arguments in an array:

Example

const person = {
  fullName: function(city, country) {
    return this.firstName + " " + this.lastName + "," + city + "," + country;
  }
}

const person1 = {
  firstName:"Non",
  lastName: "Coder"
}

person.fullName.apply(person1, ["bangalore", "india"]);

Compared with the call() method:

Example

const person = {
  fullName: function(city, country) {
    return this.firstName + " " + this.lastName + "," + city + "," + country;
  }
}

const person1 = {
  firstName:"Non",
  lastName: "Coder"
}

person.fullName.call(person1, "bangalore", "india");

JavaScript Strict Mode

In JavaScript strict mode, if the first argument of the apply() method is not an object, it becomes the owner (object) of the invoked function. In “non-strict” mode, it becomes the global object.

Conclusion

The apply() method is a handy tool in JavaScript that lets you reuse functions with different objects and pass arguments as an array. It's especially useful when you need flexibility in how you call functions. By mastering apply(), you can make your code more dynamic and efficient. Remember, small techniques like this can make a big difference in your coding journey!

Read Next :

Borrowing Functions and Binding Contexts: A Deep Dive into JavaScript’s bind() | Mastering…