学习javascript面向对象 理解javascript原型和原型链(2)

【重写原型】调用构造函数时会为实例添加一个指向最初原型的[[prototype]]指针,而把原型修改为另外一个对象就等于切断了构造函数与最初原型之间的联系。实例中的指针仅指向原型,而不指向构造函数。
三、基本方法  
[1]isPrototypeOf():判断实例对象和原型对象是否存在于同一原型链中,只要是原型链中出现过的原型,都可以说是该原型链所派生的实例的原型

function Person(){}; var person1 = new Person(); var person2 = new Object(); console.log(Person.prototype.isPrototypeOf(person1));//true console.log(Object.prototype.isPrototypeOf(person1));//true console.log(Person.prototype.isPrototypeOf(person2));//false console.log(Object.prototype.isPrototypeOf(person2));//true

[2]ECMAScript5新增方法Object.getPrototypeOf():这个方法返回[[Prototype]]的值

function Person(){}; var person1 = new Person(); var person2 = new Object(); console.log(Object.getPrototypeOf(person1)); //Person{} console.log(Object.getPrototypeOf(person1) === Person.prototype); //true console.log(Object.getPrototypeOf(person1) === Object.prototype); //false console.log(Object.getPrototypeOf(person2)); //Object{}

[3]hasOwnProperty():检测一个属性是否存在于实例中

function Person(){ Person.prototype.name = 'Nicholas'; } var person1 = new Person(); //不存在实例中,但存在原型中 console.log(person1.hasOwnProperty("name"));//false //不存在实例中,也不存在原型中 console.log(person1.hasOwnProperty("no"));//false person1.name = 'Greg'; console.log(person1.name);//'Greg' console.log(person1.hasOwnProperty('name'));//true delete person1.name; console.log(person1.name);//"Nicholas" console.log(person1.hasOwnProperty('name'));//false

[4]ECMAScript5的Object.getOwnPropertyDescriptor():只能用于取得实例属性的描述符,要取得原型属性的描述符,必须直接在原型对象上调用Object.getOwnPropertyDescription()方法

function Person(){ Person.prototype.name = 'Nicholas'; } var person1 = new Person(); person1.name = 'cook'; console.log(Object.getOwnPropertyDescriptor(person1,"name"));//Object {value: "cook", writable: true, enumerable: true, configurable: true} console.log(Object.getOwnPropertyDescriptor(Person.prototype,"name"));//Object {value: "Nicholas", writable: true, enumerable: true, configurable: true}

[5]in操作符:在通过对象能够访问给定属性时返回true,无论该属性存在于实例还是原型中

function Person(){} var person1 = new Person(); person1.name = 'cook'; console.log("name" in person1);//true console.log("name" in Person.prototype);//false var person2 = new Person(); Person.prototype.name = 'cook'; console.log("name" in person2);//true console.log("name" in Person.prototype);//true

[6]同时使用hasOwnProperty()方法和in操作符,来确定属性是否存在于实例中

//hasOwnProperty()返回false,且in操作符返回true,则函数返回true,判定是原型中的属性 function hasPrototypeProperty(object,name){ return !object.hasOwnProperty(name) && (name in object); } function Person(){ Person.prototype.name = 'Nicholas'; } var person1 = new Person(); console.log(hasPrototypeProperty(person1,'name'));//true person1.name = 'cook'; console.log(hasPrototypeProperty(person1,'name'));//false delete person1.name; console.log(hasPrototypeProperty(person1,'name'));//true delete Person.prototype.name; console.log(hasPrototypeProperty(person1,'name'));//false

[7]ECMAScript5的Object.keys()方法:接收一个对象作为参数,返回一个包含所有可枚举属性的字符串数组
[注意]一定要先new出实例对象再使用该方法,否则为空

function Person(){ Person.prototype.name = 'Nicholas'; Person.prototype.age = 29; Person.prototype.job = 'Software Engineer'; Person.prototype.sayName = function(){ alert(this.name); } }; var keys = Object.keys(Person.prototype); console.log(keys);//[] var p1 = new Person(); p1.name = "Rob"; p1.age = 31; var keys = Object.keys(Person.prototype); console.log(keys);//["name","age","job","sayName"] var p1Keys = Object.keys(p1); console.log(p1Keys);//["name","age"]

[8]ECMAScript5的Object.getOwnPropertyNames()方法:接收一个对象作为参数,返回一个包含所有属性的字符串数组
[注意]一定要先new出实例对象再使用该方法,否则只有constructor

function Person(){ Person.prototype.name = 'Nicholas'; Person.prototype.age = 29; Person.prototype.job = 'Software Engineer'; Person.prototype.sayName = function(){ alert(this.name); } }; var keys = Object.getOwnPropertyNames(Person.prototype); console.log(keys);//["constructor"] var p1 = new Person(); var keys = Object.getOwnPropertyNames(Person.prototype); console.log(keys);//["constructor", "name", "age", "job", "sayName"]

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wgwfsf.html