JS 判断对象属性是否存在,判断是否包含某个属性,是否为自身属性
壹 ❀ 引
看过博主JS 疫情宅在家,学习不能停,七千字长文助你彻底弄懂原型与原型链这篇文章的同学应该知道,文中有专门介绍这个问题。那么为什么我要另起一篇再说一次呢?原因有两个,一是介绍原型与原型链的文章过长,大家不一定看得完;二是这个月我只写了一篇博客!!!我良心过不去!!我对不起关注我的粉丝!!!真实原因是,我发现网上问这个问题的人还挺多,单独拿出来说也值得(其实就是水文章),那么本文开始。
贰 ❀ 判断是否包含某对象
我们知道访问对象属性有两种形式,如下:
var obj = {
name:'听风是风'
};
obj.name;//听风是风
obj['name'];//听风是风
那么马上有同学就想到用这两种形式判断对象是否包含某个属性,因为原型链上如果某个属性不存在就会返回undefined,比如:
if(!obj.age){
console.log('obj没有age属性');
}
这么做行不行,行,但是存在缺陷。最特殊的情况就是我们有age字段,而它的值偏偏就是undefined,那这样就尴尬了。
怎么办呢,一般推荐使用 in 运算符,用法是属性名 in 对象,如果存在返回true,反之为false,来看个例子:
var echo = {
name:'听风是风',
job:undefined
};
console.log('name' in echo);//true
console.log('job' in echo);//true
console.log('age' in echo);//false
但需要注意的是,in 只能判断对象有没有这个属性,无法判断这个属性是不是自身属性,啥意思?咱们接着说。
叁 ❀ 判断是否是自身属性
一个最简单的构造函数创建实例的例子:
function Parent(){
this.name = 'echo';
};
Parent.prototype.age = 26;
var o = new Parent();
o.name//echo
o.age//26
在这个例子中,对于实例 o 而言,name就是是自身属性,这是它自己有的,而age是原型属性,o虽然没有这个属性,但在需要时,它还是顺着原型链找到了自己的老父亲Parent,并借用了这个属性。
所以当我们用 in 判断时可以发现结果均为true:
'name' in o;//true
'age' in o;//true
针对这个问题,如果我们还要判断是否是自身属性,就得借用方法hasOwnProperty(),不信你看:
o.hasOwnProperty('name');//true
o.hasOwnProperty('age');//false
说到底hasOwnProperty()做了两件事,除了判断对象是否包含这个属性,还判断此属性是不是对象的自身属性。
所以我们可以简单总结一下,如果我们只需判断对象有没有某个属性,使用 in 运算符就好了。而如果我们还要关心这个属性是不是自身属性,那么推荐hasOwnProperty()方法。
说了这么多,这两个判断有什么使用场景呢?
关于 in 运算符判断对象有没有某个属性,最常见的,我们希望给某个对象添加一个方法,直接添加又担心其他同事已经声明过,存在覆盖的可能性,所以使用 in 来判断,没有这个属性,咱们再加。
当然针对这个问题,使用Symbol来确保对象key的唯一性也是不错的做法,这个就看实际场景了。
而关于hasOwnProperty()这个方法呢,我目前遇到的就是深拷贝实现时会使用,因为我们知道每个对象都有原型,而深拷贝时我们只是希望拷贝对象的自身属性,使用此方法做个区分就是非常奈斯的做法了。
好了,这篇文章就说到这里了,全文结束。
JS 判断对象属性是否存在,判断是否包含某个属性,是否为自身属性的更多相关文章
- Java判断对象是否为NULL
Java使用反射判断对象是否为NULL 判断Java对象是否为null可以有两层含义: 第一层: 直接使用 object == null 去判断,对象为null的时候返回true,不为null的时候 ...
- js判断对象的某个属性是否存在
参考:https://www.jb51.net/article/141994.htm 原始数据, [ {"name":"向阳镇","id": ...
- 将对象的所有属性名放到一个数组中 || 获得对象的所有属性名 || return;不具有原子性 || 怎样自己制作异常|| 判断对象有没有某个属性 || 当传递的参数比需要的参数少的时候,没有的值会被赋予undefined || 获得函数实际传递的参数 || 怎么用函数处理一个对象 || 用一个名字空间定义一个模块所有的函数 || 给一个对象添加方法
获得对象的所有属性名 || 将对象o的所有属性名放到数组中 var o = {x:1,y:2,z:3}; var arr = []; var i = 0; for(arr[i++] in o){};/ ...
- JS/React 判断对象是否为空对象
JS一般判断对象是否为空,我们可以采用: if(!x)的方式直接判断,但是如果是一个空对象,比如空的JSON对象,是这样的:{},简单的判断是不成功的,因为它已经占用着内存了,如果是JQuery的话, ...
- 判断js数组/对象是否为空
/** * 判断js数组/对象是否为空 * isPrototypeOf() 验证一个对象是否存在于另一个对象的原型链上.即判断 Object 是否存在于 $obj 的原型链上.js中一切皆对象,也就是 ...
- js中判断对象类型的几种方法
我们知道,JavaScript中检测对象类型的运算符有:typeof.instanceof,还有对象的constructor属性: 1) typeof 运算符 typeof 是一元运算符,返回结果是一 ...
- 简述Js中,判断对象为空对象的几种方式
1.空对象.空引用以及undefined三种概念的区别 空对象:是对象,但它的值是指向没有任何属性的对象的引用, {}是指 不含任何属性 的对象,当然对象属性包括 字面值和函数: 空引用:obj=nu ...
- js中判断对象具体类型
大家可能知道js中判断对象类型可以用typeof来判断.看下面的情况 <script> alert(typeof 1);//number alert(typeof "2" ...
- JS判断对象是否存在的方法
Javascript语言的设计不够严谨,很多地方一不小心就会出错. 举例来说,请考虑以下情况. 现在,我们要判断一个全局对象myObj是否存在,如果不存在,就对它进行声明.用自然语言描述的算法如下: ...
- Js判断对象是否为空,Js判断字符串是否为空
Js判断对象是否为空,Js判断字符串是否为空,JS检查字符串是否为空字符串 >>>>>>>>>>>>>>>&g ...
随机推荐
- 【STM32】如何将资源烧写至外部flash,如spi-flash
STM32将资源烧写至外部flash方式大致分为通过IDE与应用程序一起和通过CubeProgranmmer单独烧写两种: 方式一.使用IDE加载烧写算法,烧录应用程序时一并写入,具体就是修改分散加载 ...
- Mongo-文档主键-ObjectId
文档主键 文档主键时 _id,如果插入文档时,没有传入则自动生产ObjectId 作为文档主键 文档主键要求在集合中唯一 文档主键可以时另一个文档,被当作字符串对象处理 ObjectId对象 获取文档 ...
- SQLServer的varchar与nvarchar的学习之二
SQLServer的varchar与nvarchar的学习之二 背景 昨天简单总结了多种数据库 varchar和nvarchar的区别与关系 今天想着能够分析一下数据库文件. 计划使用winhex 查 ...
- Redis内存问题的学习之一
Redis内存问题的学习之一 背景 前几天帮同事看redis的问题 发现info memory 显示 60GB 但是实际上 save出来的dump文件只有 800M 然后导入到其他的redis之后, ...
- [转帖]一次ORA-3136的处理
https://oracleblog.org/working-case/deal-with-ora3136/ 最近收到一个告警,用户说数据库无法连接,但是从监控上看,oracle的后台进程已经侦听进程 ...
- [转帖]History of Web Browser Engines from 1990 until today
https://eylenburg.github.io/browser_engines.htm Many tried, few remain... Last updated: January 2023 ...
- 限制input框中字数的输入maxlength
今天产品提出一个需求就是.限制input框中的的值. 当用户超过10个字符时,用户再次输入的时,就不能够输入了. (最后就能够输入10个字符) maxlength=10 <input maxle ...
- 一个思路:实现 golang 中的 `__file__` `__line__` 宏
作者:张富春(ahfuzhang),转载时请注明作者和引用链接,谢谢! cnblogs博客 zhihu Github 公众号:一本正经的瞎扯 测试 zaplog 发现,开启 caller 的调用,会使 ...
- Go-操作redis/redigo
目录 Go-操作redis 安装 连接 使用 设置key过期时间 批量获取mget.批量设置mset 列表操作 hash操作 Pipelining(管道) redis发布会订阅模式 事务操作 万能操作 ...
- Redux和@reduxjs/toolkit的使用
1. 简介: Redux 是一种用于管理应用程序状态的 JavaScript 库.它是一个可预测的状态容器,可以用于编写 可维护和可扩展的应用程序. @reduxjs/toolkit 是一个官方提供的 ...