在返回语句中解构[重复]

Question

我的应用中有多个案例看起来像这样：

  getVariables() {
    const {
      allowCustomValues,
      budgets,
      budgetsToAdd,
      budgetsToRemove,
      isGlobal,
      isRequired,
      name,
      tagTypeId,
      valuesToAdd,
      valuesToDelete,
    } = this.props;

    return {
      allowCustomValues,
      budgets,
      budgetsToAdd,
      budgetsToRemove,
      isGlobal,
      isRequired,
      name,
      tagTypeId,
      valuesToAdd,
      valuesToDelete,
    };
  }

这似乎很麻烦，但更短的解决方案是在我想要的每个变量之前加上this.props.，从维护的角度来看，这并不是更好。

我想要的是这样的：

  getVariables() {
    return this.props.{
      allowCustomValues,
      budgets,
      budgetsToAdd,
      budgetsToRemove,
      isGlobal,
      isRequired,
      name,
      tagTypeId,
      valuesToAdd,
      valuesToDelete,
    };
  }

是否有某种 ES6 语法可以让我使这段代码更干一点？

编辑： 可能是 ES6 destructuring within a return statement 的副本，但该答案有一个无法解决问题的公认答案。

Answer 1

实际上解构不允许这样做。

您正在询问 lodash 的 pick() 的等价物。也许你已经在你的项目中使用了 lodash。如果你不这样做，你仍然可以自己编写这样的帮助程序（但最好使用来自 lodash 或其他库的稳定社区证明的版本）

Answer 2

为什么不直接使用Object.assign()？

    return Object.assign({}, this.props);

这将构建一个新的空对象，然后将 this.props 中的所有可枚举属性复制到其中。目标对象由Object.assign() 返回，所以它几乎可以完成所有工作。

Answer 3

怎么样

return {...this.props}