bind (Function Bind)
«bind در جاوااسکریپت» متدی برای قفل کردن this است. یعنی می گویی این تابع همیشه با همین صاحب اجرا شود. مثل وقتی معلم دفتر حضور را به «همین شاگرد» می سپارد.
قرض گرفتن متد با bind()
با bind یک متد را به شیء جدید می چسبانیم. پس همان کد، مالک تازه می گیرد.
const person = {
firstName: "John",
lastName: "Doe",
fullName: function () {
return this.firstName + " " + this.lastName;
}
};
const member = {
firstName: "Hege",
lastName: "Nilsen"
};
let fullName = person.fullName.bind(member);
حفظ this با bind()
گاهی this در callback گم می شود. bind آن را نگه می دارد.
const person = {
firstName: "John",
lastName: "Doe",
display: function () {
let x = document.getElementById("demo");
x.innerHTML = this.firstName + " " + this.lastName;
}
};
person.display();
وقتی تابع را مستقیم به setTimeout می دهیم، this می پرد و undefined می شود.
const person = {
firstName: "John",
lastName: "Doe",
display: function () {
let x = document.getElementById("demo");
x.innerHTML = this.firstName + " " + this.lastName;
}
};
setTimeout(person.display, 3000);
راه حل ساده است؛ یک نسخه بایندشده بساز و همان را بده.
const person = {
firstName: "John",
lastName: "Doe",
display: function () {
let x = document.getElementById("demo");
x.innerHTML = this.firstName + " " + this.lastName;
}
};
let display = person.display.bind(person);
setTimeout(display, 3000);
مقایسه سریع با call و apply
call و apply فقط همان لحظه this را می گذارند. اما bind در جاوااسکریپت یک «تابع جدید» می سازد که this را برای همیشه نگه می دارد. درباره call اینجا بخوان: call. درباره apply هم اینجا: apply.
گام های تمرینی
- یک متد بساز که از this استفاده کند.
- یک شیء داده بساز با firstName و lastName.
- متد را با bind به آن شیء بچسبان و اجرا کن.
جمع بندی سریع
- bind یک تابع جدید می سازد.
- این تابع، this ثابت دارد.
- برای callback ها عالی است.
- قرض گرفتن متد را ساده می کند.