JavaScript classes and modules (i)

1. a prototype object is a unique identifier for a class : when and only two objects inherit from the same prototype object, they are instances of the same class. The constructor that initializes the state of the object cannot be identified as the class, and the prototype property of the two constructors may point to the same prototype object. Then the two constructors create instances that belong to the same class.

2. a typical object-oriented JS program:

Functionrange (from,to) {

This.from=from;

This.to=to;

}

range.prototype={

Includes:function (x) {

Return this.from<=x&&x<=this.to;

},

Foreach:function (f) {

For (Varx=math.ceil (this.from); x<this.to;x++) {

F.log (x);

}

},

Tostring:function () {

Return "(" +this.from+ "..." +this.to+ ")";

}

}

Use Cases

var r=new Range (1,3);

Console.log (R.includes (2));

R.foreach (console);

Console.log (R.tostring ());

1. Code specification: Class (constructor) uppercase first letter, (normal) method first letter lowercase

2. In fact , the instanceof operator does not check if R is from the Range() constructor, and it checks whether it inherits from Range.prototype. However,the instanceof syntax reinforces the notion that a constructor is the public identity of a class.

3. Constructor Properties: instance,

Varf=function () {

}

varp=f.prototype;// This is a prototype object associated with F

var c=p.constructor;// This is the function associated with the prototype

Console.log (P);// The prototype of the function is the object object{}

Console.log (c); the constructor of the//p is the constructor function () {}

you can see that there are pre-defined constructor properties in the constructor's prototype , which means that the constructor that the object typically inherits refer to their constructors. Because the constructor is a "public identity," this constructor property provides classes for the object.

var o=new F (); Create An object of class F

the O.constructor===f;//true,constructor attribute refers to this class

The relationships between constructors and prototype objects are as follows:

650) this.width=650; "src=" http://s3.51cto.com/wyfs02/M01/4D/14/wKioL1RKY_agOF9XAAChuvOZwLU928.jpg "style=" float: none; "Title=" 1 (1). png "alt=" wkiol1rky_agof9xaachuvozwlu928.jpg "/>

It is important to note that the Range class defined in 2 overrides the predefined Range.prototype object using one of its own objects . This newly defined prototype object does not contain the constructor attribute. such as:

650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M01/4D/13/wKiom1RKY6ahY7iMAAGtb3yXH-I011.jpg "title=" 1 (2). PNG "style=" Float:none; "alt=" wkiom1rky6ahy7imaagtb3yxh-i011.jpg "/>

650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M02/4D/14/wKioL1RKY_bhyt0cAAHT2E2YdNY619.jpg "title=" 1 (3). PNG "style=" Float:none; "alt=" wkiol1rky_bhyt0caaht2e2ydny619.jpg "/>

so instances of the Range class also do not contain the constructor property. We can fix this problem by correcting it and showing the prototype a constructor to add.

range.prototype={

Constructor:range,

Includes:function (x) {

returnthis.from<=x&&x<=this.to;

},

Foreach:function (f) {

For (Varx=math.ceil (this.from); x<this.to;x++) {

F.log (x);

}

},

Tostring:function () {

Return "(" +this.from+ "..." +this.to+ ")";

}

}

Another common workaround is to use a predefined prototype object, a predefined prototype object that contains the constructor property, and then add a method to the prototype object in turn

Range.prototype.includes=function (x) {returnthis.from<=x&&x<=this.to;};

Range.prototype.foreach=function (f) {for (Var x=math.ceil (this.from); x<this.to;x++) {f.log (x);};

Range.prototype.tostring=function () {return "(" +this.from+ "..." +this.to+ ")";};

1. class inheritance in Javascript: constructor Object , any property added to this constructor object is a class field and a class method (if the property value is a function is a class method); The prototype object, the properties of the prototype object are inherited by all instances of the class , if the property value of the prototype object is a function, the function is called as an instance of the class, the instance object , each instance of the class is a separate object, and the attributes defined directly to the instance are not shared for all instance objects. A non-function attribute that is defined on an instance is actually a field of an instance.

2. the steps for defining a class in JavaScript can be reduced to three steps:1) define a constructor first, and set the instance properties of the new object to initialize. 2) define the instance methodfor the Prototy object ofthe constructor , 3) Define the class field and the class property for the constructor, and the following is a JS that simulates the definition of a class in Java Code:

/**

* The constructor of the complex number, which defines the instance fields R and I for each instance that it creates

* @param {[type]} real [ real ]

* @param {[type]} imaginary [ imaginary part ]

*/

Functioncomplex (real,imaginary) {

if (IsNaN (real) | | IsNaN (imaginary)) {

throw new TypeError (' incoming parameter type Error! ');

}

This.r=real;

This.i=imaginary;

}

/**

* Complex addition, the instance method of the class is defined as the function Value property of the prototype object

* The methods defined here can be inherited by all instances and provide them with shared behavior

* It is important to note thatthe instantiation method of Javascript must use the keyword this to access the fields of the instance

* @param {[type]} C [description]

*/

Complex.prototype.add=function (c) {

return new Complex (THIS.R+C.R,THIS.I+C.I);

}

This defines some of the class fields that are useful for complex operations .

Complex.zero=new Complex (0,0);

8. Code Specification:1 ) A member named in capital letters cannot be modified;2 names that are prefixed by the underscore are not visible outside the class

The prototype-based inheritance mechanism in 9.Javascript is dynamic: Objects inherit properties from their prototypes, and if the properties of the prototype are changed after the object is created, all instance objects that inherit the prototype will also be affected.

This article is from "Tiger Brother's Blog" blog, please be sure to keep this source http://7613577.blog.51cto.com/7603577/1567787

JavaScript classes and modules (i)