Javascript prototypes and Inheritance (prototypes and inheritance) _javascript tips

Source: Internet
Author: User
JavaScript objects inherit properties from a prototype object (prototype objects). All objects have prototypes; All the properties of the prototype look like the properties of those objects that use it as a prototype. To put it simply: All objects inherit properties from his prototype.。
(Each object inherits properties from its prototype).

The prototype of an object is defined by its constructor function. All function in JavaScript has a prototype attribute. This property begins empty, and any attributes you add to him will be owned by the object created by constructor.

The prototype object is associated with the constructor. This means that prototype can be an ideal place for placement methods and other constants. The attributes in the prototype are not copied to the newly created object, and their properties look like the properties of the object. This means that the use of prototypes can significantly reduce the memory occupied by multiple objects of the same kind.

Each class has only one prototype object, which comes with a set of attributes. But we might create instances of multiple classes at run time. So what happens if you read and write to the properties of the stereotype?
When you read a property, JavaScript first tries to find out if the object itself has this attribute, and if not, then find out if it is in the prototype. Some words will return the result.
When you write the attributes of a prototype, because multiple objects share a prototype, it is obvious that you cannot write directly on the prototype. At this point, JavaScript actually creates an attribute with the same name on the object, and then writes the value to it. The next time you read this attribute, JavaScript is suddenly found in the object's properties, so you don't need to look it up in the prototype. At this point, we say that "object attributes conceal or hide the properties of the stereotype." (Shadows or hides).

As we can see from the above discussion, in fact, when we design the class, we should master one principle:Only some methods are defined in the prototype (methods are generally immutable), constants, constants, etc.It is not easy to confuse this.
Example:

--> -->//Define a constructor to our class.
--> -->//Use it to initialize properties that'll be different for
--> -->//Each individual Circle object.
--> -->functionCircle (x, Y, R)
--> -->{
--> -->This. x=X//The x-coordinate of the center of the circle
--> -->
This. Y=Y//The y-coordinate of the center of the circle
--> -->
This. R=R//The radius of the circle
--> -->}
--> -->
--> -->
--> -->//Create and discard an initial Circle object.
--> -->//This IS forces the prototype object to be created in JavaScript 1.1.
--> -->NewCircle (0,0,0);
--> -->
--> -->
--> -->//Define a constant:a property that would be shared by
--> -->//All Circle objects. Actually, we could just use Math.PI,
--> -->//But we do it is way for the sake of instruction.
--> -->Circle.prototype.pi=
3.14159;
--> -->
--> -->
--> -->//Define A to compute the circumference of the circle.
--> -->//The declare a function, then assign it to a prototype property.
--> -->//The use of the constant defined above.
--> -->functionCircle_circumference () {Return
2
*
This. Pi*
This. R; }
--> -->Circle.prototype.circumference=Circle_circumference;
--> -->
--> -->
--> -->//Define another method. This time we use a function literal to define
--> -->//The function and assign it to a prototype all in one step.
--> -->Circle.prototype.area=
function(  ) {Return
This. Pi*
This. R*
This. R; }
--> -->
--> -->
--> -->//The Circle class is defined.
--> -->//Now we can create a instance and invoke its methods.
--> -->VarC=
NewCircle (0.0,0.0,1.0);
--> -->VarA=C.area ();
--> -->VarP=C.circumference ();


The prototype of the built-in class.

Not only are user-defined classes can have prototype. The system has built-in analogies such as String, and Date is also available. And you can add new methods, attributes, etc. to them.
The following code adds a useful function to all String objects:

--> -->//Returns true if the last character is C
--> -->String.prototype.endsWith=
function(c) {
--> -->Return(c = =
this . CharAt ( this . Length - 1 ))
!--img--> !--gmi-->}


Then we can call it like this:

!--img-->!--gmi-->var message =
" Hello World " ;
!--img-->!--gmi-->message.endswith (' h ')   // Returns false
!--img--> !--Gmi-->message.end Swith (' d ')    // Returns true!--v:2.3--> span>
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.