Several ways to create objects in JavaScript

Objective:

With the advent of Web 2.0 (the most representative of Ajax Technology), JavaScript is no longer the "toy language" programmers see. programming is constantly simplifying, but the "user experience, performance, compatibility, scalability ..." Requirements are constantly improving, followed by the emergence of prototype, JQuery, ExtJs, Dojo and other excellent framework (class library), greatly simplifying web development.

More and more people are beginning to delve into and use JavaScript, and of course, the requirements of the enterprise to the developer are more and more high. In terms of their own experience, Zhougi years, I can use JavaScript to write some page UI effects, to do the site's form verification, and so on, I feel already very cool. But now, if even XMLHttpRequest, JSON is not aware of anything, even JavaScript in object-oriented/object-based programming do not understand, but also dare to call yourself a good web programmer. (attention to cutting-edge technology friends, must understand Node.js, MongoDB, this is inseparable from JavaScript.) ）

The flexibility of JavaScript makes people love and hate. A typical introduction is simple and difficult to master. Understanding JavaScript oop/object-based Programming is a watershed in judging the level of programmer JavaScript. JavaScript is based on object programming, the most basic is "create object", often make many familiar with other language-oriented (Java, C #, C + +) programmers feel indefinitely or difficult to adapt. So, this article will first introduce you tosome of the common ways to create objects in JavaScript.

     

1. Creation of a simple object using the literal amount of the object {} Create an object (simplest, well understood, recommended for use)

var Cat  = {};//json
 cat.name= "kity";//Add attribute and assign value
 cat.age=2;
 Cat.sayhello=function () {
  alert ("Hello" +cat.name+ ", this year" +cat["age"]+ "old");//You can use the "." Way to access the property, or you can access the Cat.sayhello () by using the HashMap method (), or the
 (method) function of the calling object.

2. Use function (functions) to simulate class (parameterless constructor)

2.1 Create an object that is equivalent to a new instance of a class

   

The function person () {

}
var personone=new person ()//defines a function, and if there is a new keyword to "instantiate", then the function can be considered a class
Personone.name= "Dylan";
personone.hobby= "coding";
Personone.work=function () {
alert (personone.name+ "is coding now ...");
}

Personone.work ();

2.2 can be implemented using a parameter constructor, which is easier to define and more scalable (recommended)

  

function Pet (name,age,hobby) {
   this.name=name;//this scope: current object
   this.age=age;
   This.hobby=hobby;
   This.eat=function () {
      alert ("My name is +this.name+", I Like "+this.hobby+", also a cargo ")"
   ;
}
var Maidou =new Pet ("McDull", 5, "sleep")//Instantiate/Create Object

 maidou.eat ()//Call Eat method (function)

3. Use the Factory method to create (object keyword)

 

var wcdog =new Object ();
 Wcdog.name= "Flourishing wealth";
 wcdog.age=3;
 Wcdog.work=function () {
   alert ("I am +wcdog.name+", Wang Woo ...);
 }

 Wcdog.work ();

4. Prototype keywords in the way of using a prototype object

function Dog () {
 
 }
 dog.prototype.name= "flourishing wealth";
 Dog.prototype.eat=function () {
 alert (this.name+ "is a cargo");
 }
 var wangcai =new Dog ();
 Wangcai.eat ();

5. Blending modes (prototypes and constructors)

function car (name,price) {
  this.name=name;
  This.price=price; 
}
 Car.prototype.sell=function () {
   alert ("I am +this.name+", I now sell "+this.price+ million");
  }

var camry =new car ("Camry", 27);

6. The way of dynamic prototyping (can be considered as a special case of mixed mode)

function car (name,price) {
  this.name=name;
  This.price=price; 
  if (typeof car.sell== "undefined") {
   car.prototype.sell=function () {
    alert ("I Am" +this.name+ ", I now sell" + This.price+ "million");
   }
 Car.sell=true
  }
}

var camry =new car ("Camry",);
Camry.sell ();

These are some of the most common ways to create objects in JavaScript . When the novice sees it, it may faint and even feel worried. In fact, there is no need to worry, these kinds of methods, only to master one or two kinds of other kinds of only need to understand the good. This is the flexibility of JavaScript. each way must have its advantages and disadvantages, so there is no fixed recommendation , Choose the easiest way to understand and master. Besides, everyone's code style may be different. In the future you may need to study the jquery source code, or refer to other plug-ins to rewrite, to develop their own plug-ins, all need to understand other people's coding style. And these class libraries, Plug-ins, are based on object-oriented/object-based.

Well, here's the first article. Due to the author's ability to express and technical level is really limited, it is inevitable that there is deviation, hope the reader understanding.

This article originates from http://blog.csdn.net/dinglang_2009, reprint please indicate the source.