Explanation of the long-puzzled var self=this

Source: Internet
Author: User

First of all, this is the origin of this object (personal understanding):
Each function creates two special variables when the definition is parsed by the ECMAScript parser: this and arguments, in other words, each function has its own this object, which is bound at run time based on the execution environment of the function, that is, in the global object, This refers to the Window object, and in the custom function, the This object points to the object that called the function.
That is, this refers to the object that invokes the execution environment.
In the case of a function nesting environment, this refers to an object that invokes an external function or an internal function's execution environment;

(Note: This will point to other objects if the function execution environment can be changed by using call () or apply (). )

Hey.. The above description is still a bit verbose, so let's look at an example:
/*-----2014-2-10 This example is wrong-----*/
function BaseType (name,age) {
Saves the This object in the current function execution environment with a variable
There may be a question here: Why do you have to save this? This is because intrinsic functions (such as the two anonymous functions included in this function)
When the this variable is searched, only the this that belongs to it is searched, and the function that contains it is not searched for this.
So, to be able to use the this object of an external function in an intrinsic function, assign it a variable called self.
var self=this;
This.name=name;
This.age=age;
This.sayhello=function () {
Console.log ("My name is" +this.name+ ", and I ' M" +this.age+ "years old.");
}
This.saysomething=function () {
The use of this is somewhat inappropriate and can be completely used without self.
Self.sayhello ();
The correct approach is to:
return function () {Self.sayhello ();}
See: http://skybirdzw.blog.163.com/blog/static/72570626201411032516719/

}
}
var b1=new BaseType ("Wede", 30);
B1.saysomething (); My name is Wede, and I ' M 30years.

Judging from the results, it is the expected result.
Then there may be a new question: Why not use Self.sayhello () in the SaySomething () method to invoke it,
Direct SayHello () how good?
In fact, this involves another topic: instance members and local members.
The significance of creating a constructor is to use it to create an instance, so all members belonging to the instance need to be defined with this;
Only those members that do not belong to the instance will not use this definition;
Of course, after defining the method with this, you need to add this when you want to call this method inside the function scope.

To prove this, take a look at the following code:
function BaseType (name,age) {
var self=this;
This.name=name;
This.age=age;
This.sayhello=function () {
Console.log ("My name is" +this.name+ ", and I ' M" +this.age+ "years old.");
}
This.saysomething=function () {
SayHello ();
}
}
var b1=new BaseType ("Wede", 30);
B1.saysomething (); Referenceerror:sayhello is not defined
The results show that the SayHello method is undefined.
That is, we call the local method SayHello, and now only the instance method SayHello, so there will be an exception.

Below to modify (note the bold part):
function BaseType (name,age) {
var self=this;
This.name=name;
This.age=age;
var sayhello=function () {
Console.log ("My name is" +name+ ", and I ' M" +age+ "years old.");
}

This.saysomething=function () {
SayHello ();
}
}
var b1=new BaseType ("Wede", 30);
B1.saysomething ();//my name is Wede, and I ' M 30years.

As you can see, the expected results are output.
At this point, we turn the SayHello method into a local method (not visible to the instance) and then call it in the SaySomething method.

Explanation of the long-puzzled var self=this

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.