The JavaScript this pointer is pointing to?

Objective

Understanding the JavaScript pointer needs to understand the JS execution environment and scope first! The execution environment defines the other data that a variable or function has access to, and determines their respective behavior. Each execution environment has a variable object associated with it, and all variables and functions defined in the environment are stored in the object. Although the code we write does not have access to this object, the parser uses it in the background when it processes the data.

1. Global Execution Environment

The global execution environment is the outermost execution environment, depending on the host environment that JS implements, the objects that represent the execution environment are different. In a Web browser, a window is considered a globally executed object. So all global variables and functions are created as window objects. After all code in an execution environment is executed, the environment is destroyed, and all the variables and function definitions stored therein are destroyed. Each function has its own execution environment, and when the execution flow enters a function, the environment of the function is pushed into an environment stack. After the function executes, the stack pops up its environment.

2. Scope Chain

When the code executes in an environment, a scope chain of variables is created (scope chain). The purpose of a scope chain is to ensure an orderly access to all variables and functions that the execution environment has access to. The front end of a scope chain is always a variable object of the environment in which the code is currently executing, and if the environment is a function, its active object is used as a variable object. The active object contains only one variable at the beginning, arguments the object. The next object of the scope chain comes from the containing (external) environment, and the next object comes from the next containing object, which continues to the global.

Because of the nature of JavaScript binding at run time, this can be a global object, the current object, or any object in JavaScript, depending on how the function is called. The invocation of a function in JavaScript has several ways: as an object method call, as a function call, as a constructor call, and with an apply or call invocation.

Take a look at the first example below

var point = {
x:0,
y:0,
Moveto:function (x, y) {
Console.log (this);//1
This.x = this.x + x;
This.y = This.y + y;
}
};
Point.moveto (a); This binds to the current object, which is the point object
Console.log (point);//2

The this in the first position when we print we find that this is pointing to the object of point!

Point.moveto () This method changes the properties of Object point x and y after it executes

A second example

function func (x) {
this.x = x;
Console.log (this);
}
Func (2);

We found this point of this time to be window why?

It's good to understand that Func (2) can be written as Window.func (2); Since any function or global property is under the Window object, this is of course the window

A third example

var point = {
x:0,
y:0,
Moveto:function (x, y) {
Intrinsic functions
var MoveX = function (x) {
Console.log (this);
this.x = x;
};
Intrinsic functions
var Movey = function (y) {
This.y = y;
Console.log (this);
};
MoveX (x);
Console.log (MoveX () in point);//false
Console.log (MoveX () in window);//true
Movey (y);
}
};
Point.moveto (a);
Point.x; =>0
Point.y; =>0

The above code is well understood under our analysis! There are two methods in execution Point.moveto, Movex and Movey, which are not bound to the object point, and we know that all methods belong to the Window object, So the Movex and Movey here are actually called on the window, not the point object!

A fourth example

function point (x, y) {
Console.log (this);//The first time is created by new, return is point{} It's an object, not a simple method.
this.x = x; This?
This.y = y; This?
}
var np=new point;//So it can be understood here.
/*
var np = {
x = 1,
Y =1
};
*/
Np.x;//1
var p=point (2,2);//This time is not created by new, which is equivalent to window. Point (2,2), it is bound to the window! So this is pointing to window
Console.log (P);//Because the function point has no return value, p = undefined
P.x;//error, p is an empty object undefined

Summarize:

This

invocation Form	point
Common functions	Global Object window
Methods of the Object	The object
constructor function	The newly constructed object

Article Reference address:

http://www.cnblogs.com/isaboy/

Http://www.cnblogs.com/isaboy/archive/2015/10/29/javascript_this.html

The JavaScript this pointer is pointing to?