Methods for creating objects in javascript _ javascript skills

The following are the most common methods for creating objects in javascript. After reading this information, a beginner may feel dizzy or even worried. In fact, there is no need to worry about these methods. You only need to master one or two methods. You only need to understand the other methods. Preface:

With the rise of web 2.0 (Ajax technology is the most representative), javascript is no longer a "Toy language" in the eyes of programmers ". Programming is constantly simplified, but "user experience, performance, compatibility, scalability ...... the requirement is constantly improving, and Prototype, jQuery, ExtJs, Dojo and other excellent frameworks (class libraries) emerge, greatly simplifying web development.

More and more people begin to study and use javascript. Of course, enterprises have higher and higher requirements on developers. Taking my own experience as an example, in less than a few years, I was able to use javascript to write some page UI effects and perform website form verification and other operations. At that time, I thought it was already cool. But now, if I don't even know what XMLHttpRequest and JSON are, and I don't even know object-oriented/Object-based programming in javascript, Do I dare to call myself a good web programmer? (If you are interested in cutting-edge technologies, you must be familiar with node. js and MongoDB, which cannot be separated from javascript .)

The flexibility of javascript makes people love and hate it. The typical introduction is simple and difficult to master. Understanding javascript OOP/Object-based programming is a watershed in determining the javascript level of programmers. In object-based javascript programming, the most basic thing is to "create an object", which often familiarizes many users with other languages (Java, C #, C ++) programmers may find it difficult to understand or adapt. Therefore, this article will first introduce several common methods for creating objects in javascript.

1. Create a simple objectCreate an object using the object literal {} (simplest, easy to understand, recommended)

The Code is as follows:

Var Cat ={}; // JSON
Cat. name = "kity"; // Add attributes and assign values
Cat. age = 2;
Cat. sayHello = function (){
Alert ("hello" + Cat. name + ", this year" + Cat ["age"] + "years old"); // you can use ". you can also use HashMap to access attributes.
}
Cat. sayHello (); // call the (method) function of the object

2. Use function to simulate class (non-argument constructor)

2.1 create an object, which is equivalent to an instance of a new class

The Code is as follows:

Function Person (){

}
Var personOne = new Person (); // defines a function. If a new keyword is used to "instantiate", the function can be considered as a class.
PersonOne. name = "dylan ";
PersonOne. holobby = "coding ";
PersonOne. work = function (){
Alert (personOne. name + "is coding now ...");
}

PersonOne. work ();

2.2 you can use the constructor with parameters to implement this function. This makes definition more convenient and more scalable (recommended)

The Code is as follows:

Function Pet (name, age, holobby ){
This. name = name; // this scope: Current object
This. age = age;
This. holobby = holobby;
This. eat = function (){
Alert ("My name is" + this. name + ", I like" + this. holobby + ", also a fool ");
}
}
Var maidou = new Pet ("McDull", 5, "sleeping"); // instantiate/create an object

Maidou. eat (); // call the eat method (function)

3. Use the factory method to create (Object keyword)

The Code is as follows:

Var wcDog = new Object ();
WcDog. name = "wangcai ";
WcDog. age = 3;
WcDog. work = function (){
Alert ("I am" + wcDog. name + ", Wang Wangwang ......");
}

WcDog. work ();

4. Use the prototype keyword of the prototype object

The Code is as follows:

Function Dog (){

}
Dog. prototype. name = "wangcai ";
Dog. prototype. eat = function (){
Alert (this. name + "is a fool ");
}
Var wangcai = new Dog ();
Wangcai. eat ();

5. hybrid mode (prototype and constructor)

The Code is as follows:

Function Car (name, price ){
This. name = name;
This. price = price;
}
Car. prototype. Role = function (){
Alert ("I am" + this. name + ", I am selling now" + this. price + "");
}

Var camry = new Car ("camry", 27 );
Camry. Sort ();

6. Dynamic Prototype (it can be seen as a special case of hybrid mode)

The Code is as follows:

Function Car (name, price ){
This. name = name;
This. price = price;
If (typeof Car. Attributes = "undefined "){
Car. prototype. Role = function (){
Alert ("I am" + this. name + ", I am selling now" + this. price + "");
}
Car. Hour = true;
}
}

Var camry = new Car ("camry", 27 );
Camry. Sort ();

The above are the most common methods for creating objects in javascript. After reading this information, a beginner may feel dizzy or even worried. In fact, there is no need to worry about these methods. You only need to master one or two methods. You only need to understand the other methods. This is the flexibility of javascript. Each method must have its own advantages and disadvantages, so there is no fixed recommendation, you can choose the most easy to understand and master. Furthermore, the Code style may vary. In the future, you may need to study the jQuery source code, or refer to other plug-ins to rewrite and develop your own plug-ins. You need to understand others' code styles. These class libraries and plug-ins are built on the object-oriented/Object-based basis.