JavaScript ES6+ : Destructuring and using an array method at the same time?

Question

我想知道是否有一种方法可以同时破坏和使用数组方法？如果是，使用它是否有用，或者是否会大大降低代码的可读性，以至于不值得？

我当前的代码是这样的:

const { props: { title, ingredients: ing } } = this;
const ingredients = ing.map(
  (ing, index) => <li key={index}>{ing}</li>
);

但我正在尝试找到一种更短的方法，如下所示:

const { props: { title, ingredients: ingredients.map(
  (ing, index) => <li key={index}>{ing}</li>
); } } = this;

但是这段代码不起作用。任何提示将不胜感激! :)

Answer 1

不，这是不可能的。解构就是这样做的，它将属性分配给目标表达式。赋值语法没有任何用于更改指定值的修饰符(默认初始化器已经是一个扩展)。

正如@kingdaro建议的那样，使用

const { title, ingredients } = this.props;
const ingredientElements = ingredients.map((ing, index) => <li key={index}>{ing}</li>);