返回Map与Number时解构异常（值为undefined）的排查

为什么color_map和psize都是undefined？ #

你遇到的核心问题大概率和**method函数的实现有关**，和匿名函数没有关系。你提到makeColorMap被当作参数传入method，但如果method没有正确执行这个传入的函数，或者没有返回它的执行结果，那解构赋值自然会得到undefined。

举个典型的错误示例，如果method是这样实现的：

const method = (fn) => {
  // 仅接收函数，但未调用，也无返回值
};

那method(arr)实际上返回的是undefined，解构undefined的color_map和psize属性，结果必然是undefined。

正确的method应该要调用传入的makeColorMap，并返回它的结果，比如：

const method = (fn, img) => {
  // 把arr作为img参数传给makeColorMap
  return fn(img);
};
// 调用时需要传入makeColorMap和对应的参数
const {color_map, psize} = method(makeColorMap, arr);

你需要重点检查method的实现：它是否正确调用了传入的makeColorMap？是否把arr作为img参数传递给了它？是否返回了makeColorMap的执行结果？这几个点是解决问题的关键。

关于之前版本Map前两个元素被赋值的疑问 #

你提到之前版本中Map的前两个元素被赋值给了color_map和psize，这说明之前的代码返回的不是包含color_map和psize的对象，而是直接返回了color_map这个Map实例。

因为Map是可迭代对象，它的迭代器会依次返回每一个键值对（格式为[key, value]）。如果之前的代码是这样的：

const makeColorMap = (img) => { 
  let color_map = new Map(); 
  // ... 填充Map数据
  return color_map; // 直接返回Map，而非对象
} 
// 使用数组解构而非对象解构
const [color_map, psize] = method(arr);

这时候数组解构会取Map迭代器的前两个元素（也就是前两个键值对数组），所以color_map会是第一个[key, value]数组，psize是第二个，这就会出现你说的“Map的前两个元素分别被赋值给了color_map和psize”的情况。

快速排查步骤 #

1. 优先检查method函数：确认它调用了传入的makeColorMap，传递了正确的参数，并且返回了函数执行结果。
2. 其次检查makeColorMap内部：确认psize在// ...部分被正确赋值（即使赋值为0也不会是undefined，所以这不是核心问题）。

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