【前言】
每一个函数都有自己的prototype属性,而该属性所存储的是原型对象。在上一篇中我们讲解了通过原型对象动态添加属性,结果我们介绍原型对象的三个常用方法。
【内容】
原型方法:
①isPrototypeOf();主要判断当前对象是否是另一个对象的原型,返回的类型是布尔值,经常被使用。
var monkey = {
hair:'red',
feeds:'bananas',
}
function Human(name) {
this.name = name;
}
Human.prototype = monkey;
var judy = new Human('judy');
//返回的值是一个布尔类型的
monkey.isPrototypeOf(judy);
②hasOwnProperty():判断一个属性是自身属性还是原型属性,发生的情况主要是在出现原型的时候。
注意:一个对象在自身属性中没有找到指定的属性,就会在原型链中查找相关的属性。自身属性的优先级高于原型属性!
//定义了一个monkey的对象
var monkey = {
hair:'red',
feeds:'bananas',
}
//定义了Human的构造器函数
function Human(name) {
this.name = name;
}
//将human的原型属性执行了monkey。
Human.prototype = monkey;
//实例化对象Human。
var judy = new Human('judy');
//动态添加了实例化对象judy的属性。
judy.age = '20';
judy.sex = '女';
//输出
console.log(judy.sex); //输出结果是20
console.log(judy.feeds);//输出结果是bananas
console.log(judy.hasOwnProperty('sex')); //结果输出是true
console.log(judy.hasOwnProperty('feeds')); //输出结果是false
可是这样的结果可能让你看不出来自身属性和原型属性的优先级,我们修改上面的代码,让judy的动态添加属性feeds,然后查看输出:
judy.feeds='meat';
结果也会出来非常大的区别,其中console.log(judy.feeds)输出的是meat,console.log(judy.hasOwnProperty('feeds'))输出的结果是true。
如果你想要显露出来对象的原型属性,可以将对象的自身属性删除掉,这样就可以显示出来原型属性:delete judy.feeds;结果就会出来原型属性。
③propertyIsEnumerable()
ES5之后出现这个属性,在for-in的循环中,只有是这种具有枚举特性的才会显示出来。而不是枚举的特性例如:constructor,在调用propertyIsEnumerable返回false。
function Monkey(name, color) {
this.name = name;
this.color = color;
this.Method = function () { return 1;}
}
Monkey.prototype.price = 100;
Monkey.prototype.rating = 6;
var judy = new Monkey('judy', 'red');
judy.propertyIsEnumerable('name');
judy.propertyIsEnumerable('constructor');
//for-in循环,列出对象中的所有的属性,包括原型属性
for (var prop in judy) { console.log(prop + '=' + judy[prop]);}
其中judy.propertyIsEnumerable('constructor');返回的结果是false,所以在for-in返回的结果属性中并没有constructor。
延伸:
原型链:如果我们在访问一个对象,并且访问一个并不存在的属性,javascript的引擎会搜索该对象的属性,如果依然没有找到,会继续搜索其原型,,以此类推,直到父级对象Object。
在用原型动态添加属性的时候我们必须首先判断其自身没有该属性,否则这个工作没有意义,因为自身属性要由于原型属性。
【总结】
其实在总结这部分的知识的时候我们还有遗留的一些问题,比如在使用原型对象的过程中内存的开辟应该是怎么样的逻辑等一些的问题,希望如果你了解咱们可以相互交流! 感谢您的时间!