Javascript Basics-------This keyword

Saying that many classmates in just learn JavaScript, always encounter this keyword, and it in different scenes, often pointing to different objects, all of a sudden it is easy to give the beginner around dizzy. Actually understand the principle, it is clear that this point to the specific object.

Talk less, straight into the subject!

This keyword is generally used in four ways, as summarized in the following table

Function	Hangs on global Globals object, Browser is Window object
Method	As a method of an object, it is generally pointed to the object
New constructor	New capitalize function (), this binds to the newly generated object
Apply/call applications	This binds to both methods on the first parameter thisobj

With the table above to summarize, let's look at each of the examples to see how.

a function

var name = ' KK ';
function Test () {
Console.log (' Hello, I am ', this);
Console.log (' Name: ', this.name);
}

Test ();

This is actually a global function that is mounted underneath the Window object as a method of the Window object. So we can call it directly through the function name test (), or window.test (), which is the natural "this" keyword pointing to the Window object. and name = ' KK ' is a global variable, equivalent to Window.name = ' KK ', while calling this test method to the parent scope is the Window object.
Output

Hello, I am Window
Name:kk

Two methods

var name = ' KK '; var obj = {name: ' DD ', test:function () {console.log (' Hello, I am ', this.name);}} Obj.test (); name = ' FF '; var newtest = obj.test; Newtest ();

Obj.test (); The method of the Obj object is executed, so when the method test points to, this points to the Obj object, and of course the output should be Obj.nam, or DD.

var newtest = obj.test; Represents the assignment of the test method of obj to the Newtest object, a method for printing the name of the current object, then Newtest (), which should be executed at the window scope, rather than representing the execution of the Obj.test () method. So print out window.name, and Window.name is replaced with the latest value ' FF '.

Output
Hello, I am DD
Hello, I am FF

small pits : try to newtest var = obj.test; Newtest (); Replace with var newtest = Obj.test (); Newtest (); In contrast, it's just a few more (), but what about the results? var newtest = Obj.test (); Because there is a more (), will execute Obj.test (), print out Hello, I am DD, but because the test method does not have any return object, so newtest is undefined, then newtest () , for a undefined plus () to execute, what would it be? Error errors.

Three-structure function
The new constructor, which is typically capitalized with the new and function initials, is used to create a fresh object.

function Test (name) {this.name = name;
}
var obj1= new Test (' Tom ');
var obj2 = obj1;
Obj2.name = ' Steve ';
Console.log (Obj1.name);

New OBJ1 The first object to assign ' Tom ', and Obj2 points to Obj1, so obj1.name can also be updated by Obj2.name.
Output

Steve

Four Apply/call applications

var test = function () {console.log (this);} var obj = {name: ' Tom '};test.apply (obj);

Output

object{name: ' Tome '} that is obj object

What's the difference between Apply/call's application and bind? Test.bind (obj);  Does not execute immediately and requires var excutetest = Test.bind (obj); Excutetest (); To execute the method.

This article is from the "8129266" blog, please be sure to keep this source http://8139266.blog.51cto.com/8129266/1835766

Javascript Basics-------This keyword