JavaScript programming design pattern-constructor pattern instance analysis, design pattern instance analysis

Source: Internet
Author: User

JavaScript programming design pattern-constructor pattern instance analysis, design pattern instance analysis

This article describes the constructor mode of the JavaScript programming design mode. We will share this with you for your reference. The details are as follows:

In the classical OOP language, constructor (also called constructor) is a special method used to initialize objects. In JS, object constructors are often mentioned because everything is an object.

The object constructor is used to create an object of the specified type (Class). It is acceptable that parameters are used to initialize the attributes and methods of the object.

Object Creation

In JS, there are three common methods for object creation:

// 1. var newObject = {}; // 2, var newObject = Object. create (null); // 3. var newObject = new Object () is not recommended ();

However, this only creates three empty objects without any attributes and methods. We can use the following four methods to Set Up attributes and methods for objects.

// ECMAScript 3 compatible method // 1. standard Object definition method // sets the attribute newObject. someKey = "Hello World"; // obtain the var key = newObject attribute. someKey; // 2. square brackets // set the attribute newObject ["someKey"] = "Hello World"; // obtain the attribute var key = newObject ["someKey"]; // only used for ECMAScript 5 // 3. object. defineProperty // sets the property Object. defineProperty (newObject, "someKey", {value: "for more control of the property's behavior", writable: true, enumerable: true, retriable: true }); // set var defineProp = function (obj, key, value) {config. value = value; Object. defineProperty (obj, key, config) ;}; // use var person = Object. create (null); defineProp (person, "car", "Delorean"); defineProp (person, "dateOfBirth", "1981"); defineProp (person, "hasBeard ", false); // 4. object. defineProperties // set the property Object. defineProperties (newObject, {"someKey": {value: "Hello World", writable: true}, "anotherKey": {value: "Foo bar", writable: false}); // The methods for obtaining attributes of 3 and 4 are the same as those of 1 and 2.

Basic Constructor

We know that JS does not have the Class concept, but it also supports object creation with constructor.

By using the [new] keyword, we can make a function behave like a constructor to create its own object instance.

The following is a basic constructor:

Function Car (model, year, miles) {// here, this points to the newly created object itself this. model = model; this. year = year; this. miles = miles; this. toString = function () {return this. model + "has done" + this. miles + "miles" ;};}// usage // create two car instances var civic = new Car ("Honda Civic", 2009,200 00 ); var mondeo = new Car ("Ford Mondeo", 2010,500 0); // outputs the result console. log (civic. toString (); console. log (mondeo. toString ());

This is the simple constructor mode, which has two main problems,

First, it is difficult to inherit; second, toString () is defined by every object instance. As a function, it should be shared by every Car type instance.

Use the prototype Constructor

JS has a good feature: Prototype ],

When an object is created, all properties in the constructor prototype can be obtained by the object instance.

In this way, multiple object instances can share the same prototype.

Here is an example of Improving the previous Car:

Function Car (model, year, miles) {this. model = model; this. year = year; this. miles = miles;} Car. prototype. toString = function () {return this. model + "has done" + this. miles + "miles" ;}; // usage var civic = new Car ("Honda Civic", 2009,200 00); var mondeo = new Car ("Ford Mondeo ", 2010,500 0); // output console. log (civic. toString (); console. log (mondeo. toString ());

In the preceding example, the toString () method is shared by multiple Car object instances.

Related Article

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.