使用hasOwnProperty时报错的解决方法

 更新时间:2024年01月04日 15:10:32   作者:嘿!陈俊彦  
hasOwnProperty这个方法是用来查找一个对象是否有某个属性,且查找的属性必须是对象本身的一个成员,但是不会去查找对象的原型链,文中介绍了使用示例代码及使用时可能会遇到的问题,对hasOwnProperty报错原因分析及解决方法感兴趣的朋友一起看看吧

hasOwnProperty

hasOwnProperty这个方法是用来查找一个对象是否有某个属性,且查找的属性必须是对象本身的一个成员,但是不会去查找对象的原型链。
使用示例:

var obj = {
    a: 1,
    fun: function(){},
    c:{
        d: 5
    }
};
console.log(obj.hasOwnProperty('a'));  // true
console.log(obj.hasOwnProperty('fun'));  // true
console.log(obj.hasOwnProperty('c'));  // true
console.log(obj.c.hasOwnProperty('d'));  // true
console.log(obj.hasOwnProperty('d'));  // false, obj对象没有d属性

JS中hasOwnProperty方法用法简介

hasOwnProperty用法

使用时可能会遇到的问题

由于ESLint升级,在项目中直接使用xxx.hasOwnProperty()可能会导致:

error  Do not access Object.prototype method 'hasOwnProperty' from 
target object  no-prototype-builtins

这个错误提示大概就是说:不要从目标对象上访问 Object 原型方法。在ECMAScript 5.1中,新增了 Object.create,它支持使用指定的 [[Prototype]] 创建对象。我们可以通过使用call()方法来调用不属于本身this对象的方法。
例如:

var a = {
  today: '2022年5月11号',
  weather: '阴天'
  show: function(){
    return this.today+ '是' + this.weather
  }
}
var b = {
  today: '2022年5月30号',
  weather: '晴天'
}
//调用a的show方法,并用于b
b.show.call(a)  
console.log(b)  //输出为:2022年5月30是晴天

所以解决该问题的方法为:将xxx.hasOwnProperty(‘yyy’)修改为Object.prototype.hasOwnProperty.call(xxx, ‘yyy’)。
代码示例:

 handleEdit(todo) {
            // if(todo.hasOwnProperty('isEdit')){
            //    todo.isEdit = true;
            // }else{
            //   this.$set(todo,'isEdit',true)
            // }
            if(Object.prototype.hasOwnProperty.call(todo, 'isEdit')){
               todo.isEdit = true;
            }else{
              this.$set(todo,'isEdit',true)
            }
          },

到此这篇关于使用hasOwnProperty时报错的解决方法的文章就介绍到这了,更多相关hasOwnProperty报错内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • JS遍历Json字符串中键值对先转成JSON对象再遍历

    JS遍历Json字符串中键值对先转成JSON对象再遍历

    这篇文章主要介绍了JS遍历Json字符串中键值对的方法,先将Json字符串转换成JSON对象,再进行遍历,需要的朋友可以参考下
    2014-08-08
  • JavaScript中的逻辑判断符&&、||与!介绍

    JavaScript中的逻辑判断符&&、||与!介绍

    这篇文章主要介绍了JavaScript中的逻辑判断符&&、||与!介绍,本文讲解了逻辑与&&的处理规则、逻辑或||的处理规则、!操作符,需要的朋友可以参考下
    2014-12-12
  • Javascript中window.name属性详解

    Javascript中window.name属性详解

    这篇文章主要介绍了Javascript中window.name属性详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-11-11
  • JavaScript高级函数应用之分时函数实例分析

    JavaScript高级函数应用之分时函数实例分析

    这篇文章主要介绍了JavaScript高级函数应用之分时函数,结合实例形式分析了javascript通过合理分时函数应用避免浏览器卡顿或假死的相关操作技巧,需要的朋友可以参考下
    2018-08-08
  • 如何利用Proxy更优雅地处理异常详解

    如何利用Proxy更优雅地处理异常详解

    这篇文章主要给大家介绍了关于如何利用Proxy更优雅地处理异常的相关资料,文中通过实例代码以及图文介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2022-03-03
  • JavaScript中Map遍历方法代码示例

    JavaScript中Map遍历方法代码示例

    这篇文章主要给大家介绍了关于JavaScript中Map遍历方法的相关资料,Map是一组键值对的结构,具有极快的查找速度,文中通过代码介绍的非常详细,需要的朋友可以参考下
    2023-11-11
  • javascript 日期相减-在线教程(附代码)

    javascript 日期相减-在线教程(附代码)

    这篇文章主要介绍了javascript 日期相减的实例讲解,附上代码供大家查看,需要的朋友可以参考下
    2017-08-08
  • js数值计算时使用parseInt进行数据类型转换(jquery)

    js数值计算时使用parseInt进行数据类型转换(jquery)

    这篇文章主要介绍了js数值计算时使用parseInt进行数据类型转换(jquery),需要的朋友可以参考下
    2014-10-10
  • JS实现Ajax的方法分析

    JS实现Ajax的方法分析

    这篇文章主要介绍了JS实现Ajax的方法,结合实例形式分析了ajax的概念、原理、js实现与使用方法,需要的朋友可以参考下
    2016-12-12
  • Safari5中alert的无限循环BUG

    Safari5中alert的无限循环BUG

    猜测Safari5中将点击alert框的确定按钮也当成点击body了。事件一直冒泡到弹出框上。
    2011-04-04

最新评论