Apply, call, bind in JavaScript

JavaScript functions 定义时上下文 运行时上下文 have concepts such as "" and "" and " 上下文是可以改变的 "

apply and call functions

1. Call () and apply () all exist to change a function 运行时的上下文 (context), in other words, to change the direction of this within the function body.

2. The call () method accepts one 参数列表 , and the Apply () method accepts a 数组 (or class array object) that contains multiple arguments

Fun.apply (thisarg[, Argsarray]) parameter: Thisarg specified when the fun function is runThis value. It is important to note that the specifiedThis value does not necessarily mean that the function executes when the actualThis value, if the function is in a non-strict mode, it is specified as  null or undefined automatically points to the global object (the browser is window object), while the value is the original value (number, String, Boolean) of the this will point to the original value of the automatic wrapper object. Argsarray an array or class array object, where the array elements are passed as separate arguments to the fun function. If the value of this parameter is null or undefined, it means that no parameters need to be passed in. Class array objects can be used starting from ECMAScript 5. For browser compatibility, see the bottom of this article. Fun.call (thisarg[, arg1[, arg2[, ...]) parameter: Thisarg the this value specified when the fun function is run. It should be noted that the specified this value is not necessarily the actual this value when the function executes, and if the function is in non-strict mode, it is specified as The class= hljs-literal ">undefined" null and this will automatically point to the global object ( The browser is the window object), while the value is the original value (number, String, Boolean) this will point to the original value of the automatic wrapper object. Arg1, Arg2, ... Specified argument list               

function a(xx, yy) { alert(xx, yy); alert(this); alert(arguments);}a.apply(null, [5, 55]);a.call(null, 5, 55);

bind function

The bind () method will 创建一个新函数 , when this new function is called, its this value is passed to bind () the first parameter, its parameter is bind () the other parameters and its original parameters

fun.bind(thisArg[, arg1[, arg2[, ...]]])参数:    thisArg        this 指向。当使用new 操作符调用绑定函数时，该参数无效。    arg1, arg2, ...        当绑定函数被调用时，这些参数加上绑定函数本身的参数会按照顺序作为原函数运行时的参数

If you are interested in knowing what the Minister of Function.prototype.bind () is and how it works, here is a very simple example:

Function.prototype.bind = function (scope) { var fn = this; return function () { return fn.apply(scope); };}

MDN provides an absolutely reliable alternative to browsers that do not implement the bind () method themselves:

if (!Function.prototype.bind) {Function.prototype.bind =function(Othis) {if (typeofThis!== "function") {Closest thing possible to the ECMAScript 5 internal iscallable functionThrowNewTypeError ("Function.prototype.bind-what are trying to be bound are 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;};           

So summarize:

1. Apply, call, and bind are all pointers to the This object that is used to change the function;

2. Apply, call, bind the first parameter is the object that this is to point to, that is, the context you want to specify;

3. Apply, call, bind three can use the following parameters to pass the parameter;

4. Bind is to return the corresponding function, which is convenient to call later; apply, call is called immediately.

 

 

Apply, call, bind in JavaScript