Simple Explanation for call, apply, and bind in JavaScript

Let's break down call, apply and bind in a simple way

.call()

It allows you to invoke a function with a specified this value and individual arguments. Its syntax is as follows:

function.call(thisArg, arg1, arg2, ...)

Here, thisArg represents the value of this to be used when the function is called, while arg1, arg2, ... are the arguments passed to the function. For example:

function greet(name) {
  console.log(`Hello, ${name}! I am ${this.title}`);
}

const person = { title: "Mr." };
greet.call(person, "John");
// Output: Hello, John! I am Mr.

In this example, call ensures that the greet function is executed with person as the this value.

.apply()

Similar to call, the apply method is used to invoke a function with a specified this value. However, it differs in that it takes an array-like object as its second argument, representing the arguments to be passed to the function. The syntax is

function.apply(thisArg, [argsArray])

Here's an example:

function greet(name, age) {
  console.log(`Hello, ${name}! I am ${this.title} and I am ${age} years old.`);
}

const person = { title: "Mr." };
greet.apply(person, ["John", 25]);
// Output: Hello, John! I am Mr. and I am 25 years old.

.bind()

The bind method is used to create a new function that has a specified this value and pre-filled arguments. Its syntax is

function.bind(thisArg[, arg1[, arg2[, ...]]])

Here, thisArg is the value of this to be used, while arg1, arg2, ... are arguments to be partially applied. An example explains its usage:

function greet(name, age) {
  console.log(`Hello, ${name}! I am ${this.title} and I am ${age} years old.`);
}

const person = { title: "Mr." };
const greetPerson = greet.bind(person, "John");
greetPerson(25);
// Output: Hello, John! I am Mr. and I am 25 years old.

With bind, a new function greetPerson is created, ensuring that when it is invoked, it retains the specified this value and the pre-filled argument 'John'. This allows for more flexible function invocation in various contexts.