JavaScript如何正确访问isConfirm对象的不同属性值

问题描述 #

我通过如下方式在控制台打印对象的取值：

if (isConfirm) {
   console.log(isConfirm); // 第一个条件分支
}else{
   console.log(isConfirm); // 第二个条件分支
}

进入第一个条件分支时，打印的对象结构如下：

{value: true}
value: true
[[Prototype]]: Object

第一个条件分支结果（对应结果截图已省略）

进入第二个条件分支时，打印的对象结构如下：

{dismiss: "cancel"}
dismiss: "cancel"
[[Prototype]]: Object

第二个条件分支结果（对应结果截图已省略）

我的问题是：如何在两个条件分支中正确访问 isConfirm 对象对应的值？我尝试用如下方式访问第一个分支的value值，但控制台没有打印出"RETURNS TRUE"，说明写法是错误的：

if (isConfirm === true) {
    console.log("RETURNS TRUE");
}

请问这种场景下正确访问对象属性值的方式是什么？

解答 #

你写的判断逻辑不生效的核心原因是：isConfirm本身是一个对象，不是布尔值，用对象和布尔值做全等判断（===）永远返回false，自然不会进入对应分支。

正确的访问方式分场景如下：

• 第一个分支（对象携带value属性）
  直接访问对象的value属性做判断即可：

// 可选链写法，兼容属性不存在的情况，避免报错
if (isConfirm?.value === true) {
    console.log("RETURNS TRUE");
}
// 如果你确定进入该分支时isConfirm一定存在value属性，可以直接写
if (isConfirm.value === true) {
    console.log("RETURNS TRUE");
}

• 第二个分支（对象携带dismiss属性）
  访问对象的dismiss属性即可：

if (isConfirm?.dismiss === 'cancel') {
    console.log("用户触发取消操作");
}

如果需要在同一个逻辑里同时兼容两种场景，可以用属性存在性判断先做分支区分：

if (isConfirm) {
    if ('value' in isConfirm) {
        // 处理确认场景的逻辑
        console.log(isConfirm.value);
    } else if ('dismiss' in isConfirm) {
        // 处理取消/关闭场景的逻辑
        console.log(isConfirm.dismiss);
    }
}

内容的提问来源于stack exchange，提问作者user16729679