理解原型对象
每创建一个函数,就会同时创建它的 Prototype 对象,即原型对象。每个函数都有一个 prototype 属性,这个属性指向函数的原型对象。在默认情况下,所有原型对象都会自动获取一个 constructor(构造函数) 属性,这个属性是一个指向 prototype 属性所在函数的指针。例如:
function Person(){
}
Person.prototype.constructor 指向 Person 。通过这个构造函数,我们还可以为原型对象添加其他属性和方法,如下所示:
function Person( ){
}
Person.prototype.name = "Nicholas";
}
var person1=new Person( );
person1.sayName( ); //"Nicholas"
var person2 = new Person( );
person2.sayName( ); //"Nicholas"
虽然无法直接访问Prototype,但可以通过isPrototypeOf( )方法确定对象之间是否存在这种关系。例如:
alert(Person.prototype.isPrototypeOf(person1)); //true
alert(Person.prototype.isPrototypeOf(person2)); //true
ECMAScript 5中增加了一个新方法 Object.getPrototypeOf() 返回 Prototype 的值。
alert(Object.getPrototypeOf(person1)==Person.prototype); //true
alert(Object.getPrototypeOf(person1).name); //"Nicholas"
虽然可以通过对象实例访问原型中的值,但却不能通过对象实例重写原型中的值。在实例中添加的与原型重名的属性,将覆盖原型中的属性,使用 delete 操作符可以完全删除实例属性,从而访问原型属性。如下所示:
function Person( ){
}
Person.prototype.name = "Nicholas";
}
var person1 = new Person( );
var person2 = new Person( );
person1.name = "Greg";
alert(person1.name); //"Greg"
alert(person2.name); //"Nicholas"
delete.person1.name;
alert(person1.name); //"Nicholas"
使用 hasOwnProperty( ) 方法(从Object继承来)可以检测一个属性是否存在于实例中。如:
function Person( ){
}
Person.prototype.name = "Nicholas";
}
var person1 = new Person( );
alert(person1.hasOwnProperty("name")); //false
person1.name = "Greg";
alert(person1.name); //"Greg"
alert(person1.hasOwnProperty("name")); //true
delete person1.name;
alert(person1.hasOwnProperty("name")); //false
访问原型和实例属性
单独使用 in 操作符
无论要访问的属性存在于实例还是原型中,都会返回 truth .例如:
function Person( ){
}
Person.prototype.name = "Nicholas";
}
var person1 = new Person( );
//同时使用hasOwnProperty()方法和in操作符可以确定该属性在实例中还是原型中
alert(person1.hasOwnProperty( " name" )); //false
alert("name" in person1); //true
person1.name = "Greg";
alert(person1.hasOwnProperty( " name" )); //true
使用 for-in 循环
返回的是所有能够通过对象访问的、可枚举(enumerated)的属性,包括实例和原型中的属性。覆盖了原型中不可枚举属性的实例属性也会在 for-in 循环中返回。
根据规定,所有开发人员定义的属性(和函数)都是可枚举的,只有IE8及更早版本中例外。IE早期版本中的bug使得覆盖不可数枚举的实例属性不会再 for-in 循环中出现 。如:
var o = {
//原型的 toString()方法的Enumerable 值为false
toString : function {
return "My Object";
}
};
for ( var prop in o) {
if (prop == "toString") { // 在IE中跳过Enumerable 值为false的方法
alert ( "Found toString !"); //在IE中不会显示
}
}
ECMAScript 也将 constructor 和 property 属性的 Enumerable 特性设置为 false ,但并不是所有浏览器都按此实现。
Object.keys( ) 方法
取得对象上所有可枚举的实例属性( 不包含原型上的属性),例如:
function Person( ){
}
Person.prototype.name = "Nicholas";
Person.prototype.age = "29";
Person.prototype.sayName = function ( ){
alert ( this.name );
};
var keys = Object.keys(Person.prototype);
alert(keys); //"name,age,sayName"
var person1=new Person();
Person1.name = "Mary";
var keys = Object.keys(person1);
alert(keys); //"name,age"
Object.getOwnPropertyNames( ) 方法
获得所有实例属性,不管是否可枚举,可使用。如:
var keys = Object.getOwnPropertyNames( Person.prototype);
alert(keys); //"constructor , name, age, sayName"
Object.keys( ) 和 Object.getOwnPropertyNames( ) 方法都可以替代 for-in 循环。支持这两个方法的浏览器有 IE9+、Firefox 4+、Safari 5+、Opera 12+和Chrome。