JavaScript中用in、hasOwnProperty检查嵌套属性返回false的问题

原因解释 #

• in运算符和hasOwnProperty方法只会把传入的字符串当成单个完整的属性名，在当前目标对象的直属属性列表中查找，不会自动解析嵌套的属性路径。
• 你定义的obj对象本身的直属属性只有games，不存在名称为games[0].id的属性，因此两个判断都返回false。
• 你平时写的obj.games[0].id是JS的属性访问语法，JS引擎会自动拆分路径逐层访问：先找obj的games属性，再找games数组的第0项，最后找该项的id属性，这个逻辑和in/hasOwnProperty的判断逻辑完全不同。

正确的嵌套属性检查方式 #

如果你要判断完整路径对应的属性是否存在，需要逐层判断：

// 逐层判断
const isExist = 'games' in obj 
  && 0 in obj.games 
  && 'id' in obj.games[0]
console.log(isExist) // 输出true

验证说明 #

你可以手动给obj添加一个名为games[0].id的属性，就能看到in运算符返回true：

obj['games[0].id'] = '测试值'
console.log('games[0].id' in obj) // 此时返回true

内容的提问来源于stack exchange，提问作者João Nunes