Trong JavaScript, bind
, call
, và apply
là các phương thức dùng để thiết lập ngữ cảnh (this
) của một hàm. Dưới đây là sự khác nhau giữa chúng:
1. call()
- Mô tả: Phương thức
call
cho phép bạn gọi một hàm với một ngữ cảnh (this
) cụ thể và truyền tham số dưới dạng danh sách.
- Cú pháp:
function.call(thisArg, arg1, arg2, ...)
- Ví dụ:
function greet(greeting) {
console.log(`${greeting}, ${this.name}!`);
}
const person = { name: 'Alice' };
greet.call(person, 'Hello'); // In ra "Hello, Alice!"
2. apply()
- Mô tả: Phương thức
apply
tương tự như call
, nhưng nó cho phép bạn truyền các tham số dưới dạng một mảng.
- Cú pháp:
function.apply(thisArg, [argsArray])
- Ví dụ:
function greet(greeting1, greeting2) {
console.log(`${greeting1} and ${greeting2}, ${this.name}!`);
}
const person = { name: 'Alice' };
greet.apply(person, ['Hello', 'Hi']); // In ra "Hello and Hi, Alice!"
3. bind()
- Mô tả: Phương thức
bind
tạo ra một hàm mới với ngữ cảnh (this
) đã được thiết lập và có thể nhận tham số. Hàm mới này không được gọi ngay lập tức mà phải được gọi sau đó.
- Cú pháp:
function.bind(thisArg, arg1, arg2, ...)
- Ví dụ:
function greet(greeting) {
console.log(`${greeting}, ${this.name}!`);
}
const person = { name: 'Alice' };
const greetAlice = greet.bind(person);
greetAlice('Hello'); // In ra "Hello, Alice!"
Tóm tắt sự khác biệt
- Gọi hàm:
call
: Gọi hàm ngay lập tức với ngữ cảnh và tham số.
apply
: Gọi hàm ngay lập tức với ngữ cảnh và tham số dưới dạng mảng.
bind
: Tạo một hàm mới với ngữ cảnh đã thiết lập, nhưng không gọi hàm ngay lập tức.
- Cách truyền tham số:
call
: Truyền tham số dưới dạng danh sách.
apply
: Truyền tham số dưới dạng mảng.
bind
: Truyền tham số cho hàm mới được tạo ra.
Khi nào sử dụng?
- Sử dụng
call
hoặc apply
khi bạn muốn gọi hàm ngay lập tức với ngữ cảnh cụ thể.
- Sử dụng
bind
khi bạn muốn tạo ra một hàm mới có ngữ cảnh cố định, có thể gọi sau đó.