Currently, I am conducting cross-browser testing and encountered an issue with using the bind() keyword in ECMAScript 5 due to its unavailability in IE8. To address this problem, I turned to Yehuda Katz's code, which proposes a utility function as an alternative to bind(). However, when attempting to implement it, I faced an exception regarding the "func.apply" line since I was passing an object instead of a function. This setback has brought me back to square one - how do I bind the "this" variable to a function body?
var bind = function (func, thisValue) {
return function () {
return func.apply(thisValue, arguments);
}
}
In my scenario, I am looking for a way to bind the "this" variable to a function body.
Summary: Seeking guidance on binding the "this" variable to a function body.
<snip>
MyView.prototype.OnSlider_Change = function (event, ui) {
this.viewModel.setVariableX(ui.value * 100.0);
}
<snip>
$("#Slider").slider({
slide: (this.OnSlider_Change).bind(this),
change: (this.OnSlider_Change).bind(this)
});
This approach can be simplified as:
$("#Slider").slider({
slide: bind(this, this.OnSlider_Change),
change: bind(this, this.OnSlider_Change)
});