this, call(), apply(), bind() in JavaScript

this, call(), apply(), and bind() in JavaScript
What this Means in JavaScript
In JavaScript, the simple meaning of this is:
“Who is calling the function.”
In other words, this refers to the object through which the function is executed.

this Inside Normal Functions
If a normal function is called directly, this usually refers to the global object.
Example:

function show() {
  console.log(this);
}

show();

Here the function is not called by any object,
so this refers to the global context.

this Inside Objects
When a function is inside an object (as a method),
this refers to that object.

Example:

let person = {
  name: "Devesh",
  greet: function () {
    console.log(this.name);
  }
};

person.greet();

Output:

Devesh

Here this refers to the person object.

What call() Does

The call() method is used to run a function with a specific object.

Example:

function greet() {
  console.log("Hello " + this.name);
}

let user = { name: "Rahul" };

greet.call(user);

Output:

Hello Rahul

Here call() sets this to the user object.

If you want to pass arguments:

function greet(city) {
  console.log(this.name + " from " + city);
}

greet.call(user, "Delhi");

What apply() Does

apply() works almost the same as call().
The only difference is how arguments are passed.
With apply(), arguments are passed as an array.
Example:

function greet(city, country) {
  console.log(this.name + " from " + city + ", " + country);
}

let user = { name: "Amit" };

greet.apply(user, ["Delhi", "India"]);

What bind() Does

bind() does not run the function immediately.
Instead, it returns a new function where this is permanently set.

Example:

function greet() {
  console.log("Hello " + this.name);
}

let user = { name: "Neha" };

let newFunc = greet.bind(user);

newFunc();

Output:

Hello Neha

Difference Between call, apply, and bind

Method	Function execution	Arguments
call	runs immediately	normal arguments
apply	runs immediately	arguments in an array
bind	returns a new function	runs later

Simple way to remember:

• call → direct call

• apply → call with array

• bind → future call

1. Create an object with a method using this

let student = {
  name: "Aman",
  greet: function () {
    console.log("Hello " + this.name);
  }
};

student.greet();

2. Borrow the method using call()

let user = { name: "Rohit" };

student.greet.call(user);

3. Use apply() with array arguments

function introduce(city, country) {
  console.log(this.name + " from " + city + ", " + country);
}

introduce.apply(user, ["Mumbai", "India"]);

4. Use bind() and store the function

let greetUser = student.greet.bind(user);

greetUser();

Short Summary

this means who is calling the function.
call() → runs the function immediately
apply() → same as call but arguments are in an array
bind() → returns a new function that can be called later.

---