JavaScript Object-oriented

We know that to create an object we can use the following code:

var user = new Object ();

User.Name = ' Programming prodigal ';

User.age = 22;

user.address = ' Chengdu, Sichuan ';

Creating objects in this way is simple and intuitive, and is the most basic way to create objects in JavaScript. But there is a problem, if we need to create multiple objects, then I have to write a lot of duplicate code. For example, we want to create another object user1, we have to re-write the above code again, which is not appropriate in the actual development process, so if the object is too large, the amount of code will be greatly increased.

To solve this problem, we can use a method called * * Factory mode * *, which is to solve the problem that the instantiated object produces a lot of duplicate code.

Factory mode

function Create (name, age) {

var obj = new Object ();

Obj.name = name;

Obj.age = age;

Obj.show = function () {

return this.name + "+ this.age;

};

return obj;

}

var obj1= create (' Bclz ', 30); First Instance

var obj2= create (' Bcxb ', 20); A second instance

Alert (Obj1.show ()); Alert (Obj2.show ());

Constructors (construction methods)

function User (name, age) {//constructor mode

THIS.name = name;

This.age = age;

This.show = function () {

return this.name + ' +this.age;

};

}

When you create an object, you can use the new operator:

var user1 = new User (' Bclz ', 30); First Instance

var user2 = new User (' Bcxb ', 20); A second instance

* * Use the new operator * *

var user = new Object (); Create an object using the new operator

User.Name = ' Programming prodigal '; Adding properties to an object

User.age = 22; user.address = ' Chengdu, Sichuan ';

* * Simple Way (traditional assignment mode) * *

var user = {};

User.Name = ' Programming prodigal '; Adding properties to an object

User.age = 22;

user.address = ' Chengdu, Sichuan '; * * properties are called * *

There are two ways to call object properties: The calling method is as follows:

Alert (User.Name + "" +user.age);//Return to ' programming prodigal Sichuan Chengdu '

Another method: Alert (user[' name '] + "" +user[' age ');//Return to ' programming prodigal Sichuan Chengdu '

* * Add Method * *

var user = {

Name: ' Programming Prodigal ',//adding attributes to an object

Age:22,

Address: ' Chengdu, Sichuan ',

Showinfo:function () {//Add a method

Alert (this.name+ "+this.age+" "+this.address");

},

showhello:showhello//Adding a method outside an object to an object

};

function Showhello () {

Alert ("hello!");

}

User.showinfo ();//Call Method User.showhello ();

function Cat (name,color) {

THIS.name = name;

This.color = color;

This.type = "Cat animal";

This.eat = function () {alert ("Eat Mouse");

To generate an instance:

var cat1 = new Cat ("Da Mao", "Yellow");

var cat2 = new Cat ("Er Mao", "Black");

alert (Cat1.type); Cat animal cat1.eat (); Eat mice

There seems to be no problem on the surface, but there is a big drawback in actually doing so. That is, for each instance object, the type attribute and the Eat () method are identical, and each time an instance is generated, it must be a duplicate of the content and occupy more memory. This is neither environmentally friendly nor inefficient.

Alert (cat1.eat = = cat2.eat); False

**javascript Advanced Programming * *

Description and description of the prototype in the book

function person () {}//Create person constructor

Person.prototype.name = "Nicholas";//Create a shared property name

Person.prototype.age = 29; Create a shared property age

Person.prototype.job = "Software Engineer"; Create a shared property job

Person.prototype.sayName = function () {

Create a shared function Sayname alert (this.name);

};

Person1 and Person2 are created, each with sayname functions, and the values that pop up are the same

var person1 = new Person ();

Person1.sayname (); "Nicholas"

var person2 = new Person ();

Person2.sayname (); "Nicholas"

Alert (Person1.sayname = = Person2.sayname); True

Alert (Person.prototype.isPrototypeOf (Person1)); True

Alert (Person.prototype.isPrototypeOf (Person2)); True

function User () {};

var person3 = new User ();

Alert (Person.prototype.isPrototypeOf (Person3)); False

Alert (User.prototype.isPrototypeOf (Person3)); True

# # # Basic prototype # # #

function person () {}

Person.prototype.name = "Nicholas";

Person.prototype.age = 29;

Person.prototype.job = "Software Engineer";

Person.prototype.sayName = function () {

alert (this.name);

};

# # # More Simple Way # # #

function person () {}

Person.prototype = {

Name: "Nicholas", age:29, Job: "Software Engineer",

Sayname:function () {

alert (this.name);

}

};

function person () {}

Person.prototype = {

Constructor:person,

Name: "Nicholas",

Age:29,

Job: "Software Engineer",

Friends: ["Shelby", "Court"],

Sayname:function () {

alert (this.name);

}

};

var person1 = new Person ();

var person2 = new Person ();

Person1.friends.push ("Van");

alert (person1.friends);    "Shelby,court,van" alert (person2.friends); "Shelby,court,van"

Alert (person1.friends = = = Person2.friends); True

The above case is easy to see, the question of property written in the prototype, sake friends is the array, the reference data type in Person1 modified friends, after adding a bar of data, You can see that the friends of the Person1 and Person2 objects have changed, which is very well understood, because the prototype object itself is shared, the array is a reference type, changes one, and the rest changes.

# # # Constructors and prototypes in a way of combining # # #

function person (name, age, Job) {

THIS.name = name;

This.age = age;

This.job = job;

This.friends = ["Shelby", "Court"];

}

Person.prototype = {

Constructor:person,

Sayname:function () {

alert (this.name);

}

}

var person1 = new Person ("Nicholas", "Software Engineer");

var person2 = new Person ("Greg", "Doctor");

Person1.friends.push ("Van");

alert (person1.friends);    "Shelby,count,van" alert (person2.friends); "Shelby,count"

Alert (person1.friends = = = Person2.friends);    False alert (Person1.sayname = = = Person2.sayname); True

# # # Dynamic prototype Mode # # #

function person (name, age, Job) {

attribute this.name = name;

This.age = age;

This.job = job;

Method if (typeof this.sayname! = "function") {

Person.prototype.sayName = function () {

alert (this.name);

};

}

}

var friend = new Person ("Nicholas", "Software Engineer"); Friend.sayname ();

JavaScript Object-oriented