DEV Community

Danish Raza
Danish Raza

Posted on

call, apply & bind

call, apply and bind sometimes we called it function borrowing

Call: it can map a function with different object like-

let name = {
  firstName: 'Danish',
  lastName: 'Raza',
};

let printFullName = function () {
  console.log(this.firstName + ' ' + this.lastName);
};

let name2 = {
  firstName: 'Lav',
  lastName: 'Singhania',
};

console.log(printFullName.call(name2));
Enter fullscreen mode Exit fullscreen mode

above code we can just call the function printFullName by passing the object which we want to call.

call method accept the object as a parameter which you want to call. In above case we are calling name 2 object

We can also pass the extra parameter to the call function like-

let name = {
  firstName: 'Danish',
  lastName: 'Raza',
};

let printFullName = function (hometown, state) {
  console.log(
    this.firstName + ' ' + this.lastName + ' is from ' + hometown + ', ' + state
  );
};

let name2 = {
  firstName: 'Lav',
  lastName: 'Singhania',
};

console.log(printFullName.call(name2, 'uttam nagar east', 'delhi'));
Enter fullscreen mode Exit fullscreen mode

in the same example we add the two extra parameter named hometown and state. by this way we can pass infinite no of parameters to the function.

apply: bind method is same as call method except we pass extra parameters in the array form, like-

let name = {
  firstName: 'Danish',
  lastName: 'Raza',
};

let printFullName = function (hometown, state) {
  console.log(
    this.firstName + ' ' + this.lastName + ' is from ' + hometown + ', ' + state
  );
};

let name2 = {
  firstName: 'Lav',
  lastName: 'Singhania',
};

console.log(printFullName.apply(name2, ['uttam nagar east', 'delhi']));
Enter fullscreen mode Exit fullscreen mode

bind: bind is bit different from these two. In bind method it returns the copy of the existing function that we can invoke later.

let name = {
  firstName: 'Danish',
  lastName: 'Raza',
};

let printFullName = function (hometown, state) {
  console.log(
    this.firstName + ' ' + this.lastName + ' is from ' + hometown + ', ' + state
  );
};

let name2 = {
  firstName: 'Lav',
  lastName: 'Singhania',
};

const printName = printFullName.bind(name2, ['uttam nagar east', 'delhi'])

// printname is the copy of printFullName function which we are invoking below.

printName();
Enter fullscreen mode Exit fullscreen mode

in this code snippet printName is the exact copy of prinFullName functon.

Image of Timescale

Timescale – the developer's data platform for modern apps, built on PostgreSQL

Timescale Cloud is PostgreSQL optimized for speed, scale, and performance. Over 3 million IoT, AI, crypto, and dev tool apps are powered by Timescale. Try it free today! No credit card required.

Try free

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

👋 Kindness is contagious

Dive into an ocean of knowledge with this thought-provoking post, revered deeply within the supportive DEV Community. Developers of all levels are welcome to join and enhance our collective intelligence.

Saying a simple "thank you" can brighten someone's day. Share your gratitude in the comments below!

On DEV, sharing ideas eases our path and fortifies our community connections. Found this helpful? Sending a quick thanks to the author can be profoundly valued.

Okay