Javascript Learning Notes Functions (II): This working mechanism

Under global scope

this;

When using this in a global scope, it points to a global object.

Here is a detailed introduction to the global object:

Global object is an object that has been created before entering any execution context;

There is only one copy of this object, and its properties can be accessed anywhere in the program. The life cycle of the global object ends at the moment the program exits.

In the initial creation stage of the global object, Math, String, Date, parseInt are initialized as its own attributes, etc., and other additional objects can also be created as attributes (which can point to the global object itself). For example, in the DOM, the window property of the global object can refer to the global object itself.

So it is the same as this.window in the console.

When calling a function

foo();

Here, this also points to the global object.

When calling a method

test.foo();

In this example, this will point to the test object.

When calling a constructor

new foo();

A function is used with the keyword new when called, which we call a constructor. At this time, within the function, this points to the newly created object.

When explicitly set

 function foo(a, b, c) {}//var bar = {};foo.apply(bar, [1, 2, 3]); // array will expand to the belowfoo.call(bar, 1, 2, 3); // results in a = 1, b = 2, c = 3

When using the apply and call methods of Function.prototype, the value of this is explicitly set to the first parameter of the method.

Therefore, unlike the rules when calling a function, this in the above example points to bar.

Here are the call and apply methods:

call method :

Syntax: call([thisObj[,arg1[, arg2[, [,.argN]]]]])

Definition: Call a method of an object to replace the current object with another object.

apply method :

Syntax: apply([thisObj[,argArray]])

Definition: Apply one method of a certain object and replace the current object with another object.

Here we need to note that this cannot be used to point to the object itself when the object is literally declared. as follows:

 var obj = {me: this}

Here, this will not point to obj, and the application of this is limited to the above five situations.

Summarize

Although the above situation is mostly meaningful, this in the second case (i.e. when calling a function) is actually rarely useful, which is considered another error in Javascript design.

 Foo.method = function() { function test() { // this is set to the global object } test();}

As we mentioned above, this here will point to the global object, not the Foo function.

In order to get a way to point to Foo in test, we need to create a local variable inside the method pointing to Foo.

 Foo.method = function() { var that = this; function test() { // Use that instead of this here } test();}

that is just a normal variable name, but it is often used to point to this external.

There is another interesting thing related to function alias, that is, when a method is assigned to a variable.

 var test = someObject.methodTest;test();

In the above example, test will be treated as a normal function, so according to the second case (i.e. when a function is called), this inside it will point to a global variable, not someObject.

Although this late binding seems a bad decision at first, it is actually the basis of prototype inheritance.

 function Foo() {}Foo.prototype.method = function() {};function Bar() {}Bar.prototype = Foo.prototype;new Bar().method();

At this point, when method is called, it will point to the instance object of Bar.