Several methods for creating objects in JS

Source: Internet
Author: User

Recently I am reading JavaScript advancedProgramDesign, specifically elaborate on the creation of objects, and sum up (JE Knowledge Base JavaScript column from this tutorial, interested can go to the knowledge base to see)

First mode: factory mode JS Code
  1. VaREv =Function(){
  2. Return "Ah Pai";
  3. };
  4. FunctionParent (){
  5. VaRChild =NewObject ();
  6. Child. Name ="Bruce Lee";
  7. Child. Age ="30";
  8. Child. lev= lev;
  9. ReturnChild;
  10. };
  11. VaRX = parent ();
  12. Alert (X. Name );
  13. Alert (X. lev ());

Note:

1. define an object in a function and define various attributes of the object. Although the attribute can be a method, we recommend that you define the attribute as a method outside the function to avoid repeated creation of this method.

2. when referencing this object, we use VaR x = parent () instead of VaR x = new parent (); because the latter may have many problems (the former has become a classic factory method, and the latter is called a hybrid factory method), we do not recommend using the new method to use this object.

3. This object is returned at the end of the function.

4. This method is not recommended for object creation, but you should understand

Mode 2: constructor JS Code
  1. VaREv =Function(){
  2. Return "Ah Pai";
  3. };
  4. FunctionParent (){
  5. This. Name ="Bruce Lee";
  6. This. Age ="30";
  7. This. Lev= lev;
  8. };
  9. VaRX =NewParent ();
  10. Alert (X. Name );
  11. Alert (X. lev ());

Note:

1. Compared with the factory method, the constructor method is used to create an object, and the function does not need to re-create the object inside the function. This is used to refer to the object, and the function does not need to explicitly return

2. Like the factory mode, although the attribute value can be a method, we recommend that you define this method outside the function.

3. Similarly, it is not recommended to use this method to create objects, but you still need to know

3rd modes: prototype mode JS Code
  1. VaREv =Function(){
  2. Return "Ah Pai";
  3. };
  4. FunctionParent (){
  5. };
  6. Parent. Prototype. Name ="Bruce Lee";
  7. Parent. Prototype. Age ="30";
  8. Parent. Prototype. lev= lev;
  9. VaRX =NewParent ();
  10. Alert (X. Name );
  11. Alert (X. lev ());

Note:

1. attributes are not defined in the function.

2. Define attributes using the prototype attribute

3. Similarly, we do not recommend using this method to create objects.

Fourth mode: Mixed constructor, prototype (recommended) JS Code
  1. FunctionParent (){
  2. This. Name ="Bruce Lee";
  3.  This. Age = 32;
  4. };
  5. Parent. Prototype. lev=Function(){
  6. Return This. Name;
  7. };;
  8. VaRX =NewParent ();
  9. Alert (X. lev ());

Note: 1. This mode refers to the combination of constructor and prototype.

2. Define all attributes that are not methods in the function (constructor Mode)

Define all attributes whose property values are method attributes outside the function using prototype (prototype)

3.We recommend that you create an object in this way,It is advantageous to do so and why not use the constructor and prototype separately. Due to space issues, we will not discuss them here.

Fifth mode: Dynamic Prototype JS Code
  1. FunctionParent (){
  2. This. Name ="Bruce Lee";
  3.  This. Age = 32;
  4. ;
  5.  If(TypeofParent. _ lev= ="Undefined"){
  6. Parent. Prototype. lev=Function(){
  7. Return This. Name;
  8. }
  9. Parent. _ lev=True;
  10. }
  11. };
  12. VaRX =NewParent ();
  13. Alert (X. lev ());

Note:

1. The dynamic prototype can be understood as a hybrid constructor. A special case of the prototype

2. In this mode, the property for the method is directly defined in the function, but because

JS Code
    1. If(TypeofParent. _ lev= ="Undefined"){
    2. Parent. _ lev=True;}

 
This ensures that the attribute method will not be created repeatedly when the instance of this object is created.

3. This mode is recommended.

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.