javascript权威指南笔记（第9章 类和模块）

1、工厂函数

function range(from, to) {
    var r = inherit(range.methods);
    r.from = from;
    r.to = to;

    return r;
};


range.methods = {

    includes: function (x) {
        return this.from <= x && x <= this.to;
    },

    foreach: function (f) {
        for (var x = Math.ceil(this.from); x <= this.to; x++) f(x);
    },
    toString: function () {
        return "(" + this.from + "..." + this.to + ")";
    }
}
// Here are example uses of a range object.
var r = range(1, 3);                    // Create a range object
r.includes(2);                            // => true: 2 is in the range
r.foreach(console.log);                // Prints 1 2 3
console.log(r);                  // Prints (1...3)

 2、使用构造函数代替工厂函数： 注意调用时必须使用new操作符

function Range(from, to) {
    this.from = from;
    this.to = to;
}

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

    foreach: function (f) {
        for (var x = Math.ceil(this.from); x <= this.to; x++) f(x);
    },
    toString: function () {
        return "(" + this.from + "..." + this.to + ")";
    } };
// Here are example uses of a range object
var r = new Range(1, 3);            // Create a range object
r.includes(2);                        // => true: 2 is in the range
r.foreach(console.log);              // Prints 1 2 3
console.log(r);                     // Prints (1...3)

3、constructor属性

var F = function() {};             // This is a function object.
var p = F.prototype;            // This is the prototype object associated with it.
var c = p.constructor;         // This is the function associated with the prototype.
c === F;                      // => true: F.prototype.constructor==F for any function
var o = new F();              // Create an object o of class F
o.constructor === F;          // => true: the constructor property specifies the class

4、比较下面两段代码的不同：都是原型方式，虽然可以保证

Range.prototype = {
    constructor: Range,       // Explicitly set the constructor back-reference
    includes: function (x) {
        return this.from <= x && x <= this.to;
    },
    foreach: function (f) {
        for (var x = Math.ceil(this.from); x <= this.to; x++) f(x);
    },
    toString: function () {
        return "(" + this.from + "..." + this.to + ")";
    }
};

/*预定义原型对象，这个原型对象包括constructor属性*/
Range.prototype.includes = function (x) {
    return this.from <= x && x <= this.to;
};
Range.prototype.foreach = function (f) {
    for (var x = Math.ceil(this.from); x <= this.to; x++) f(x);
};
Range.prototype.toString = function () {
    r

5、javascript中的java式继承：结合6来分析

　　一个用于定义简单类的函数并用其定义前面的Range类：

　　

function defineClass(constructor,    // A function that sets instance properties
                     methods,        // Instance methods: copied to prototype
                     statics)        // Class properties: copied to constructor
{
    if (methods) extend(constructor.prototype, methods);
    if (statics) extend(constructor, statics);
    return constructor;
}
// This is a simple variant of our Range class
var SimpleRange =
    defineClass(function (f, t) {
            this.f = f;
            this.t = t;
        }, {
            includes: function (x) {
                return this.f <= x && x <= this.t;
            },
            toString: function () {
                return this.f + "..." + this.t;
            } },
        { upto: function (t) {
            return new SimpleRange(0, t);
        } });

6、Complex.js:

注意区分：java(实例字段、实例方法、类字段、类方法)  

　　　  　javascript(构造函数对象、原型对象、实例对象)

/**********************************构造函数*/
function Complex(real, imaginary) {
    if (isNaN(real) || isNaN(imaginary)) // Ensure that both args are numbers.
        throw new TypeError();           // Throw an error if they are not.
    this.r = real;                       // The real part of the complex number.
    this.i = imaginary;                  // The imaginary part of the number.
}

/*********************实例方法*/
// Add a complex number to this one and return the sum in a new object.
Complex.prototype.add = function (that) {
    return new Complex(this.r + that.r, this.i + that.i);
};
// Multiply this complex number by another and return the product.
Complex.prototype.mul = function (that) {
    return new Complex(this.r * that.r - this.i * that.i,
            this.r * that.i + this.i * that.r);
};
// Return the real magnitude of a complex number. This is defined
// as its distance from the origin (0,0) of the complex plane.
Complex.prototype.mag = function () {
    return Math.sqrt(this.r * this.r + this.i * this.i);
};

// Return a complex number that is the negative of this one.
Complex.prototype.neg = function () {
    return new Complex(-this.r, -this.i);
};

// Convert a Complex object to a string in a useful way.
Complex.prototype.toString = function () {
    return "{" + this.r + "," + this.i + "}";
};

// Test whether this Complex object has the same value as another.
Complex.prototype.equals = function (that) {
    return that != null &&                      // must be defined and non-null
        that.constructor === Complex &&         // and an instance of Complex
        this.r === that.r && this.i === that.i; // and have the same values.
};

/*类字段*/
// Here are some class fields that hold useful predefined complex numbers.
// Their names are uppercase to indicate that they are constants.
// (In ECMAScript 5, we could actually make these properties read-only.)
Complex.ZERO = new Complex(0, 0);
Complex.ONE = new Complex(1, 0);
Complex.I = new Complex(0, 1);

/*类方法*/
// This class method parses a string in the format returned by the toString
// instance method and returns a Complex object or throws a TypeError.
Complex.parse = function (s) {
    try {          // Assume that the parsing will succeed
        var m = Complex._format.exec(s);  // Regular expression magic
        return new Complex(parseFloat(m[1]), parseFloat(m[2]));
    } catch (x) {  // And throw an exception if it fails
        throw new TypeError("Can't parse '" + s + "' as a complex number.");
    }
};
/*私有字段*
// A "private" class field used in Complex.parse() above.
// The underscore in its name indicates that it is intended for internal
// use and should not be considered part of the public API of this class. 
// 下划线表示内部类使用的函数，不属于API的部分

Complex._format = /^{([^,]+),([^}]+)}$/;

利用上面定义的complex.js

var c = new Complex(2, 3);  // Create a new object with the constructor 
var d = new Complex(c.i, c.r);   // Use instance properties of c 
c.add(d).toString();        // => "{5,5}": use instance methods
// A more complex expression that uses a class method and field 
Complex.parse(c.toString())     // Convert c to a string and back again,
    .add(c.neg())           // add its negative to it, 
    .equals(Complex.ZERO)  // and it will always equal zero

7、javascript可以模拟出java式的类，但是也有一些不能模拟出以及一些区别及解决方案（……………………）

8、类的扩充：

　　

//给ES3中的函数类添加bind方法
if (!Function.prototype.bind) {
    Function.prototype.bind = function (o /*, args */) {
        // Code for the bind method goes here... };
    }
}

var n = 3;
n.times(function (n) {
    console.log(n + " hello");
});
//下面分别给Number，string/function等添加方法或属性
Number.prototype.times = function (f, context) {
    var n = Number(this);
    for (var i = 0; i < n; i++) f.call(context, i);
};

String.prototype.trim = String.prototype.trim || function () {
    if (!this) return this;  // Don't alter the empty string
    return this.replace(/^s+|s+$/g, "");  // Regular expression magic
};

Function.prototype.getName = function () {
    return this.name || this.toString().match(/functions*([^(]*)(/)[1];
};

Es3之前添加的这些方法设置为不可枚举的，Es5中可以使用Object.defineProperty设置

在很多浏览器中，可以给HTMLElement.prototype添加方法，但是ie不可以，这导致了很多实用就严重限制

9、类和类型

1、instanceof/isprototypeof

　 缺点：1、无法对象获取类名、只能检测

　　　　2、多窗口和多框架的子页面不兼容

2、contructor属性：

同样，在多个执行上下文无法工作

        function typeAndValue(x) {
            if (x == null) return "";
            switch (x.constructor) {
                case Number:return "Number:" + x;
                case String:return "String: '" + x + "'";
                case Date:return "Date: " + x;
                case RegExp:return "Regexp: " + x;
                case Complex:return "Complex: " + x;
            }
        }

3、构造函数的名称

function type(o) {
    var t, c, n;  // type, class, name
// Special case for the null value:
    if (o === null) return "null";
// Another special case: NaN is the only value not equal to itself:
    if (o !== o) return "nan";
// Use typeof for any value other than "object".
// This identifies any primitive value and also functions.
    if ((t = typeof o) !== "object") return t;
// Return the class of the object unless it is "Object".
// This will identify most native objects.
    if ((c = classof(o)) !== "Object") return c;
// Return the object's constructor name, if it has one
    if (o.constructor && typeof o.constructor === "function" && (n = o.constructor.getName())) return n;
// We can't determine a more specific type, so return "Object"
    return "Object";
}


// Return the class of an object.
function classof(o) {
    return Object.prototype.toString.call(o).slice(8, -1);
};
// Return the name of a function (may be "") or null for nonfunctions
Function.prototype.getName = function () {
    if ("name" in this) return this.name;
    return this.name = this.toString().match(/functions*([^(]*)(/)[1];
};

注意：并不是所有的对象都有contructor属性，也并不是所有的函数都有名字如

// This constructor has no name
var Complex = function (x, y) {
    this.r = x;
    this.i = y;
}
// This constructor does have a name
var Range = function Range(f, t) {
    this.from = f;
    this.to = t;
}

4、鸭式辩型

//检测一个对象（第一个参数o）是否实现了剩余参数所表示的方法

但是不能应用于内置类：

如quacks(o,Array)不能用来检测o是否实现了Array中的所有同名的方法，因为内置类的方法都是不可枚举的

/*Example 9-5. A function for duck-type checking*/
// Return true if o implements the methods specified by the remaining args.
function quacks(o /*, ... */) {
    for (var i = 1; i < arguments.length; i++) {   // for each argument after o
        var arg = arguments[i];
        switch (typeof arg) { // If arg is a:
            case 'string':  // string: check for a method with that name
                if (typeof o[arg] !== "function") return false;
                continue;
            case 'function':  // function: use the prototype object instead
// If the argument is a function, we use its prototype object
                arg = arg.prototype;
// fall through to the next case
            case 'object':  // object: check for matching methods
                for (var m in arg) { // For each property of the object
                    if (typeof arg[m] !== "function") continue; //  skip non-methods
                    if (typeof o[m] !== "function")
                        return false;
                }
        }
    }
// If we're still here, then o implements everything
    return true;
}

10 、javascript的面向对象技术：

1、集合类

function Set() {          // This is the constructor
    this.values = {};     // The properties of this object hold the set
    this.n = 0;           // How many values are in the set
    this.add.apply(this, arguments);  // All arguments are values to add
}

// Add each of the arguments to the set.
Set.prototype.add = function () {
    for (var i = 0; i < arguments.length; i++) {  // For each argument
        var val = arguments[i];                  // The value to add to the set
        var str = Set._v2s(val);                 // Transform it to a string
        if (!this.values.hasOwnProperty(str)) {  // If not already in the set
            this.values[str] = val;              // Map string to value
            this.n++;                            // Increase set size
        }
    }
    return this;                                 // Support chained method calls
};

// Remove each of the arguments from the set.
Set.prototype.remove = function () {
    for (var i = 0; i < arguments.length; i++) {  // For each argument
        var str = Set._v2s(arguments[i]);        // Map to a string
        if (this.values.hasOwnProperty(str)) {   // If it is in the set
            delete this.values[str];             // Delete it
            this.n--;                            // Decrease set size
        }
    }
    return this;                                 // For method chaining
};

// Return true if the set contains value; false otherwise.
Set.prototype.contains = function (value) {
    return this.values.hasOwnProperty(Set._v2s(value));
};

// Return the size of the set.
Set.prototype.size = function () {
    return this.n;
};

// Call function f on the specified context for each element of the set.
Set.prototype.foreach = function (f, context) {
    for (var s in this.values)                 // For each string in the set
        if (this.values.hasOwnProperty(s))    // Ignore inherited properties
            f.call(context, this.values[s]);  // Call f on the value
};

// This internal function maps any JavaScript value to a unique string.
//这是一个内部函数

Set._v2s = function (val) {
    switch (val) {
        case undefined:
            return 'u';          // Special primitive
        case null:
            return 'n';          // values get single-letter
        case true:
            return 't';          // codes.
        case false:
            return 'f';
        default:
            switch (typeof val) {
                case 'number':
                    return '#' + val;    // Numbers get # prefix.
                case 'string':
                    return '"' + val;    // Strings get " prefix.
                default:
                    return '@' + objectId(val); // Objs and funcs get @
            }
    }

    // For any object, return a string. This function will return a different
    // string for different objects, and will always return the same string
    // if called multiple times for the same object. To do this it creates a
    // property on o. In ES5 the property would be nonenumerable and read-only.
    function objectId(o) {
        var prop = "|**objectid**|";   // Private property name for storing ids
        if (!o.hasOwnProperty(prop))   // If the object has no id
            o[prop] = Set._v2s.next++; // Assign it the next available
        return o[prop];                // Return the id
    }
};
Set._v2s.next = 100;    // Start assigning object ids at this value.

2、javascript中的枚举类型

// This function creates a new enumerated type.  The argument object specifies
// the names and values of each instance of the class. The return value
// is a constructor function that identifies the new class.  Note, however
// that the constructor throws an exception: you can't use it to create new
// instances of the type.  The returned constructor has properties that 
// map the name of a value to the value itself, and also a values array,
// a foreach() iterator function
function enumeration(namesToValues) {
    // This is the dummy constructor function that will be the return value.
   //不能使用它来创建改类型的新实例
    var enumeration = function () {
        throw "Can't Instantiate Enumerations";
    };

    // Enumerated values inherit from this object.
    var proto = enumeration.prototype = {
        constructor: enumeration,                   // Identify type
        toString: function () {
            return this.name;
        }, // Return name
        valueOf: function () {
            return this.value;
        }, // Return value
        toJSON: function () {
            return this.name;
        }    // For serialization
    };

    enumeration.values = [];  // An array of the enumerated value objects

    // Now create the instances of this new type.
    for (name in namesToValues) {         // For each value
        var e = inherit(proto);          // Create an object to represent it
        e.name = name;                   // Give it a name
        e.value = namesToValues[name];   // And a value
        enumeration[name] = e;           // Make it a property of constructor
        enumeration.values.push(e);      // And store in the values array
    }
    // A class method for iterating the instances of the class
    enumeration.foreach = function (f, c) {
        for (var i = 0; i < this.values.length; i++) f.call(c, this.values[i]);
    };

    // Return the constructor that identifies the new type
    return enumeration;
}

3、Card.js

// Define a class to represent a playing card
function Card(suit, rank) {
    this.suit = suit;         // Each card has a suit
    this.rank = rank;         // and a rank
}

// These enumerated types define the suit and rank values
Card.Suit = enumeration({Clubs: 1, Diamonds: 2, Hearts: 3, Spades: 4});
Card.Rank = enumeration({Two: 2, Three: 3, Four: 4, Five: 5, Six: 6,
    Seven: 7, Eight: 8, Nine: 9, Ten: 10,
    Jack: 11, Queen: 12, King: 13, Ace: 14});

// Define a textual representation for a card
Card.prototype.toString = function () {
    return this.rank.toString() + " of " + this.suit.toString();
};
// Compare the value of two cards as you would in poker
Card.prototype.compareTo = function (that) {
    if (this.rank < that.rank) return -1;
    if (this.rank > that.rank) return 1;
    return 0;
};

// A function for ordering cards as you would in poker
Card.orderByRank = function (a, b) {
    return a.compareTo(b);
};

// A function for ordering cards as you would in bridge 
Card.orderBySuit = function (a, b) {
    if (a.suit < b.suit) return -1;
    if (a.suit > b.suit) return 1;
    if (a.rank < b.rank) return -1;
    if (a.rank > b.rank) return  1;
    return 0;
};


// Define a class to represent a standard deck of cards
function Deck() {
    var cards = this.cards = [];     // A deck is just an array of cards
    Card.Suit.foreach(function (s) {  // Initialize the array
        Card.Rank.foreach(function (r) {
            cards.push(new Card(s, r));
        });
    });
}

// Shuffle method: shuffles cards in place and returns the deck
Deck.prototype.shuffle = function () {
    // For each element in the array, swap with a randomly chosen lower element
    var deck = this.cards, len = deck.length;
    for (var i = len - 1; i > 0; i--) {
        var r = Math.floor(Math.random() * (i + 1)), temp;     // Random number
        temp = deck[i], deck[i] = deck[r], deck[r] = temp; // Swap
    }
    return this;
};

// Deal method: returns an array of cards
Deck.prototype.deal = function (n) {
    if (this.cards.length < n) throw "Out of cards";
    return this.cards.splice(this.cards.length - n, n);
};

// Create a new deck of cards, shuffle it, and deal a bridge hand
var deck = (new Deck()).shuffle();
var hand = deck.deal(13).sort(Card.orderBySuit);

4、标准转换方法：

//对象类型的转换方法有时候应该有意为之

// Add these methods to the Set prototype object.
extend(Set.prototype, {
// Convert a set to a string
    toString: function () {
        var s = "{",
            i = 0;
        this.foreach(function (v) {
            s += ((i++ > 0) ? ", " : "") + v;
        });
        return s + "}";
    },
// Like toString, but call toLocaleString on all values
    toLocaleString: function () {
        var s = "{",
            i = 0;
        this.foreach(function (v) {
            if (i++ > 0) s += ", ";
            if (v == null) s += v; // null & undefined
            else s += v.toLocaleString(); // all others
        });
        return s + "}";
    },
// Convert a set to an array of values
    toArray: function () {
        var a = [];
        this.foreach(function (v) {
            a.push(v);
        });
        return a;
    } });
// Treat sets like arrays for the purposes of JSON stringification.
Set.prototype.toJSON = Set.prototype.toArray;

两个对象的比较方法：

对于简单的类，可以先比较他们的constructor 然后在比较这两个对象的实例属性例如：

// The Range class overwrote its constructor property. So add it now.
Range.prototype.constructor = Range;
// A Range is not equal to any nonrange.
// Two ranges are equal if and only if their endpoints are equal.
Range.prototype.equals = function (that) {
    if (that == null) return false; // Reject null and undefined
    if (that.constructor !== Range) return false; // Reject non-ranges
// Now return true if and only if the two endpoints are equal.
    return this.from == that.from && this.to == that.to;
}

对于复杂的类，如Set类，应进行更深层次的比较

Set.prototype.equals = function (that) { // Shortcut for trivial case
    if (this === that) return true;
// If the that object is not a set, it is not equal to this one.
// We use instanceof to allow any subclass of Set.
// We could relax this test if we wanted true duck-typing.
// Or we could strengthen it to check this.constructor == that.constructor
// Note that instanceof properly rejects null and undefined values
    if (!(that instanceof Set)) return false;
// If two sets don't have the same size, they're not equal
    if (this.size() != that.size()) return false;
// Now check whether every element in this is also in that.
// Use an exception to break out of the foreach if the sets are not equal.
    try {
        this.foreach(function (v) {
            if (!that.contains(v)) throw false;
        });
        return true; // All elements matched: sets are equal.
    } catch (x) {
        if (x === false) return false; // An element in this is not in that.
        throw x; // Some other exception: rethrow it.
    }
};

方法借用：

var generic = {
    // Returns a string that includes the name of the constructor function
    // if available and the names and values of all noninherited, nonfunction
    // properties.
    toString: function () {
        var s = '[';
        // If the object has a constructor and the constructor has a name,
        // use that class name as part of the returned string.  Note that
        // the name property of functions is nonstandard and not supported
        // everywhere.
        if (this.constructor && this.constructor.name)
            s += this.constructor.name + ": ";

        // Now enumerate all noninherited, nonfunction properties
        var n = 0;
        for (var name in this) {
            if (!this.hasOwnProperty(name)) continue;   // skip inherited props
            var value = this[name];
            if (typeof value === "function") continue;  // skip methods
            if (n++) s += ", ";
            s += name + '=' + value;
        }
        return s + ']';
    },

    // Tests for equality by comparing the constructors and instance properties
    // of this and that.  Only works for classes whose instance properties are
    // primitive values that can be compared with ===.
    // As a special case, ignore the special property added by the Set class.
    equals: function (that) {
        if (that == null) return false;
        if (this.constructor !== that.constructor) return false;
        for (var name in this) {
            if (name === "|**objectid**|") continue;     // skip special prop.
            if (!this.hasOwnProperty(name)) continue;    // skip inherited 
            if (this[name] !== that[name]) return false; // compare values
        }
        return true;  // If all properties matched, objects are equal.
    }
};

私有状态：

function Range(from, to) {
    // Don't store the endpoints as properties of this object. Instead
    // define accessor functions that return the endpoint values.
    // These values are stored in the closure.
    this.from = function () {
        return from;
    };
    this.to = function () {
        return to;
    };
}

// The methods on the prototype can't see the endpoints directly: they have
// to invoke the accessor methods just like everyone else.
Range.prototype = {
    constructor: Range,
    includes: function (x) {
        return this.from() <= x && x <= this.to();
    },
    foreach: function (f) {
        for (var x = Math.ceil(this.from()), max = this.to(); x <= max; x++) f(x);
    },
    toString: function () {
        return "(" + this.from() + "..." + this.to() + ")";
    }
};

定义子类：

// A simple function for creating simple subclasses
function defineSubclass(superclass,  // Constructor of the superclass
                        constructor, // The constructor for the new subclass
                        methods,     // Instance methods: copied to prototype
                        statics)     // Class properties: copied to constructor
{
    // Set up the prototype object of the subclass
    constructor.prototype = inherit(superclass.prototype);
    constructor.prototype.constructor = constructor;
    // Copy the methods and statics as we would for a regular class
    if (methods) extend(constructor.prototype, methods);
    if (statics) extend(constructor, statics);
    // Return the class
    return constructor;
}

// We can also do this as a method of the superclass constructor
Function.prototype.extend = function (constructor, methods, statics) {
    return defineSubclass(this, constructor, methods, statics);
};

一个简单的子类：

// The constructor function 
function SingletonSet(member) {
    this.member = member;   // Remember the single member of the set
}

// Create a prototype object that inherits from the prototype of Set.
SingletonSet.prototype = inherit(Set.prototype);

// Now add properties to the prototype.
// These properties override the properties of the same name from Set.prototype.
extend(SingletonSet.prototype, {
    // Set the constructor property appropriately
    constructor: SingletonSet,
    // This set is read-only: add() and remove() throw errors
    add: function () {
        throw "read-only set";
    },
    remove: function () {
        throw "read-only set";
    },
    // A SingletonSet always has size 1
    size: function () {
        return 1;
    },
    // Just invoke the function once, passing the single member.
    foreach: function (f, context) {
        f.call(context, this.member);
    },
    // The contains() method is simple: true only for one value
    contains: function (x) {
        return x === this.member;
    }
});