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.

 

 

 

Bài liên quan

Sử dụng map, filter và reduce trong Javascript

Bộ công cụ hoàn hảo cho bước khởi đầu với Functional Programming Bài viết này nhắm tới những người mới bắt đầu với Javascript hoặc những người mới bắt đầu làm việc với Javascript nhưng chưa hiểu về map, filter và reduce. Functional programming là gì ? Functional programming là một mô ...

Trần Trung Dũng viết 2 tuần trước

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.

Đào Đăng Sơn viết 00:49 ngày 13/10/2018

[SQLSERVER] Hướng dẫn sử dụng hàm CHOOSE và IIF trong SQLSERVER 2016

Bài viết hôm nay, mình sẽ các bạn sử dụng 2 hàm CHOOSE và IIF trong sqlserver , hai hàm này chỉ chạy từ phiên bản sqlserver 2012 trở lên. 1. Sử dụng IIF trong SQL SERVER: Hàm IIF là một hàm logic nó cũng giống như hai hàm đã có sẵn trong ...

Bùi Văn Nam viết 00:31 ngày 02/10/2018

[DATABASE] Hướng dẫn sử dụng CROSS APPLY và OUTER APPLY trong sqlserver

Bài viết hôm nay, mình sẽ tiếp tục hướng dẫn các bạn sử dụng Cross Apply và Outer Apply trong cơ sở dữ liệu sqlserver. + Để ví dụ, cho các bạn dễ hiểu và cách sử dụng Cross Apply như thế nào, các bạn xem hai hình bên dưới. Đầu tiên ta có ...

Trịnh Tiến Mạnh viết 00:18 ngày 02/10/2018

Sử dụng anotation @Name và @Inject trong java.

Trước hết mình sẽ đi qua việc sử dụng bean trong Spring để các bạn dễ hình dung. Khi sử dụng Spring để tạo một bean bạn khai báo như sau. <bean id="textEditor" class="com.kipalog.TextEditor"/> Trong đó textEditor là tên thực thể của lớp TextEditor. Điểu này tương đương với việc: ...

Trịnh Tiến Mạnh viết 16:08 ngày 07/09/2018
+1