This article is purely their own combination of online article summary, have questions and different ideas welcome message
/******************** Simple Small Example ********************/
var test =function () {
Console.log (this);
};
Test (); Window
/*****************************2***********************************/
var test2 =function () {
Console.log (this);
return function () {
Console.log (This)
}
};
var bb={
A: ' 1 ',
Cc:test2//Assignment type not yet executed
};
bb.cc () (); 1.obj 2.window
/*****************************3***********************************/
var test3 =function () {
Console.log (this);
return function () {
Console.log (This)
}
};
var bb3={
A: ' 1 ',
CC:TEST3 ()//default at outermost execution
};
Bb3.cc (); 1.window 2.obj
Test2 Tes3 is just a parenthesis difference, which determines the caller to point to;
/************ Common Function Example *****************/
var obj = {
birth:1990,
Getage:function () {
var B = This.birth;
var that=this;
Console.log (this); This points to obj
return function () {
Console.log (that); the//that cache remains in the pointer to the OBJ
Console.log (this); This point to window the final caller is not obj but window;
};
}
};
Obj.getage () ();//direct to the caller "Obj.getage ()" After execution becomes "()" and "() directly on the outermost window"
/************ arrow function Log in *****************/
var obj2 = {
Name: ' Obj2 ',
birth:1990,
Getage:function () {
var B = This.birth; 1990
return () = {
var c= ' hehe ';
Console.log (this);//obj2
return () = {
Console.log (this)//obj2 arrow function This always points to the outermost obj2;
}
}
}
};
Obj2.getage () () ();
The design of the two-example arrow function is more reasonable, the this always points to the obj2 at the time of definition, and the traditional function directly points to window in this case.
Personal feeling is a little unreasonable,
/************************* General Constructor ***************************************/
function Fn (name,age) {
This.name=name;
This.age=age;
Console.log (this); This point points to this object after you pass the new instance
return function () {
Console.log (this)//final execution of the call or window; not new object
};
}
var obj=new Fn (' Zhang Fei ', ' 14 '); This Fn
obj (); This window
/******************* Arrow Constructor *********************************************/
function Fn2 (name,age) {
This.name=name;
This.age=age;
Console.log (this); Obj2
return () = {
Console.log (This)//obj2
return () = {
Console.log (This)//obj2
}
}
}
var obj2=new Fn2 (' Zhang Fei ', ' 14 '); This point obj2
Obj2 (); This point obj2
Fn2 () () ();//If the constructor executes directly as a normal function, all points to the original window
By contrast, we can find that summing up the arrow function is a good solution to the problem that this original point in the function is unreasonable. You just have to remember that the arrow functions inherit the original
The outermost definition of this
JS this point (ES5) and ES6 arrow function This points to the problem summary (Fung Fung version)