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或其他库提供的社区验证的稳定版本）

Answer 2

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

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

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

Answer 3

怎么样

return {...this.props}

在退货声明中进行销毁

3 个答案: