simulate classes in javascript

1. As is probably clear, you simulate a class property in JavaScript simply by defining a property of the constructor function itself to store a special 1x1 rectangle, you can do the following:

Rectangle.UNIT = new Rectangle(1,1); 

 


2. To define a class method in JavaScript, simply make the appropriate function a
property of the constructor.

// This class method takes two Circle objects and returns the

// one that has the larger radius.

       Circle.max = function(a,b) { if (a.r > b.r) return a; else return b; }
 

3. private members , you can refer to http://www.crockford.com/javascript/private.html for more info.

example :

function ImmutableRectangle(w, h) {

  // This constructor does not store the width and height properties

  // in the object it initializes. Instead, it simply defines // accessor methods in the object. These   //methods are closures and

// the width and height values are captured in their scope chains.

  this.getWidth = function( ) { return w; }

  this.getHeight = function( ) { return h; }

} 
 


4. JavaScript equality operators compare objects by reference, not by value.

5. Superclasses and Subclasses

// Here is a simple Rectangle class.
// It has a width and height and can compute its own area
function Rectangle(w, h) {
    this.width = w;
    this.height = h;
}
Rectangle.prototype.area = function( ) { return this.width * this.height; }

// Here is how we might subclass it
function PositionedRectangle(x, y, w, h) {
    // First, invoke the superclass constructor on the new object
    // so that it can initialize the width and height.
    // We use the call method so that we invoke the constructor as a
    // method of the object to be initialized.
    // This is called constructor chaining.
    Rectangle.call(this, w, h);

    // Now store the position of the upper-left corner of the rectangle
    this.x = x;
    this.y = y;
}

// If we use the default prototype object that is created when we
// define the PositionedRectangle( ) constructor, we get a subclass of Object.
// To subclass Rectangle, we must explicitly create our prototype object.
PositionedRectangle.prototype = new Rectangle( );

// We create this prototype object for inheritance purposes, but we
// don't actually want to inherit the width and height properties that
// each Rectangle object has, so delete them from the prototype.
delete PositionedRectangle.prototype.width;
delete PositionedRectangle.prototype.height;

// Since the prototype object was created with the Rectangle( ) constructor,
// it has a constructor property that refers to that constructor.  But
// we want PositionedRectangle objects to have a different constructor
// property, so we've got to reassign this default constructor property.
PositionedRectangle.prototype.constructor = PositionedRectangle;

// Now that we've configured the prototype object for our subclass,
// we can add instance methods to it.
PositionedRectangle.prototype.contains = function(x,y) {
    return (x > this.x && x < this.x + this.width &&
            y > this.y && y < this.y + this.height);
}
 



creating a subclass in JavaScript is not as simple as creating a class that
inherits directly from Object. First, there is the issue of invoking the
superclass constructor from the subclass constructor. Take care when you do this
that the superclass constructor is invoked as a method of the newly created
object. Next, there are the tricks required to set the prototype object of the
subclass constructor. You must explicitly create this prototype object as an
instance of the superclass, then explicitly set the constructor property of the
prototype object.[*]Optionally, you may also want to delete any properties that the superclass constructor created in the prototype object because what's important are the properties that the prototype object inherits from its prototype.
guess

print(r instanceof PositionedRectangle &amp;&amp;
      r instanceof Rectangle &amp;&amp;
      r instanceof Object);

 will return what ?

--------------------------------------------------------------

ps: what is prototype ?
In the previous section, I showed that the new
operator creates a new, empty object and then invokes a constructor function as a method of that object. This is not the complete story, however. After creating the empty object, New
sets the prototype of that object. The prototype of an object is the value of the prototype property of
its constructor function. All functions have a prototype property that is automatically created and initialized when the function is defined. The initial value of the prototype property is an object with a single property. This property is named constructor and refers back to the constructor function with which the prototype is associated. (You may recall the constructor property from Chapter 7 ; this is why every object has a constructor property.) Any properties you add to this prototype object will appear to be properties of objects initialized by the constructor.

 

 

Constructor Chaining

In the example just shown, the PositionedRectangle( ) constructor function needed to explicitly invoke the superclass constructor function. This is called constructor chaining and is quite common when creating subclasses. You can simplify the syntax for constructor chaining by adding a property named superclass to the prototype object of the subclass:

// Store a reference to our superclass constructor.
PositionedRectangle.prototype.superclass = Rectangle;
 

With this property defined, the syntax for constructor chaining is simpler:

function PositionedRectangle(x, y, w, h) {
    this.superclass(w,h);
    this.x = x;
    this.y = y;
}
 

 

Note that the superclass constructor function is explicitly invoked through the this object. This means that you no longer need to use call( ) or apply( ) to invoke the superclass constructor as a method of that object.

 

more about superclass

more

 

 

6. Extending Without Inheriting

 JavaScript is such a flexible language that subclassing and inheritance is not the only way to extend a class.

 

 

 

 

 

 

 

 

你可能感兴趣的:(JavaScript)