JS中的原型对象(一)

来源:互联网 发布:web软件开发工程师 编辑:程序博客网 时间:2024/06/05 01:03

理解原型对象

每创建一个函数,就会同时创建它的 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)); //truealert(Person.prototype.isPrototypeOf(person2)); //true

ECMAScript 5中增加了一个新方法 Object.getPrototypeOf() 返回 Prototype 的值。

alert(Object.getPrototypeOf(person1)==Person.prototype); //truealert(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"));     //falseperson1.name = "Greg";alert(person1.name);      //"Greg"alert(person1.hasOwnProperty("name"));     //truedelete 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" ));          //falsealert("name" in person1);                          //trueperson1.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。

原创粉丝点击