13/10/2018, 00:49

Sử dụng Call, Apply và Bind trong JavaScript

Một function cũng là 1 object trong javascript. Và cũng giống như object , function sẽ có các methods, chưa các phương thức mạnh mẽ như “Apply”, “Call”, “Bind”. 3 hàm này chúng ra thường ít dùng tuy nhiên chúng tạo nên sự mạnh mẽ và bá đạo của javascript.

1. Hàm call


Gọi hàm và cho phép bạn truyền vào một object và các đối số phân cách nhau bởi dấu phẩy (Comma)
 

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

Ví dụ:

var xe01 = {bienSo: '98F1-10529', soGhe: 4};
var xe02 = {bienSo: '29F1-10529', soGhe: 16};

function info() {
    console.log('Biển số:' + this.bienSo + ' Số ghế:' + this.soGhe);
}

info.call(xe01);
info.call(xe02);

// Biển số:98F1-10529 Số ghế:4
// Biển số:29F1-10529 Số ghế:16

 

 

2. Hàm apply

Gọi hàm và cho phép bạn truyền vào một object và các đối số thông qua mảng (Array)

fun.apply(thisArg, [argsArray]

Ví dụ:


var xe01 = {bienSo: '98F1-10529', soGhe: 4};
var xe02 = {bienSo: '29F1-10529', soGhe: 16};

function info(say) {
    console.log('Biển số:' + this.bienSo + ' Số ghế:' + this.soGhe + ' ' + say);
}

info.apply(xe01, 'Xin chào bào con');
info.apply(xe02, 'Xin chào bào con');

// Biển số:98F1-10529 Số ghế:4 Xin chào bào con
// Biển số:29F1-10529 Số ghế:16 Xin chào bào con

 

3. Hàm bind

Trả về một hàm số mới, cho phép bạn truyền vào một object và các đối số phân cách nhau bởi dấu phẩy.

var newFunction = fun.bind(thisArg[, arg1[, arg2[, ...]]])

 

Ví dụ:


var xe01 = {bienSo: '98F1-10529', soGhe: 4};
var xe02 = {bienSo: '29F1-10529', soGhe: 16};

function info(say) {
    return 'Biển số:' + this.bienSo + ' Số ghế:' + this.soGhe + ' ' + say;
}

var thongTinXe01 = info.bind(xe01, 'Xin chào bào con');
var thongTinXe02 = info.bind(xe02, 'Xin chào bào con');

console.log(thongTinXe01());
console.log(thongTinXe02());
// Biển số:98F1-10529 Số ghế:4 Xin chào bào con
// Biển số:29F1-10529 Số ghế:16 Xin chào bào con
4. Kết luận

Nhìn chung, hàm call và apply là gần giống nhau. Chúng đều gọi hàm trực tiếp. Chỉ khác ở cách truyền tham số vào (với call thì đối số phân cách bởi dấu phẩy comma và với apply thì đối số cho bởi mảng array)
Hàm bind thì hơi khác hơn một chút. Hàm này không gọi hàm trực tiếp mà nó sẽ trả về một hàm mới. Và bạn có thể sử dụng hàm số mới này sau. Về cách truyền tham số vào thì nó giống với hàm call.

 

 

 

+1