js判断对象是否拥有某个key的两种方法对比

 更新时间:2023年12月13日 11:03:00   作者:YumOS  
JS中数组和对象是等同的,我们经常遇到需要判断一个key是否存在于对象中的情况,这篇文章主要给大家介绍了关于如何利用js判断对象是否拥有某个key的两种方法对比,需要的朋友可以参考下

一、两种判断方法

方法一 :"key" in obj ,结果为 false,表示不包含;否则表示包含

方法二 :obj.hasOwnProperty("key"),obj 表示对象,结果为 false 表示不包含;否则表示包含

二、两种方法的区别

这两种方法都可以用于检查对象是否包含指定的属性,但它们有一些区别。

  • “key” in obj:

    • 这种方法使用 in 运算符来检查属性是否存在于对象中。
    • 如果对象 obj 或其原型链中包含名为 “key” 的属性,则返回 true
    • 如果对象 obj 不包含名为 “key” 的属性,并且它的原型链上也不存在该属性,则返回 false
  • obj.hasOwnProperty(“key”):

    • 这种方法使用 hasOwnProperty 方法来检查对象是否直接拥有指定的属性。
    • 如果对象 obj 直接拥有名为 “key” 的属性,则返回 true
    • 如果对象 obj 不直接拥有名为 “key” 的属性,或者它的原型链上存在该属性,则返回 false

区别如下:

  • "key" in obj 检查的是属性是否存在于对象 obj 或其原型链中,而不仅仅是对象本身。
  • obj.hasOwnProperty("key") 检查的是属性是否直接存在于对象 obj 中,不包括其原型链。

三、举个例子来说明:

var obj = { key: "value" };
console.log("key" in obj);                  // 输出: true
console.log(obj.hasOwnProperty("key"));     // 输出: true

console.log("toString" in obj);             // 输出: true (toString是Object的原型方法)
console.log(obj.hasOwnProperty("toString"));// 输出: false

在这个例子中,obj 对象直接拥有名为 “key” 的属性,因此两种方法都返回 true。同时,由于 toString 方法存在于 Object 的原型中,因此使用 in 运算符检查 "toString" in obj 会返回 true,但 obj.hasOwnProperty("toString") 返回 false,因为该属性不是直接属于 obj 对象的。

因此,选择使用哪种方法取决于你对属性存在性的具体需求,是希望检查对象及其原型链上的属性,还是仅仅检查对象自身的属性。

附:js判断数组或对象中的key是否存在

JS中数组和对象是等同的,判断一个key是否存在于数组中(或对象是否包含某个属性),我们可能马上想到的是使用ary[key] == undefined来判断key是否存在这个数组或者是对象中,但是这样判断是有问题的,因为可能存在ary = {key:undefined};

正确的方法应该为:

ary.hasOwnProperty(key); 或 obj.hasOwnProperty(key);

另外数组或对象进行循环的时候应该使用:

for(var key in ary) { console.log(key+" : "+ary[key]); }

总结

到此这篇关于js判断对象是否拥有某个key的两种方法对比的文章就介绍到这了,更多相关js判断对象有某个key内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • javascript实现动态时钟的启动和停止

    javascript实现动态时钟的启动和停止

    这篇文章主要为大家详细介绍了javascript实现动态时钟的启动和停止文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-10-10
  • JS 退出系统并跳转到登录界面的实现代码

    JS 退出系统并跳转到登录界面的实现代码

    这篇文章介绍了退出系统后跳转到登陆页面的简单JS代码,有需要的朋友可以参考一下
    2013-06-06
  • JavaScript切换搜索引擎的导航网页搜索框实例代码

    JavaScript切换搜索引擎的导航网页搜索框实例代码

    这篇文章主要介绍了javascript切换搜索引擎的导航网页搜索框的实例代码,非常不错,具有参考借鉴价值 ,需要的朋友可以参考下
    2017-06-06
  • JavaScript实现简单的Markdown语法解析器

    JavaScript实现简单的Markdown语法解析器

    Markdown 是一种轻量级标记语言, 它允许人们使用易读易写的纯文本格式编写文档,然后转换成有效的 XHTML(或者HTML)文档。本文将利用JavaScript实现简单的Markdown语法解析器,感兴趣的可以了解一下
    2023-03-03
  • JS+CSS实现仿msn风格选项卡效果代码

    JS+CSS实现仿msn风格选项卡效果代码

    这篇文章主要介绍了JS+CSS实现仿msn风格选项卡效果代码,涉及JavaScript响应鼠标事件动态变换页面元素css样式实现切换功能的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-10-10
  • 利用JavaScript实现3D可旋转粒子矩阵效果

    利用JavaScript实现3D可旋转粒子矩阵效果

    dat.gui.js是一个一个轻量级的图形用户界面库,或者说GUI组件,只有几十KB,可以用于创建操作控制三维场景的菜单栏等。本文将利用dat.gui.min.js实现3D可旋转粒子矩阵效果,感兴趣的可以了解一下
    2022-06-06
  • 基于wordpress的ajax写法详解

    基于wordpress的ajax写法详解

    下面小编就为大家分享一篇基于wordpress的ajax写法详解,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-01-01
  • 完美实现bootstrap分页查询

    完美实现bootstrap分页查询

    这篇文章主要介绍了一个完美的bootstrap分页查询,如何利用bootstrap实现分页查询,本文将为大家进行揭晓
    2015-12-12
  • jsonp跨域请求详解

    jsonp跨域请求详解

    这篇文章主要为大家详细介绍了jsonp跨域请求的相关资料,激活了所有接口支持浏览器跨域请求的封装,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-07-07
  • 非常不错的[JS]Cookie精通之路

    非常不错的[JS]Cookie精通之路

    Cookies,有些人喜欢它们,有些人憎恨它们。但是,很少有人真正知道如何使用它们。现在你可以成为少数人中的成员-可以自傲的 Cookie 大师。
    2008-06-06

最新评论