JS中的hasOwnProperty()、propertyIsEnumerable()和isPrototypeOf()

 更新时间:2016年08月11日 10:17:31   作者:xiaobangsky  
这篇文章主要介绍了JS中的hasOwnProperty()、propertyIsEnumerable()和isPrototypeOf()的相关资料,需要的朋友可以参考下

首先了解枚举属性

一般利用for~in遍历

var a = [1,2,3];
for(var i in a){
console.log(a[i]);
}
or
var o = {p1:1,p2:2};
for(var i in o){
console.log(i+'='+o[i]);
}//p1=1;p2=2;

<1>并不是所有的属性都会在for~in遍历中显示。比如(数组的)length属性和constructor属性。那些已经被显示的属性被称为可枚举的,可以通过各个对象所提供的propertyIsEnumerable()方法来判断其中有哪些可枚举的属性;

<2>原型链中的各个属性也会被显示出来,前提是它们可枚举的,hasOwnProperty()来判断一个属性是对象自身属性还是原型属性;

<3>对于所有的原型属性,propertyIsEnumerable()都会返回false,包括那些在for~in遍历中可枚举的属性。

js代码示例

function dog(name,color){
this.name = name;
this.color = color;
this.someMethod = function(){return 1;}
}
dog.prototype.price=100;
dog.prototype.rating=3;
var newDog = new dog("doggg","yellow");
for(var prop in newDog){
console.log(prop+'='+newDog[prop]);
}
//name=doggg
//color=yellow
//someMethod=function (){return 1;}
//price=100
//rating=3
newDog.hasOwnProperty('name');//true;
newDog.hasOwnProperty('price');//false;

只显示自身属性

for(var prop in newDog){
if(newDog.hasOwnProperty(prop )){
console.log(prop+'='+newDog[prop]);
}
}
newDog.propertyIsEnumerable('name');//true
newDog.propertyIsEnumerable('constructor');//false

注意:内建属性和方法大部分是不可枚举的

任何来自原型链中的属性也是不可枚举的

如果propertyIsEnumerable()的调用是来自原型链上的某个对象,那么该对象中的属性是可枚举的

newDog.constructor.prototype.propertyIsEnumerable('price');//true

isPrototypeOf():每个对象都有,表示当前对象是否是另一个对象的原型

js代码示例

var monkey = {
hair:true,
feeds:'bananas',
breathes:'air'
};
function Human(name){
this.name = name;
}
Human.prototype = monkey;
var george = new Human('George');
monkey.isPrototypeOf(george);//true

以上所述是小编给大家介绍的JS中的hasOwnProperty()、propertyIsEnumerable()和isPrototypeOf(),希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

相关文章

  • JavaScript实现移动端轮播效果

    JavaScript实现移动端轮播效果

    这篇文章主要为大家详细介绍了JavaScript实现移动端轮播效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-06-06
  • js自己实现一个大文件切片上传+断点续传的示例代码

    js自己实现一个大文件切片上传+断点续传的示例代码

    本文主要介绍了js自己实现一个大文件切片上传+断点续传的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2022-06-06
  • Js类的静态方法与实例方法区分及jQuery拓展的两种方法

    Js类的静态方法与实例方法区分及jQuery拓展的两种方法

    这篇文章主要介绍了Js类的静态方法与实例方法区分及jQuery拓展的两种方法 的相关资料,对静态方法(Static)和实例方法(非Static)不太理解的朋友可以一起学习下
    2016-06-06
  • JavaScript中常见的继承方式总结

    JavaScript中常见的继承方式总结

    这篇文章主要和大家详细介绍了JavaScript中常见的几种继承方式,文中的示例代码讲解详细,对我们学习JavaScript有一定帮助,需要的小伙伴可以参考下面文章详细内容
    2022-11-11
  • 今天,小程序正式支持 SVG

    今天,小程序正式支持 SVG

    这篇文章主要介绍了小程序支持SVG,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-04-04
  • 原生js实现2048小游戏

    原生js实现2048小游戏

    这篇文章主要为大家详细介绍了原生js实现2048小游戏,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-03-03
  • TypeScript之调用栈的实现

    TypeScript之调用栈的实现

    这篇文章主要介绍了TypeScript之调用栈的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-12-12
  • javascript sort()对数组中的元素进行排序详解

    javascript sort()对数组中的元素进行排序详解

    在本篇文章里小编给大家整理是一篇关于javascript sort()对数组中的元素进行排序的相关知识点内容,需要的朋友们学习下。
    2019-10-10
  • Bootstrap 中data-[*] 属性的整理

    Bootstrap 中data-[*] 属性的整理

    本文给大家收藏整理了关于Bootstrap 中data-[*] 属性的相关知识,感兴趣的朋友一起看看吧
    2018-03-03
  • JavaScript的History API使搜索引擎抓取AJAX内容

    JavaScript的History API使搜索引擎抓取AJAX内容

    这篇文章主要介绍了JavaScript的History API使搜索引擎抓取AJAX内容 的相关资料,需要的朋友可以参考下
    2015-12-12

最新评论