js判断对象是否存在某个属性的几种办法技巧
更新时间：2023年12月20日 09:16:00 作者：詹姆斯bind
这篇文章主要给大家介绍了关于js判断对象是否存在某个属性的几种办法技巧,判断对象中是否有某属性的常见方式总结,不同的场景要使用不同的方式,文中通过代码介绍的非常详细,需要的朋友可以参考下
前言
在 JavaScript 开发中，判断一个对象是否存某个属性在是非常基础的操作，也是开发者经常需要处理的问题之一。然而，繁琐的代码可能会让我们感到疲惫不堪，因此这里将介绍几种 JavaScript 小技巧，帮助你更高效地判断对象属性的存在性，提高代码效率⏱。
👋 技巧一： 使用 hasOwnProperty 方法
hasOwnProperty 是 JavaScript 中的内置方法，用于检测一个对象是否拥有特定的自身属性。如果包含，则返回 true，否则返回 false。注意，这里的“自身属性”指的是挂在对象自身上的属性，而不包括原型链上的属性。
const person = {
name: 'Tom',
age: 18
};
console.log(person.hasOwnProperty('name')); // true
console.log(person.hasOwnProperty('gender')); // false
console.log(person.hasOwnProperty('toString')); // false 对象原型上有 toString 属性
这种方式可以判断一个属性是否挂载在对象自身上，但无法判断其是否存在于原型链上。
👋 技巧二：使用 in 操作符
使用 in 操作符可以判断一个对象是否包含某个属性，如果该属性存在于对象自身或其原型链上，则返回 true，否则返回 false。
const person = {
name: 'Tom',
age: 18
};
console.log('name' in person); // true
console.log('gender' in person); // false
console.log('toString' in person); // true
这种方式可以判断一个属性是否存在于对象自身或其原型链上，但无法区分属性是挂载在对象自身还是原型链上。
👋 技巧三：使用 Reflect.has 方法
Reflect.has 是 ES6 中引入的新方法，用于检测一个对象是否包含某个属性，与 in 操作符类似，可以同时判断一个属性是否存在于对象自身或原型链上。
const person = {
name: 'Tom',
age: 18
};
console.log(Reflect.has(person, 'name')); // true
console.log(Reflect.has(person, 'gender')); // false
console.log(Reflect.has(obj, 'toString')); // true
上面几种方法都可以满足我们日常开发中对对象属性存在与否的判断，如果要精确判断属性是在对象自身还是原型链上可以这样做
const person = {
name: 'Tom',
age: 18
};
console.log(Object.getPrototypeOf(person).hasOwnProperty('name')); // false
console.log(Object.getPrototypeOf(person).hasOwnProperty('toString')); // true
简单总结
其实实现对属性的判断还有很多方法，有些方法可能在性能上有损耗、或者判断存在缺陷这里接不一一列举，目前这3个方法是我日常开发中使用比较多的，推荐给大家。
到此这篇关于js判断对象是否存在某个属性的几种办法技巧的文章就介绍到这了,更多相关js判断对象是否存在属性内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
本篇文章主要是对js二维数组定义和初始化的三种方法进行了总结介绍，需要的朋友可以过来参考下，希望对大家有所帮助2014-03-03
在注册信息的时候，常常需要通过下拉菜单让用户选择，而且希望用户在第一个下拉框做的选择，影响第二个下拉框的内容。有时候，如果第一个下拉框不作出选择，第二个下拉框根本不会页面上显示，为了给用户呈现一个更清晰的页面。2013-07-07
这篇文章主要给大家介绍了关于利用原生js实现trigger方法的相关资料，文中通过示例代码介绍的非常详细，对大家学习或者使用js具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧2019-05-05
这篇文章主要介绍了JavaScript 函数节流详解及实例的相关资料,需要的朋友可以参考下2017-02-02
JavaScript 是世界上最流行的编程语言。javaScript中有五种空值和假值，分别为false，null，undefined，“”，0。从广义上来说，这五个值都是对应数据类型的无效值或空值2017-12-12
今天小编就为大家分享一篇layui中的switch开关实现方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-09-09
方法链一般适合对一个对象进行连续操作(集中在一句代码)。一定程度上可以减少代码量，缺点是它占用了函数的返回值。2011-01-01
这篇文章主要介绍了你不知道的forEach函数的相关资料，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2023-05-05
JavaScript是一种动态的，弱类型的，基于原型的，面向对象的解释型语言。函数是JavaScript中的头等公民。2010-04-04
这篇文章主要介绍了JavaScript延迟加载之async与defer的应用场景与使用区别的介绍，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2022-09-09
最新评论