解构分配中的道具可以就地转换吗？答案

【问题标题】：Can the props in a destructuring assignment be transformed in place?解构分配中的道具可以就地转换吗？
【发布时间】：2018-08-11 18:47:03
【问题描述】：

这行得通……

const { prop1:val1, prop2:val2 ) = req.query
val1 = val1.toLowerCase()

不过，我更倾向于做类似的事情

const { prop1.toLowerCase():val1, prop2:val2 } = req.query

或

const { prop1:val1.toLowerCase(), prop2:val2 } = req.query

两者都不起作用。是否有类似的语法或必须在破坏赋值之外进行操作？

【问题讨论】：

标签： javascript syntax ecmascript-6 variable-assignment destructuring

【解决方案1】：

不，这是不可能的。解构赋值只会赋值，它不会对值进行任意转换。（Setter 是一个例外，但它们只会使这复杂化）。

我建议写

const { prop1, prop2:val2 ) = req.query;
const val1 = prop1.toLowerCase();

或者，在一个陈述中：

const { prop1, prop2:val2 ) = req.query, val1 = prop1.toLowerCase();

【讨论】：

缺点是有两个变量引用相同数据的不同版本，这可能会导致混淆/错误。我想这就是 OP 试图避免的。实用功能可能会更好。
@doodlemeister，你认为如何实现一个 util 函数以使其变得更好？
@TJWalker：如果更好，您的意思是避免使用 var，那么我制定了一个解决方案，我将发布。虽然它肯定更冗长，但为了使其通用，它使用回调函数来处理需要转换的属性。
@doodlemeister 我确定如果这是一个问题，可以使用块作用域或 IIFE 来包含 prop1 变量，但它只会变得更加冗长。
@doodlemeister const { val1, val2 } = (({prop1, prop2}) => ({val1: prop1.toLowerCase(), val2: prop2}))(req.query);

【解决方案2】：

临时变量解决方案的问题在于，它们会将同一数据的不同版本引入作用域，这可能会导致错误。

此解决方案创建了一个实用函数，该函数接收要解构的对象以及第二个对象，该对象是属性名称到转换函数的映射。这有点冗长，但可以解决问题。

// Utility functions to perform specified transformations on an object
function transformProps(obj, trans) {
  return Object.assign({}, obj, ...Object.entries(trans).map(([prop, fn]) => 
    prop in obj ? {[prop]: fn(obj[prop])} : null
  ));
}

const { prop1:val1, prop2:val2 } = transformProps(
  {prop1: "FOO", prop2: "BAR"},
  {prop1: v => v.toLowerCase()} // Transformations to be made
);

console.log(val1, val2);

【讨论】：