×

聊聊对res?.code === 200,res?.data?.code以及res && res.code === 200 这些写法的理解

作者:Terry2025.08.15来源:Web前端之家浏览:38评论:0

聊聊对res?.code === 200,res?.data?.code以及res && res.code === 200 这些写法的理解

要想作为一名优秀的开发者,我们需要对代码的严谨和简洁化,今天跟大家一起聊一个很简单的话题:res?.code === 200,res?.data?.code和res && res.code === 200,这三种的有什么区别以及最优选取。

在微信小程序(或JavaScript)中,res?.code === 200 是一种 可选链(Optional Chaining) 和 严格相等(Strict Equality) 的结合用法,用于安全地检查接口返回的 code 是否为 200

代码解析

1. res?.code(可选链)

  • 作用:防止 res 是 null 或 undefined 时报错。

  • 等效写法:

res && res.code

示例:

const res = { code: 200 };
console.log(res?.code); // 200

const res2 = null;
console.log(res2?.code); // undefined(不会报错)

=== 200(严格相等)

  • 作用:检查 code 是否等于 200(类型和值都必须匹配)。

  • 与 == 的区别:

"200" == 200   // true(宽松相等,类型转换)
"200" === 200  // false(严格相等,类型不同)

正确使用场景

1. 检查接口返回的 code

wx.request({
  url: 'https://api.example.com/data',
  success(res) {
    if (res?.data?.code === 200) {
      console.log('请求成功', res.data);
    } else {
      console.log('请求失败', res?.data?.message || '未知错误');
    }
  },
  fail(err) {
    console.error('网络错误', err);
  },
});

2. 结合 try-catch 增强健壮性

try {
  const res = await wx.request({ url: '...' });
  if (res?.data?.code === 200) {
    // 处理成功逻辑
  } else {
    throw new Error(res?.data?.msg || '请求失败');
  }
} catch (err) {
  console.error('接口异常', err);
}

常见问题

1. res?.code 和 res.code 的区别

写法当 res 为 null/undefined 时
res.code报错:Cannot read property 'code' of null
res?.code返回 undefined(安全)

2. 为什么用 === 而不是 ==

  • === 避免隐式类型转换,更严谨。

  • 例如:

if (res?.code == 200) {
  // 如果 code 是字符串 "200",也会进入这里(可能不符合预期)
}

3. 更安全的默认值处理

如果 res 可能完全无响应,可以加默认值:

const code = res?.data?.code ?? -1; // 如果 res.data.code 是 undefined/null,返回 -1
if (code === 200) {
  // ...
}

最佳实践

  1. 始终用 ?. 访问深层属性,避免 res.data.code 报错。

  2. 用 === 严格比较,避免 "200" == 200 的意外情况。

  3. 结合 try-catch 处理异常,增强代码健壮性。

完整示例

Page({
  async fetchData() {
    try {
      const res = await wx.request({
        url: 'https://api.example.com/data',
      });
      if (res?.data?.code === 200) {
        this.setData({ list: res.data.list });
      } else {
        wx.showToast({
          title: res?.data?.message || '请求失败',
          icon: 'none',
        });
      }
    } catch (err) {
      wx.showToast({
        title: '网络异常',
        icon: 'error',
      });
    }
  },
});

总结

  • res?.code === 200 是一种 安全且严谨 的写法,推荐在接口判断中使用。

  • 可选链 (?.) 防止 null/undefined 报错,=== 确保类型和值严格匹配。

  • 结合 try-catch 和默认值,可以让代码更健壮。

您的支持是我们创作的动力!
温馨提示:本文作者系Terry ,经Web前端之家编辑修改或补充,转载请注明出处和本文链接:
https://www.jiangweishan.com/article/javaxcdrescode25.html

网友评论文明上网理性发言 已有0人参与

发表评论: