Tìm hiểu các phương thức call, apply, bind trong JavaScript

Trong bài “Tìm hiểu về this trong JavaScript”, chúng ta có sử dụng phương thức bind() để fix một số bug khi sử dụng this. Cụ thể nó là phương thức như thế nào thì chúng ta cùng nhau tìm hiểu trong bài này nhé 😉.

Như các bạn biết đấy, trong JavaScript, function cũng được xem là một object, do đó nó cũng có các phương thức hữu ích như: call(), apply() và bind(). Ba ông thần này hiện tại bạn sẽ thấy ít khi mà dùng nó, tuy nhiên nếu trở thành dev JavaScript lành nghề thì chắc chắn các bạn phải nắm rõ chúng khi làm việc với NodeJS và Mongodb.

Lưu ý: Trước khi đi tiếp tục tìm hiểu các phương thức này, nếu chưa biết hoặc chưa nắm rõ kiến thức về ông thần this thì mình khuyên bạn nên tìm đọc lại bài viết “Tìm hiểu về this trong JavaScript” của mình để nắm rõ hơn rồi quay lại nhé 😁.

I. Call() method.

Phương thức call() cho phép bạn gọi function và truyền vào một object và các đối số(argument) cách nhau bởi dấu phẩy (Comma).

Cú pháp của call() như sau:

Javascript

function.call(thisArg, arg_1, arg_2,...);

Ví dụ:

Javascript

let person = {
	firstName: "Ken",
    lastName: "Kaneki",
}

function saySomeThing(param_1, param_2) {
	console.log(param_1 + " " + param_2 + ", " + this.firstName + " " + this.lastName);
}

saySomeThing.call(person, "Welcome to", "200Lab");
//-->Output: Welcome to 200Lab, Ken Kaneki

II. Apply() method.

Phương thức apply() cũng tương tự như call(), nhưng nó khác ở chỗ nó truyền vào các đối số thông qua mảng, cú pháp của nó như sau:

Javascript

function.apply(thisArg, [argsArray]);

Cùng xem ví dụ cho dễ hiểu nhé 😉

Javascript

let person = {
	firstName: "Ken",
    lastName: "Kaneki",
}

function saySomeThing(param_1, param_2) {
	console.log(param_1 + " " + param_2 + ", " + this.firstName + " " + this.lastName);
}

saySomeThing.apply(person, ["Welcome to", "200Lab"]);
//-->Output: Welcome to 200Lab, Ken Kaneki

III. Bind() method.

Phương thức bind() có chút đặc biệt hơn, nó trả về một function mới, nó cũng cho phép ta truyền vào một objectb và các đối số ngăn cách nhau bởi dấu phẩy, cú pháp của bind() như sau.

Javascript

let newFunction = func.bind(thisArg[, arg1[, arg2[, ...]]]);

Ví dụ:

Javascript

let person = {
	firstName: "Steve",
    lastName: "Rogers",
};

function saySomeThing(param_1, param_2) {
	console.log(param_1 + " " + param_2 + ", " + this.firstName + " " + this.lastName);
}

const say = saySomeThing.bind(person, "Hello", "captain");
say();
//-->Output: Hello captain, Steve Rogers

Một lưu ý chung cho cả ba phương thức trên là this sẽ đề cập đến object mà ta truyền vào.

IV. Tổng kết.

Nhìn chung thì cả ba phương thức đều có những nét tương đồng, trong đó call() và apply() là gần giống nhau nhất, với bind() thì hơi khác chút nhưng cả ba đều không khó hiểu như ông thần this 🤣.

Hy vọng qua bài viết này sẽ giúp cho các bạn nắm được kiến thức về các phương thức này cũng như phân phiệt được sự giống và khác nhau giữ chúng, những kiến thức này cũng sẽ giúp ích cho các bạn trong quá trình phỏng vấn cũng như làm việc đấy 😉.

Cảm ơn các bạn đã đọc 🤗.