壹 ❀ 引

看过博主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 判断对象属性是否存在,判断是否包含某个属性,是否为自身属性的更多相关文章

  1. Java判断对象是否为NULL

    Java使用反射判断对象是否为NULL 判断Java对象是否为null可以有两层含义: 第一层:  直接使用 object == null 去判断,对象为null的时候返回true,不为null的时候 ...

  2. js判断对象的某个属性是否存在

    参考:https://www.jb51.net/article/141994.htm 原始数据, [ {"name":"向阳镇","id": ...

  3. 将对象的所有属性名放到一个数组中 || 获得对象的所有属性名 || return;不具有原子性 || 怎样自己制作异常|| 判断对象有没有某个属性 || 当传递的参数比需要的参数少的时候,没有的值会被赋予undefined || 获得函数实际传递的参数 || 怎么用函数处理一个对象 || 用一个名字空间定义一个模块所有的函数 || 给一个对象添加方法

    获得对象的所有属性名 || 将对象o的所有属性名放到数组中 var o = {x:1,y:2,z:3}; var arr = []; var i = 0; for(arr[i++] in o){};/ ...

  4. JS/React 判断对象是否为空对象

    JS一般判断对象是否为空,我们可以采用: if(!x)的方式直接判断,但是如果是一个空对象,比如空的JSON对象,是这样的:{},简单的判断是不成功的,因为它已经占用着内存了,如果是JQuery的话, ...

  5. 判断js数组/对象是否为空

    /** * 判断js数组/对象是否为空 * isPrototypeOf() 验证一个对象是否存在于另一个对象的原型链上.即判断 Object 是否存在于 $obj 的原型链上.js中一切皆对象,也就是 ...

  6. js中判断对象类型的几种方法

    我们知道,JavaScript中检测对象类型的运算符有:typeof.instanceof,还有对象的constructor属性: 1) typeof 运算符 typeof 是一元运算符,返回结果是一 ...

  7. 简述Js中,判断对象为空对象的几种方式

    1.空对象.空引用以及undefined三种概念的区别 空对象:是对象,但它的值是指向没有任何属性的对象的引用, {}是指 不含任何属性 的对象,当然对象属性包括 字面值和函数: 空引用:obj=nu ...

  8. js中判断对象具体类型

    大家可能知道js中判断对象类型可以用typeof来判断.看下面的情况 <script> alert(typeof 1);//number alert(typeof "2" ...

  9. JS判断对象是否存在的方法

    Javascript语言的设计不够严谨,很多地方一不小心就会出错. 举例来说,请考虑以下情况. 现在,我们要判断一个全局对象myObj是否存在,如果不存在,就对它进行声明.用自然语言描述的算法如下: ...

  10. Js判断对象是否为空,Js判断字符串是否为空

    Js判断对象是否为空,Js判断字符串是否为空,JS检查字符串是否为空字符串 >>>>>>>>>>>>>>>&g ...

随机推荐

  1. Go 汇编学习笔记

    0.前言 学习 Go 离不开看源码,源码又包含大量汇编代码,离开汇编是学不好 Go 的.同样,离开汇编去学习计算机是不完整的,汇编是基石,是离操作系统和硬件最近的一层. 虽然之前学过一点 Go 汇编, ...

  2. java使用递归及迭代方式实现前序遍历 中序遍历 后序遍历 以及实现层序遍历

    本文为博主原创,转载请注明出处: 目录: 一.快速理解前序,中序,后序遍历的区别 二.使用递归的方式实现前序,中序,后序遍历 三. 使用迭代的方式实现前序 中序 后序遍历 四.层序遍历 一.快速理解前 ...

  3. jmap 查看jvm内存大小并进行dump文件内存分析

    本文为博主原创,未经允许不得转载: 1.jmap的使用 Jmap 可以用来查看内存信息,实例个数以及占用内存大小. jmap -histo[:live] 打印每个class的实例数目,内存占用,类全名 ...

  4. 基于java+springboot的旅游信息网站、旅游景区门票管理系统

    该系统是基于java+springboot开发的旅游景区门票管理系统.是给师弟开发的大四实习作品.学习过程中,遇到问题可以咨询github作者. 演示地址 前台地址: http://travel.gi ...

  5. spring启动流程 (3) BeanDefinition详解

    BeanDefinition在Spring初始化阶段保存Bean的元数据信息,包括Class名称.Scope.构造方法参数.属性值等信息,本文将介绍一下BeanDefinition接口.重要的实现类, ...

  6. 05-Shell索引数组变量

    1.介绍 Shell 支持数组(Array),数组是若干数据的集合,其中的每一份数据都称为数组的元素. 注意Bash Shell 只支持一维数组,不支持多维数组. 2.数组的定义 2.1 语法 在 S ...

  7. web-云部署上线

  8. [转帖]JDK8使用G1 垃圾回收器能解决大问题吗?

    https://zhuanlan.zhihu.com/p/458098236 G1 垃圾回收器真的不行吗? 本文想突出两个问题: 解决问题的思路:从最原始的角度去思考,问题的本身是因为缓存数据导致的G ...

  9. 【转帖】Linux开发工具 — readelf、objdump、hexdump

    本博文的主要内容是:1)readelf工具查看ELF文件的信息:2)hexdump工具查看这块内存:3)objdump工具对文件进行反汇编. 前一段时间对Linux不熟,所以很多命令不知道.学习C时候 ...

  10. 周末拾遗 xsos 的学习与使用

    周末拾遗 xsos 的学习与使用 摘要 周末陪儿子上跆拳道课. 自己一个人傻乎乎的开着笔记本想着学习点东西. 上午看到了一个sosreport的工具. 本来想学习一下. 发现xsos 应该是更好的一个 ...