It is easy for you to learn about js classes, so that you can quickly master the js class definition methods. There are many methods and the results are the same. You can choose based on your hobbies. Post a code first:
Function O (user, pwd) {// use constructor
This. user = user;
This. pwd = pwd;
This. get = get;
Return this;
}
Function O2 (user, pwd) {// use factory
Var obj = new Object ();
Obj. user = user;
Obj. pwd = pwd;
Obj. get = get;
Return obj;
}
Function O3 () {// use prototype
}
O3.prototype. user = 'abc ';
O3.prototype. pwd = 'dis ';
// O3.propotype. get = 'get ';
// O3.prototype. get (){
// Alert (this. pwd );
//}
Function O4 (user, pwd ){
This. user = user;
This. pwd = pwd;
Return this;
}
O4.prototype. get = function () {alert ('20140901 ');}
// Function get (){
// Alert ("This User:" + this. user );
//}
Function test2 (){
// Var a = new O2 ('us', 'PW '); use factory & constructor
// Var a = new O3 (); // use prototype
// A. get ();
Var a = new O4 ('* u4', 'p4'); // mixed
// A. user = 'not abc'; // set new property
// Alert (a. user );
A. get ();
}
Commonly used MS. There may be other ones. Let's talk about it ....
Problem: I owe my hand yesterday and tried to use alert (window. appName) to go down to ff to check the browser version. The result displayed is Netscape, not firefox. Then I ran to chrome to test again, and Netscape appeared again. Baidu searched for Netscape and found that js was from Netscape. Shame !!! I have studied JavaScript for so long that I don't know my grandfather. So I ran to find my family tree. Originally, js came from Brendan Eich. When he created js in 95 years, he was 31 years old. Oh, it's really white. I like him, but I can't learn js now. It's really more popular than anyone else .. When js was designed, it didn't come up with the idea of switching from a phone call to a smart machine that combines photos, surfing the Internet, games, and phones. It's really artificial !!! Maybe it's amazing that I didn't even think of Brendan Eich myself. It should be said that Brendan Eich has created js, and a large number of js cool people have achieved so complex JavaScript today.
Isn't js a wooden class? It doesn't matter. Didn't people design prototype attributes ~
Isn't js block-level scope available for wood? It doesn't matter. Isn't there a scope chain ~
How does js privatize member variables? Oh, use the closure to solve it ~
Oh, so many basic concepts are completely lost, and the road is long.
Let's get down to the truth. This article discusses several methods to create objects in js, starting with the best-understood factory model:
The Code is as follows:
Function createPerson (name, age, job ){
Var o = {};
O. name = name;
O. age = age;
O. job = job;
O. sayName = function (){
Alert (this. name );
};
Return o;
}
Var tanya = createPerson ("tanya", "30", "female ");
Var ansel = createPerson ("ansel", "30", "male ");
Tanya. sayName ();
Ansel. sayName ();
Define o as an empty object, and then set a bunch of properties for o. In fact, it can also be directly given to the o attribute, so if it is written in this way, it is OK.
The Code is as follows:
Function createPerson (name, age, job ){
Var o = {
Name: name,
Age: age,
Job: job,
SayName: function (){
Alert (this. name );
}
};
Return o;
}
Var tanya = createPerson ("tanya", "30", "female ");
Var ansel = createPerson ("ansel", "30", "male ");
Tanya. sayName ();
Ansel. sayName ();
Another way is to use the invincible this, because this indicates the object at the current runtime, and points the scope of the constructor this to the new object, assign the attributes and methods of the currently running object to the new object. The object mode is called the constructor mode.
The Code is as follows:
Function Person (name, age, job ){
This. name = name;
This. age = age;
This. job = job;
This. sayName = function (){
Alert (this. name );
};
}
Var tanya = new Person ("tanya", "30", "female ");
Var ansel = new Person ("ansel", "30", "male ");
Tanya. sayName ();
Ansel. sayName ();
In this example, both tanya and ansel have a constructor attribute pointing to person.
Consider the following situations:
The Code is as follows:
Function Person (name, age, job ){
This. name = name;
This. age = age;
This. job = job;
This. sayName = function (){
Alert (this. name );
};
}
Person ("tanya", "30", "female ");
Person ("ansel", "30", "male ");
Window. sayName ();
Window. sayName ();
It is found that ansel is used for both pop-up, because if new is not used, it is not an instance of person, but is only executing the function. When a function is called in the Global scope, this always points to the Global object. The Global object is a window object in the browser.
We can also use the constructor mode to call the sayName method in another object. Do you still remember Apply and call? Come and consider another situation,
The Code is as follows:
Function Person (name, age, job ){
This. name = name;
This. age = age;
This. job = job;
This. sayName = function (){
Alert (this. name );
};
}
Var olivia = {};
Person. call (olivia, "tanya", "30", "female ");
Olivia. sayName ();
Var philip = {}
Person. apply (philip, ["ansel", "30", "male"]);
Philip. sayName ();
The prototype model requires the prototype chain. After analysis, the sayName method is repeatedly defined twice in the instance, but there is no need to create two identical copies. The prototype method can be used to share a sayName method between tanya and ansel.
The prototype is written as follows:
The Code is as follows:
Function Person (name, age, job ){
This. name = name;
This. age = age;
This. job = job;
}
Person. prototype. sayName = function (){
Alert (this. name );
};
Var tanya = new Person ("tanya", "30", "female ");
Var ansel = new Person ("ansel", "30", "male ");
Tanya. sayName ();
Ansel. sayName ();
In actual applications, a certain mode is not used in a constant manner. The prototype mode is used when a shared method is required. The constructor mode is used when a copy is required. It can also be combined to encapsulate all information in the constructor, by initializing the prototype in the constructor, the object maintains the advantages of using both the constructor and prototype.
The Code is as follows:
Function Person (name, age, job ){
This. name = name;
This. age = age;
This. job = job;
If (typeof sayName! = "Function "){
Person. prototype. sayName = function (){
Alert (this. name );
};
}
}
Var tanya = new Person ("tanya", "30", "female ");
Var ansel = new Person ("ansel", "30", "male ");
Ansel. sayName = function (){
Alert ("Hi ansel, how hansome you are! ");
}
Tanya. sayName ();
Ansel. sayName ();
