ES6解构赋值，动态赋值

Question

let text, value;
if (typeof f == 'string') {
    text = value = f;
} else {
    let {
        text, value
    } = f;
}

这样做会创建两个新的变量（来自于else），但如果我这样写：

let text, value;
if (typeof f == 'string') {
    text = value = f;
} else {
    {
        text, value
    } = f;
}

我收到了一个语法错误。这里最好的解决方法是什么？

- benhowdle89

---

或者，const {text, value} = (typeof f === 'string') ? {text: f, value: f} : f; - loganfsmyth

Answer 1

你需要在赋值语句周围加上括号：

let text, value;
if (typeof f == 'string') {
    text = value = f;
} else {
    ({                // ( at start
        text, value
    } = f);           // ) at end
}

(在 Babel 上的实时副本.)

你需要这些括号的原因和需要使用括号或类似物来立即调用函数一样：告诉解析器它应该期望一个表达式而不是一个语句。没有括号时，当它遇到{时，它会认为那是一个块的开头。但与函数不同，它必须是括号，而不是前置一元运算符+、!等像这样：

let text, value;
if (typeof f == 'string') {
    text = value = f;
} else {
    +{                 // <== Doesn't work like it does with IIFEs
        text, value
    } = f;
}

- T.J. Crowder

---

好的回答。小注：括号只需要包围花括号；赋值本身可以在外面。 - Zirak

@Zirak：不，括号需要放在整个赋值表达式的周围；否则会出错：[bit.ly链接到Babel repl（太长无法在评论中粘贴）]（http://bit.ly/1HGPapN）。他们甚至有一个特定的消息：“您正在尝试分配给带括号的表达式，例如。而不是`({a}) = 0使用({a} = 0)”如果您考虑一下，这一点并不令人惊讶：只有在{}`周围有括号时，它才看起来像是带括号的对象初始化程序（因为在ES6中，您可以使用该简写形式）。 - T.J. Crowder

不知道 Babel，谢谢。 - Royi Namir

@RoyiNamir： :-) 从上面的链接中不太容易看出来，但那只是REPL工具。主要而言，Babel 是一个非常强大的转换器。你可以使用大部分ES6的代码并将其转换为ES5。当然，使用转换器可能会影响效率... - T.J. Crowder