A test and summary of constructor functions

Source: Internet
Author: User

function Circle (RADIUS) {

THIS.R = radius;

This.des = "Round";

This.showinfo = function () {

Alert ("This is a" +this.des);

}

}

function Circle_area (r) {return CIRCLE.PI*THIS.R*THIS.R;}

function Circle_perimeter (r) {return 2*circle.pi*r;}

Circle.pi = 3.14;

Circle.perimeter = Circle_perimeter;

Circle.prototype.area = Circle_area;

var c = new Circle (3);

Test class Properties

Alert (CIRCLE.PI)//3.14

Alert (C.PI)//undefined because the class attribute is associated with the class itself, which is the function itself, and the class instance is not directly related.

Alert (C.CONSTRUCTOR.PI)//3.14 if you want to access a class property through a class instance, you need to first access the instance's constructor to access the Class property

Alert (circle.des)//undefined because the this in the This.des in the function Circle function is not the function itself, but the object that calls R, and can only be an object.

Alert (c.des)//Circular This is now an instantiated object C.

/* Conclusion:

Object-Oriented perspective: A Class property is a direct property of a class object that is not directly related to an instance object built on the class object and cannot be called directly. This class property can be called directly from the class name. Property name. If you want to invoke class properties from an instance object of the class object, you can use the Object instance. The constructor property invokes the object's class object, and then calls its Class property through the class object JavaScript function angle: The Class property is a direct attribute variable of the JavaScript function object (This is called the attribute variable because of the identity of the JavaScript variable and the attribute), and the genus A sex variable is a reference to an object that is constructed from the function object (an object is actually an empty object, and a reference to the associated properties and functions in the constructor and the This keyword inside the function when the constructor is initialized is saved [ The C.prototype and constructors in this. The following related properties, functions]:) have no direct relationship, if you want to call the constructor object's property variable pi through the constructor-generated object C, Then you need to find the constructor object through the C.constructor property and get its property variables through the object.

*/

Test class methods

Alert (Circle.perimeter (3)); 18.4 The class method that calls the function directly.

Alert (C.perimeter (3)); Ff:c.perimeter is not a function IE: Object or property does not support this method. Because the perimeter function is a class method of the Circle class, it is not directly related to the instance object

Alert (C.constructor.perimeter (3));//18.84 invokes the method (function) of the object constructor (class function).

Alert (C.area (3))//28.25 .... The area method under the prototype prototype property of the Circle class will be inherited by the instance object of the Circle class.

Alert (Circle.area (3));//FF: Error: Circle.area is not a function because the area method is a method of the prototype property of the Circle class, not a direct method of the Circle class.

Conclusion: Ibid, the attribute is replaced by a method, and the attribute variable is replaced by a function.

Test prototype Object Properties

alert (C.prototype); Undefined instance object does not have Ptototype property

alert (Circle.prototype); Object Object

Alert (Circle.prototype.constructor)//return Circle function Body (function code body), equivalent to alert (circle)

Alert (Circle.prototype.area (3)); The//nan method call succeeds, but the return result is NaN, because the THIS.R inside the area function is undefined.

Alert (Circle.prototype.PI)//undefined because the PI attribute is a direct property of the Circle class function and does not exist under the prototype property

Alert (Circle.prototype.constructor.PI)//3.14 invokes the constructor (class function) of the prototype object through the prototype object of the Circle class, and then invokes the PI property through the class function.

/* Conclusion: The prototype prototype object is an important attribute of JavaScript based on the prototype linked list implementation.

JavaScript angle: 1. The instance object has no prototype property, only the constructor has the prototype property, which means that the constructor itself holds a reference to the prototype property. 2. The prototype Property object has a constructor property that holds a reference to his own constructor, which looks like a loop: A to b,b points to a ... 3.prototype object (do not be confused by my Property object, object, object property, said to be a Property object, that is, the current thing he is the first property of an object, but also an object. An object property is said to be a property of an object. Property variables and Property objects will be inherited by objects created by the constructor that the prototype object references (function A () {} A.PROTOTYPE.PA = function () {} var oa = new A (); Then OA inherits the property function PA).

*/

/* For object properties, object methods are no longer tested in detail.

In the process of instantiating a 1.javascript object instance through its constructor, a reference to the properties and methods referenced by all the this keywords in the constructor is saved (where the object's direct volume syntax is not discussed here).       However, if the constructor does not specify through this, the object instance will not be able to invoke the method. 2.javascript You can create multiple instances through a constructor that inherits the properties and methods of the prototype object through the __proto__ property. If you read and write the properties and methods of an instance object, it does not affect the properties and methods of its prototype object, that is, the JavaScript instance object is read-only and cannot be written for the prototype object. So when we modify the properties and methods of the instance object, we can change its value. In fact, when we try to use a property or method that inherits from the prototype object in the instance object, JavaScript copies a copy of the property or method in our instance object, so that when we manipulate it, we actually manipulate the instance object's own properties or methods.

*/

Test __proto__ Properties

Alert (c.__proto__)//ff:object ie8:undefined This property points to circle.prototype, which means that calling the object returns the prototype property of the circle.

Because the __proto__ attribute is not supported for IE8 and the following versions, the following results are obtained under FF.

Alert (c.__proto__. PI)//undefined because there is no PI attribute under the function prototype, pi is the direct property of the class function circle

Alert (C.__proto__.area (3))//nan The function succeeds, and the return value is NaN because the THIS.R in the function body is undefined.

/* Conclusion: The __proto__ property holds a reference to the prototype property referenced by the constructor that created the object, that is, the constructor can reference prototype, and the instances generated based on the constructor can also be referenced, except in a different way. */


A test and summary of constructor functions

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.