This example in javaScript to learn details and working principles _ basic knowledge

This article describes how to learn this example in javaScript and how it works. How this works

If a function is called as a method of an object, this is assigned as this object.

The Code is as follows:

Var parent = {
Method: function (){
Console. log (this );
}
};

Parent. method ();
// <-Parent

Note that this behavior is very "fragile". If you obtain a method reference and call it, the value of this will not be a parent, but a global window object. This confused most developers.

The Code is as follows:

ThisClownCar ();
// <-Window

Change this

The. call,. apply, And. bind methods are used to call a function. this helps us define the value of this and the parameter value passed to the function.

Function. prototype. call can have any number of parameters. The first parameter is assigned to this, and the rest are passed to the called Function.

The Code is as follows:

Array. prototype. slice. call ([1, 2, 3], 1, 2)
// <-[2]

Function. prototype. apply is similar to. call, but the parameter passed to the Function is an array rather than any parameter.

String. prototype. split. apply ('13. 12.02 ', ['. '])
// <-['13', '12', '02']

Function. prototype. bind creates a special function that will always be used and passed. the bind parameter is used as the value of this and can be assigned with some parameters to create the curride version of the original function.

The Code is as follows:

Var arr = [1, 2];
Var add = Array. prototype. push. bind (arr, 3 );

// Define tively the same as arr. push (3)
Add ();

// Define tively the same as arr. push (3, 4)
Add (4 );

Console. log (arr );
// <-[1, 2, 3, 3, 4]

This in the scope chain

In the following example, this will not remain unchanged in the scope chain. This is a rule defect, and it often brings confusion to amateur developers.

The Code is as follows:

Function scoping (){
Console. log (this );

Return function (){
Console. log (this );
};
}

Scoping ()();
// <-Window
// <-Window

There is a common method to create a local variable to keep reference to this, and there cannot be same-lived variables in the subscope. Variables with the same name in the sub-scope will overwrite the reference to this in the parent scope. Http://www.cnblogs.com/sosoft/

The Code is as follows:

Function retaining (){
Var self = this;

Return function (){
Console. log (self );
};
}

Retaining ()();
// <-Window

Unless you really want to use this of the parent scope and the current value of this at the same time, for some inexplicable reasons, I prefer the method. bind function. This can be used to assign this of the parent scope to the subscope.

The Code is as follows:

Function bound (){
Return function (){
Console. log (this );
}. Bind (this );
}

Bound ()();
// <-Window