Home >Web Front-end >JS Tutorial >IE supports function.bind() method implementation code_javascript skills

IE supports function.bind() method implementation code_javascript skills

WBOY
WBOYOriginal
2016-05-16 17:45:12875browse

Front-end developers should be very aware that the function object of a Javscript script can use the call or apply method to change the object pointed to by the internal scope (this) to achieve more scalable functional development. IE natively supports the call and apply methods of function objects, and is also supported in Firefox or other browsers. However, the call and apply methods are acted upon and executed immediately, for example:

Copy the code The code is as follows:

var func = function () {
alert(this);
}.apply(window);

When the script parsing engine executes this code, a dialog box will pop up immediately and the object string will be displayed. Our original intention was to define the func method to act on the window object field and execute it when called later, but the call and apply methods cannot meet our original intention, they will be executed immediately.

After google for some technical information, I found that firefox natively supports a bind method. This method satisfies our original intention very well. The calling method is the same as call and apply, except that after the definition is completed, it will be called later. This method will be executed. However, this bind method is only natively supported in browsers of IE10 version. When executed in browsers lower than this version, an undefined error message will be obtained. So we had to go online again to google the solution, and the hard work paid off. We found the solution on the Firefox development station, which is to add a property prototype so that all browsers can support the bind method. The code is as follows:
Copy code The code is as follows:

if (!Function.prototype.bind) {
Function.prototype.bind = function (oThis) {
if (typeof this !== "function") {
// closest thing possible to the ECMAScript 5 internal IsCallable function
throw new TypeError("Function.prototype.bind - what is trying to be bound is not callable");
}
var aArgs = Array.prototype.slice.call(arguments, 1),
fToBind = this,
fNOP = function () {} ,
fBound = function () {
return fToBind.apply(this instanceof fNOP && oThis
? this
: oThis,
aArgs.concat(Array.prototype.slice.call(arguments )));
};
fNOP.prototype = this.prototype;
fBound.prototype = new fNOP();
return fBound;
};
}

Understanding this code requires some knowledge. I just know how to use it. If any expert is interested in introducing the principle of this source code, I would be grateful, thank you!

Simpleness is not an attitude, but a kind of satisfaction.
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn