判断对象中是否存在某个属性

判断对象中是否存在某个对象,很容易遇见,下面使用其中的一种写法。

// 判断对象是否存在某一个属性,正确写法
const hasProperty = (obj,key) => key in obj;

常见的错误写法有哪些?

第一种:

// 这只是判断了obj是否存在key这个属性,
const hasProperty = (obj,key) => obj.key !==undefined

// 而我们需要判断的应该是它的值,所以应该这样写
const hasProperty = (obj,key) => obj[key] !==undefined

这样写就可以了吗?能不能使用undefined判断对象属性是否存在?在浏览器控制输入这一段代码,回车运行。我们验证一下第一种写法是否正确:

const hasProperty=(obj,key) => obj[key] !==undefined;
var obj={k:undefined};
hasProperty(obj,'k');

当对象属性值为undefined时,它返回的是false,预期应该true(k是存在obj中的),所以并不能使用undefined判断对象中是否存在某个属性。

第二种:

// 通过Object.keys(obj)得到属性形成的属性数组['key'],再用includes()判断['key']是否有参数key的值
const hasProperty = (obj,key) => Object.keys(obj).includes(key);

那这种方式是否可行?验证:

const hasProperty = (obj,key) => Object.keys(obj).includes(key);
var obj={k:undefined, o:2};
hasProperty(obj,'o');// ['k','o'],'o'

// true

 这样子好像可以判断。如果传入对象是这个样子,会怎么样?

const hasProperty = (obj,key) => Object.keys(obj).includes(key);
var obj={k:undefined, o:2};

// 给obj对象加一个属性p和其值为1
Object.defineProperty(obj,'p',{
    enumerable: false, // 不可遍历
    value: 1, // p 的值
})

console.log(obj.p); // 1 

hasProperty(obj,'p'); // false

从下图,我们发现obj已经有存在p且p也有值了,但是通过hasProperty()判断不出来,因此第二种方式也不行。

扫描二维码关注公众号,回复: 16312687 查看本文章

 第三种:

第三种是对象提供的判断对象是否存在属性的一个方法 hasOwnProperty(),这个函数只会查看对象本身有没有这个属性。Object.prototype.hasOwnProperty.call(obj,key)跟hasOwnProperty()一样,因为obj可以从原型链上获取到Object的方法。

const hasProperty = (obj,key) =>obj.hasOwnProperty(key);
var obj={k:undefined, o:2};

// 给obj对象加一个属性p和其值为1
Object.defineProperty(obj,'p',{
    enumerable: false, // 不可遍历
    value: 1, // p 的值
})

console.log(obj.p); // 1 

hasProperty(obj,'p'); // true

控制台运行,hasOwnProperty()判断对象自身没有问题,验证发现hasProprty()判断出来的与预期结果不一致。但我们知道obj是存在toString()方法的,那toString()从哪里来呢?toString() 来自原型链上的,obj对象本身没有,obj就会从原型链上找。

console.log(obj.toString) // ƒ toString() { [native code] }

hasProperty(obj,'toString'); // false

原型链,可以参考这张图:

那么应该如何判断对象是否存在某一个属性并且可以从原型链上查找到toString()等?可以用 in :

const hasProperty = (obj,key) => key in obj;


var obj={k:undefined, o:2};

// 给obj对象加一个属性p和其值为1
Object.defineProperty(obj,'p',{
    enumerable: false, // 不可遍历
    value: 1, // p 的值
})

console.log(obj.p); // 1 

hasProperty(obj,'p'); // true


hasProperty(obj,'toString'); // true

5.17 EhO:/ 判断某一个对象里面是否存在某个属性,常见错误场景排查,你中招了吗? # web前端面试题# javascript# es6# 程序员 https://v.douyin.com/S5pWyCL/ 复制此链接,打开Dou音搜索,直接观看视频!https://v.douyin.com/S5pWyCL/

猜你喜欢

转载自blog.csdn.net/qq_58062502/article/details/129410561