Put 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 (' 123 ');}
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 in these kinds of MS, there may be other. Come on, let's talk.
Digression: Yesterday hand owed, trying to use alert (window.appname) to the FF below to view the browser version, the results popped up unexpectedly is Netscape, I am not Firefox. Then ran to the chrome test, once again popped up Netscape. Baidu search Netscape unexpectedly found JS from Netscape Company. Ashamed, ashamed,!!!. The study of such a long time JS do not know Huang. So ran to find a family tree, originally JS from Brendan Eich hand, 95 he created JS time, but also 31 years old. Ah, really white live, such as his general old me, to now learn not JS, really people than popular dead. JS was originally designed, did not think of their own phone from a telephone to become a set of photos, internet, games, telephones in a smart machine. It's a!!!. Perhaps the magic of each, even Brendan Eich I did not think. It should be said that Brendan Eich created JS, and a large number of JS cattle people to achieve today so complex JS.
JS is not a wooden class? It doesn't matter, the others didn't design the prototype attribute ~
JS is not a block-level scope of the wood? It doesn't matter, the family is not a scope chain ~
How does JS implement member variable privatization? Oh, let's fix it with a closure.
Oh, so many basic concepts, completely dizzy out, the road long its repair far XI.
Anyway, this article discusses several ways to create objects in JS, starting with the best understanding of the factory model:
Copy Code code 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", "a", "female");
var Ansel = Createperson ("Ansel", "a", "male");
Tanya.sayname ();
Ansel.sayname ();
This first defines O as an empty object, and then sets a bunch of properties for O. In fact, you can also directly to the O attribute, so if this is ok to write.
Copy Code code 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", "a", "female");
var Ansel = Createperson ("Ansel", "a", "male");
Tanya.sayname ();
Ansel.sayname ();
Another option is to use the invincible this, because this represents the object at the current runtime, the scope of the constructor this to the new object, and the properties and methods of the currently running object to the new object, so that the object pattern is called the constructor pattern
Copy Code code 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", "a", "female");
var ansel = new Person ("Ansel", "a", "male");
Tanya.sayname ();
Ansel.sayname ();
In this example, both Tanya and Ansel have a constructor attribute that points to the person.
Consider the following:
Copy Code code as follows:
function Person (name,age,job) {
THIS.name = name;
This.age = age;
This.job = job;
This.sayname = function () {
alert (this.name);
};
}
Person ("Tanya", "a", "female");
Person ("Ansel", "a", "male");
Window.sayname ();
Window.sayname ();
It is found that two times the pop-up is Ansel, because without new, it is not an instance of person, but only in the execution function. This always points to the global object when a function is called in the global scope. The global object is the Window object in the browser.
We can also invoke the Sayname method in another object using the construction pattern, remember apply and call, come to think of another case,
Copy Code code 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", "a", "female");
Olivia.sayname ();
var Philip = {}
Person.apply (philip,["Ansel", "the", "male");
Philip.sayname ();
Prototype model to consider the prototype chain, analysis, the Sayname method in the example is repeatedly defined two times, but in fact there is no need to create two copies. Using a prototype method, you can make a sayname method of sharing a Tanya and Ansel.
So the prototype pattern is written as follows:
Copy Code code 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", "a", "female");
var ansel = new Person ("Ansel", "a", "male");
Tanya.sayname ();
Ansel.sayname ();
When applied, it is not rigid to apply a pattern, ingenious. When you need to share a method, you use a prototype pattern, you use a build pattern when you need a copy, you can combine all the information in a constructor, and by initializing the prototype in the constructor, the object retains the advantage of using both the constructor and the prototype.
Copy Code code 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", "a", "female");
var ansel = new Person ("Ansel", "a", "male");
Ansel.sayname = function () {
alert ("Hi Ansel, how to Hansome you are!");
}
Tanya.sayname ();
Ansel.sayname ();
