Several methods for creating objects in Javascript

Address: http://www.cnblogs.com/dinglang/archive/2012/09/04/2670776.html

 

 

Preface:

With the rise of Web 2.0 (the most representative isAjaxTechnology), JavaScript is no longerProgram"Toy language" in employee's eyes ".Programming is constantly simplified, but the requirements for "user experience, performance, compatibility, scalability..." are constantly improving,The emergence of prototype, jquery, extjs, dojo and other excellent frameworks (class libraries), 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, ifXMLHttpRequest, JSONI don't know anything, even in JavascriptObject-oriented/Object-basedI don't know much about programming. Do you dare to say that you are 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 to judge programmersJavascript horizontal watershed. WhileIn object-based JavaScript programming, the most basic thing is to "create an object", which often makes many people familiar with other languages (Java, C #, C ++. Therefore, this article will first introduce you,Common methods for creating objects in JavaScript.

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

 
VaRCat = {};//JSONCat. Name = "kity ";//Add attributes and assign valuesCat. Age = 2; CAT. sayhello =Function() {Alert ("hello" + cat. Name + ", this year" + cat ["Age"] + "years old ");//You can use "." Or hashmap to access attributes.} Cat. sayhello ();//Call the (method) function of an 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

FunctionPerson (){}VaRPersonone =NewPerson ();//Defines a function. If a new keyword is used to "instantiate" a function, 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)

FunctionPET (name, age, holobby ){This. Name = Name;//This scope: Current objectThis. Age = age;This. Holobby = holobby;This. Eat =Function() {Alert ("My name is" +This. Name + ", I like" +This. Holobby + ", also a fool ");}}VaRMaidou =NewPET ("McDull", 5, "sleeping ");//Instantiate/create an objectMaidou. Eat ();//Call the Eat method (function)
 

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

VaRWcdog =NewObject (); 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

 
FunctionDog () {} dog. Prototype. Name = "wangcai"; dog. Prototype. Eat =Function() {Alert (This. Name + "is a fool ");}VaRWangcai =NewDog (); wangcai. Eat ();
 

5. hybrid mode (prototype and constructor)

FunctionCar (name, price ){This. Name = Name;This. Price = price;} car. Prototype. Cost =Function() {Alert ("I am" +This. Name + ", I am selling now" +This. Price + "CNY ");}VaRCamry =NewCar ("Camry", 27); Camry. Routing ();
 

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

  function  Car (name, price) { This . name = Name;  This . price = price;  If  ( typeof  Car. vehicle = "undefined") {car. prototype. functions =  function  () {alert ("I am" +  This . name + ", I am selling now" +  This . price + "CNY");} car. required =  true ;}< span style = "color: # 0000ff "> var  Camry =  New  Car (" Camry ", 27); Camry. begin (); 

Which of the above areJavascriptThe most common method for creating objects. 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 exactlyThe flexibility of JavaScript.No fixed Recommendation Method,Select the easiest way to understand and master. Everyone'sCodeThe style may be different. 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 all built on the object-oriented/Object-based basis.

Now, this article will introduce you here first. The author's ability to express and technical skills are indeed limited, and it is inevitable that there will be deviations. Please forgive me!