Effective JavaScript Item 20 uses the call method to bind the this variable

this series as effective JavaScript 's reading notes.

in general, a function Thisis related to the invocation type of the function, such as when the function is called directly as a function, ThisThe general point is the global object(Strictmodewhen pointing toundefined)when the function is invoked as a method(thatX.method ()this form), Thispoint to ISxwhen the function is called as a construction method, Thispoints to a newly created object.

But on some occasions, you need to specify This For example, the following code needs to be This point to an object obj , a simple approach is as follows:

Obj.temporary = f; What if obj.temporary already existed?var result = Obj.temporary (Arg1, arg2, Arg3);d elete obj.temporary; What if obj.temporary already existed?

But the code above assumes obj there is no property called Temporary , it is obviously not good to make such assumptions in the actual code. Also, in some cases, objects may be set to be unable to be extended, that is, they cannot be added to new properties. Adding a property to an object that is not created by you is also not a good behavior, as discussed in detail in Item .

Fortunately, function provides a built -in Pager method to address this problem:

F.call (obj, arg1, arg2, ARG3);

Pager The first parameter of a method is set This the point.

Use Pager method to invoke one of the benefits of the method:

even if an object does not have this method, you can set the This point to complete the call to the method, such as:

var hasOwnProperty = {}.hasownproperty;dict.foo = 1;delete dict.hasownproperty;hasownproperty.call (dict, "foo"); Truehasownproperty.call (Dict, "hasOwnProperty"); False

The above code is first taken by an empty object to the hasOwnProperty method, and then use the Pager method to determine a Dictionary object exists on a Key .

Pager methods are also useful when defining higher-order functions. A common requirement when using higher-order functions is to provide a pointer to this, such as:

var table = {entries: [],addentry:function (key, value) {This.entries.push ({key:key, value:value});},foreach:function (f, Thisarg) {var entries = This.entries;for (var i = 0, n = entries.length; i < n; i++) {var entry = Entries[i];f.call (Thisarg, ENT Ry.key, Entry.value, i);}};

above ForEach A method defines two parameters:

F : A callback function

Thisarg : This the specific point

An example is the table1 all key-value pairs are copied to the table2 Medium:

Table1.foreach (Table2.addentry, table2);

Note that the above code, when executing the callback function, passes in the Thisthe other three parameters are pointed out, respectivelyKey,valueas wellIndex, and then inAddEntrymethod does not define theIndexparameter, this behavior isJavaScriptis valid, the extra parameters are automatically ignored, and if you need to access parameters that are not defined, you can alsoargumentsthis variable is obtained.

Summarize:

2. Use Pager method to determine when a function is called This the point
4. Use Pager method to invoke a method that does not exist on the object
6. Use Pager method to define the higher order function, which allows the caller to specify the callback function This the point

Effective JavaScript Item 20 uses the call method to bind the this variable