javascript - 在 Typescript 中使用 Array.from 收到的函数未定义错误

Question

我尝试在 Typescript 应用程序中使用一些 ES6 语法，并希望在映射可观察对象数组时将 for-of 循​​环更改为 Array.from，但我收到了 undefine is not a function 错误。

   Array.from(item.modules, ([value]) =>
       selectedImage.setModules(
        moudleWithThumbnail(value.name, value.version).name,
        moudleWithThumbnail(value.name, value.version).version,
        moudleWithThumbnail(value.name, value.version).thumbnail
    ));

但是如果我用另一种方式写，它就可以正常工作

 const arr = Array.from(item.modules);
    arr.map((item: any) =>
      selectedImage.setModules(
        moudleWithThumbnail(item.name, item.version).name,
        moudleWithThumbnail(item.name, item.version).version,
        moudleWithThumbnail(item.name, item.version).thumbnail
      )
    );

我不知道他们之间有什么区别。

Answer 1

使用 ([value]) =>，您可以将参数(项目)的第一个可迭代属性解构为 value 变量名称。但是您的 item 是一个对象，而不是可迭代的(如数组) - 因此像 [value] 这样的数组解构语法将不起作用。

如果您想解构，请使用对象解构，提取名称和版本:

Array.from(item.modules, ({ name, version }) =>
  selectedImage.setModules(
    moudleWithThumbnail(name, version).name,

或者不要解构:

Array.from(item.modules, (item) =>
  selectedImage.setModules(
    moudleWithThumbnail(item.name, item.version).name,

或者，减少代码重复的更好策略是仅调用 moudleWithThumbnail 一次(如果可行的话):

 Array.from(item.modules, (item) => {
   const { name, version, thumbnail } = moudleWithThumbnail(item.name, itemversion);
   return selectedImage.setModules(name, version, thumbnail);
 });