Summary of several JS methods for object Creation

Source: Internet
Author: User
This article describes several methods for creating objects in javascript and shares the Code with instances. I have been reading this book on JS advanced programming recently. I am free to sort out several ways to create objects. If you don't talk much about it, You can directly start with the question.

First: Create an Object constructor

 Person =  Object();

This line of code creates a new instance of the Object reference type, and then stores the instance in the variable Person.

Type 2: Use the literal representation of Objects

 Person ='Nike'29

Object literal is a short form of object definition. It aims to simplify the process of creating an object containing a large number of attributes. That is to say, the method for creating objects in the first and second ways is actually the same, but the difference in writing is different.

Before introducing the third method, we should understand why we need to use other methods to create objects, that is, the first method. The disadvantages of the second method are as follows:They all use the same interface to create many objects, resulting in a large numberIf you have 100 objects, you need to enter the same code 100 times.. So what method do we have to avoid too much repeated code? It is to encapsulate the object creation process in the function body and generate objects directly through function calls.

Third: Create an object in factory Mode

function createPerson(name,age,job){       var o  = new Object();    o.name = name;    o.age = age;    o.job = job;    o.sayName = function(){         alert(this.name);        };    return o;      }var person1 = createPerson('Nike',29,'teacher');var person2 = createPerson('Arvin',20,'student');

When using the factory mode to create an object, we can all note that in the createPerson function, an object is returned. Then we cannot determine the type of the returned object. Therefore, the fourth object creation mode is displayed.

Type 4: Create an object using a constructor

.name =.age =.job =.sayName =  person1 =  Person('Nike',29,'teacher');var person2 = new Person('Arvin',20,'student');

Compared with the factory model, we can find the following differences:

1. Create an object not displayed

2. attributes and methods are directly assigned to this object.

3. No return Statement

4. Types of objects that can finally be recognized. For object types, we should use the instanceof operator for autonomous Detection:

alert(person1 instanceof Object);//turealert(person1 instanceof Person);//turealert(person2 instanceof Object);//turealert(person2 instanceof Object);//ture

At the same time, we should also understand,By convention, constructor should always start with an upper-case letter, rather than a lower-case letter.

The constructor is actually quite useful, but it also has its disadvantages:

That is, each method must be re-created on each instance. The method refers to the function defined in the object. If the number of methods is large, it will occupy a lot of unnecessary memory. So the fifth type of object Creation

Method

Fifth: create a prototype object

function Person(){}Person.prototype.name = 'Nike';Person.prototype.age = 20;Person.prototype.jbo = 'teacher';Person.prototype.sayName = function(){     alert(this.name);};var person1 = new Person();person1.sayName();

By using a prototype to create an object, all object instances can share its attributes and methods.

If you use the prototype to create an object, see the following code:

Function Person () {} Person. prototype. name = 'nike '; Person. prototype. age = 20; Person. prototype. jbo = 'teacher'; Person. prototype. sayName = function () {alert (this. name) ;}; var person1 = new Person (); var person2 = new Person (); person1.name = 'greg '; alert (person1.name ); // 'greg '-- from instance alert (person2.name); // 'nike' -- from prototype

When an attribute is added to an object instance, the attribute isShieldThe property of the same name saved in the prototype object.

In this case, we can combine the constructor mode with the prototype mode to define instance attributes, and the prototype mode to define methods and shared attributes.

8. constructor mode and prototype mode

function Person(name,age,job){        this.name =name;        this.age = age;        this.job = job;}Person.prototype = {    constructor:Person,    sayName: function(){        alert(this.name);    };}var person1 = new Person('Nike',20,'teacher');

The above are the eight ways I have summarized to create objects. If there is any error, please refer to it.

The above is a summary of the JS methods for object creation. For more information, see other related articles in the first PHP community!

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.