如何循环访问Map对象的值？解决total属性读取报错问题

错误原因 #

你遇到的 TypeError: Cannot read properties of undefined (reading 'total')，本质是**dataLookup.get(d["state"]) 返回了 undefined**——当前遍历的 d["state"] 值，不存在于 dataLookup 这个 Map 的 key 集合中，后续访问 ["total"] 自然触发报错。

修复方法 #

方法1：可选链+空值合并操作符（简洁写法） #

用 ?. 避免链式访问时的报错，再通过 ?? 设置默认值（示例用0，可根据需求调整）：

z={(d) => dataLookup.get(d["state"])?.["total"] ?? 0}

• ?.：如果左侧值为 undefined 或 null，会直接返回 undefined，不会继续访问后续属性
• ??：当左侧值为 undefined 或 null 时，返回右侧的默认值

方法2：显式判断存在性（更直观） #

先获取对应项，判断存在后再读取 total，否则返回默认值：

z={(d) => {
  const stateData = dataLookup.get(d["state"]);
  return stateData ? stateData.total : 0;
}}

额外排查建议 #

你需要检查数据匹配问题：

• 确认 d["state"] 的实际值，和 dataLookup 中的 key 是否完全一致（包括空格、大小写、特殊符号，比如是否存在多空格、全角/半角符号差异）
• 可临时添加日志排查异常值：

z={(d) => {
  const state = d["state"];
  const stateData = dataLookup.get(state);
  if (!stateData) {
    console.log("找不到匹配的state：", state);
  }
  return stateData?.total ?? 0;
}}

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