JavaScript对象赋值报错：移除API/IOT键时出现undefined错误

这确实是日常开发中很容易踩的坑——当你尝试给嵌套对象的属性赋值时，如果中间某个层级的键不存在，就会抛出Cannot set property 'xxx' of undefined的错误。我给你几个实用的原生解决方案，不用额外依赖也能搞定：

1. 基础版：逐层检查存在性 #

最直观的方式就是在赋值前，先判断当前层级的对象是否存在，避免访问undefined的属性：

Object.keys(params).forEach(key => {
  // 先确认iot对象存在，再赋值
  if (params[key].iot) {
    params[key].iot.keyName = `/firstURL/`;
  }
  // 同理处理api对象
  if (params[key].api) {
    params[key].api.anotherKeyName = `/url/var2`;
  }
});

这种方式兼容性拉满，不管是旧浏览器还是新环境都能跑，唯一的小缺点是嵌套层级多的话代码会有点啰嗦。

2. 简洁版：使用可选链操作符（ES2020+） #

如果你的项目环境支持ES2020及以上（比如现代浏览器、Node.js 14+），可以用可选链?.来简化代码，它会自动处理中间层级不存在的情况，直接短路返回undefined，不会触发错误：

Object.keys(params).forEach(key => {
  params[key].iot?.keyName = `/firstURL/`;
  params[key].api?.anotherKeyName = `/url/var2`;
});

一行代码就搞定安全赋值，非常清爽。如果是旧项目需要兼容低版本环境，可以通过Babel等转译工具来支持可选链语法。

3. 初始化版：确保嵌套结构完整性 #

如果你的需求是不管原来有没有api/iot键，都要保证这些结构存在并完成赋值，可以先初始化缺失的对象：

Object.keys(params).forEach(key => {
  // 若iot不存在，就创建一个空对象
  params[key].iot = params[key].iot || {};
  params[key].iot.keyName = `/firstURL/`;
  
  // 同理初始化api对象
  params[key].api = params[key].api || {};
  params[key].api.anotherKeyName = `/url/var2`;
});

这样处理后，即使原始的params里没有api或iot，也会自动创建对应的空对象，既不会报错，还能保证整个对象结构的一致性。

额外提一句：如果你的项目已经引入了Lodash工具库，也可以用_.set方法来安全赋值，比如_.set(params[key], 'iot.keyName', '/firstURL/')，不过如果只是处理这一处的话，原生方法已经足够好用啦。

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