js属性对象的hasOwnProperty方法的使用


Posted in Javascript onFebruary 05, 2021

Object的hasOwnProperty()方法返回一个布尔值,判断对象是否包含特定的自身(非继承)属性。

判断自身属性是否存在

var o = new Object();
o.prop = 'exists';

function changeO() {
 o.newprop = o.prop;
 delete o.prop;
}

o.hasOwnProperty('prop'); // true
changeO();
o.hasOwnProperty('prop'); // false

判断自身属性与继承属性

function foo() {
 this.name = 'foo'
 this.sayHi = function () {
  console.log('Say Hi')
 }
}

foo.prototype.sayGoodBy = function () {
 console.log('Say Good By')
}

let myPro = new foo()

console.log(myPro.name) // foo
console.log(myPro.hasOwnProperty('name')) // true
console.log(myPro.hasOwnProperty('toString')) // false
console.log(myPro.hasOwnProperty('hasOwnProperty')) // fasle
console.log(myPro.hasOwnProperty('sayHi')) // true
console.log(myPro.hasOwnProperty('sayGoodBy')) // false
console.log('sayGoodBy' in myPro) // true

遍历一个对象的所有自身属性

在看开源项目的过程中,经常会看到类似如下的源码。for...in循环对象的所有枚举属性,然后再使用hasOwnProperty()方法来忽略继承属性。

var buz = {
  fog: 'stack'
};

for (var name in buz) {
  if (buz.hasOwnProperty(name)) {
    alert("this is fog (" + name + ") for sure. Value: " + buz[name]);
  }
  else {
    alert(name); // toString or something else
  }
}

注意 hasOwnProperty 作为属性名

JavaScript 并没有保护 hasOwnProperty 属性名,因此,可能存在于一个包含此属性名的对象,有必要使用一个可扩展的hasOwnProperty方法来获取正确的结果:

var foo = {
  hasOwnProperty: function() {
    return false;
  },
  bar: 'Here be dragons'
};

foo.hasOwnProperty('bar'); // 始终返回 false

// 如果担心这种情况,可以直接使用原型链上真正的 hasOwnProperty 方法
// 使用另一个对象的`hasOwnProperty` 并且call
({}).hasOwnProperty.call(foo, 'bar'); // true

// 也可以使用 Object 原型上的 hasOwnProperty 属性
Object.prototype.hasOwnProperty.call(foo, 'bar'); // true

参考链接

到此这篇关于js属性对象的hasOwnProperty方法的使用的文章就介绍到这了,更多相关js hasOwnProperty内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
关于this和self的使用说明
Aug 01 Javascript
JavaScript 原型链学习总结
Oct 29 Javascript
jQuery中after的两种用法实例
Jul 03 Javascript
jQuery表单验证简单示例
Oct 17 Javascript
jQuery  ready方法实现原理详解
Oct 19 Javascript
jQuery中 $ 符号的冲突问题及解决方案
Nov 04 Javascript
js事件冒泡与事件捕获详解
Feb 20 Javascript
JavaScript 下载svg图片为png格式
Jun 21 Javascript
微信小程序实现手势滑动卡片效果
Aug 26 Javascript
JavaScript实现移动端弹窗后禁止滚动
May 25 Javascript
Vue双向数据绑定(MVVM)的原理
Oct 03 Javascript
微信小程序实现锚点跳转
Nov 23 Javascript
关于element的表单组件整理笔记
Feb 05 #Javascript
详解JavaScript中的this指向问题
Feb 05 #Javascript
JavaScript事件概念详解(区分静态注册和动态注册)
Feb 05 #Javascript
详解javascript脚本何时会被执行
Feb 05 #Javascript
前端如何实现动画过渡效果
Feb 05 #Javascript
原生js拖拽功能制作滑动条实例代码
Feb 05 #Javascript
jQuery是用来干什么的 jquery其实就是一个js框架
Feb 04 #jQuery
You might like
递归列出所有文件和目录
2006/10/09 PHP
PHP脚本的10个技巧(7)
2006/10/09 PHP
PHP curl实现抓取302跳转后页面的示例
2014/07/04 PHP
ThinkPHP框架设计及扩展详解
2014/11/25 PHP
PHPCMS2008广告模板SQL注入漏洞修复
2016/10/11 PHP
php 如何设置一个严格控制过期时间的session
2017/05/05 PHP
javascript获取作用在元素上面的样式属性代码
2012/09/20 Javascript
jquery Mobile入门—多页面切换示例学习
2013/01/08 Javascript
详解AngularJs中$resource和restfu服务端数据交互
2016/09/21 Javascript
Nodejs中解决cluster模块的多进程如何共享数据问题
2016/11/10 NodeJs
微信小程序利用co处理异步流程的方法教程
2017/05/20 Javascript
送你43道JS面试题(收藏)
2019/06/17 Javascript
VUE中使用HTTP库Axios方法详解
2020/02/05 Javascript
vue实现简单跑马灯效果
2020/05/25 Javascript
Python实现保证只能运行一个脚本实例
2015/06/24 Python
Python学习小技巧之列表项的拼接
2017/05/20 Python
python分布式环境下的限流器的示例
2017/10/26 Python
python编写微信远程控制电脑的程序
2018/01/05 Python
ubuntu17.4下为python和python3装上pip的方法
2018/06/12 Python
python实现比较文件内容异同
2018/06/22 Python
Python3标准库总结
2019/02/19 Python
Python中Numpy ndarray的使用详解
2019/05/24 Python
Django 设置多环境配置文件载入问题
2020/02/25 Python
为什么是 Python -m
2020/06/19 Python
基于CSS3 animation动画属性实现轮播图效果
2017/09/12 HTML / CSS
HTML5自定义mp3播放器源码
2020/01/06 HTML / CSS
美国婚戒购物网站:Anjays Designs
2017/06/28 全球购物
美国室内盆栽植物购买网站:Plants.com
2020/04/24 全球购物
迟到检讨书400字
2014/01/13 职场文书
网页美工求职信范文
2014/04/17 职场文书
提拔干部考察材料
2014/05/26 职场文书
自我检讨书范文
2015/01/28 职场文书
公司清洁工岗位职责
2015/04/15 职场文书
MySQL为id选择合适的数据类型
2021/06/07 MySQL
Vue3如何理解ref toRef和toRefs的区别
2022/02/18 Vue.js
sql注入报错之注入原理实例解析
2022/06/10 MySQL