Question

我试图理解ES2015中的解构（ECMAScript 6）。

我想要一个函数处理一些变量并重新分配新变量。

在下面的示例中，我创建了一个初始化foo和bar的函数，以及另一个更改foo和bar的函数。

然后我创建了三个使用foo和bar的函数。其中两个工作，一个不工作。我似乎无法弄明白为什么。

请分享任何见解以帮助我理解。

谢谢！

＆＃13;

function initializeFooBar() {
  let foo = 1,
      bar = 2;
  return {foo, bar};
}
function changeFooBar(f, b) {
  let foo = f*2,
      bar = b*2;
  return {foo, bar};
}
function fooBarWorks() {
  let {foo, bar} = initializeFooBar();
  console.log(foo + bar); // 3
}
function fooBarAlsoWorks() {
  let f = 1,
      b = 2,
      {foo, bar} = changeFooBar(f, b);
  console.log(foo + bar); // 6
}
function fooBarDoesntWork() {
  let {foo, bar} = initializeFooBar();
  {foo, bar} = changeFooBar(foo, bar);  // causes parsing error
  console.log(foo + bar);
}
fooBarWorks(); // writes 3 to console
fooBarAlsoWorks(); // writes 6 to console
fooBarDoesntWork(); // doesn't run due to "parsing error unexpected tolken ="

＆＃13;

Answer 1

您需要更改：

{foo, bar} = changeFooBar(foo, bar);

为：

({foo, bar} = changeFooBar(foo, bar));

因为在这种情况下{被解释为代码块的开头。

使用()围绕作业消除了{的含义歧义。

根据MDN documentation：

当使用没有声明的对象文字解构赋值时，赋值语句周围的( .. )是必需的语法。

{a, b} = {a:1, b:2}不是有效的独立语法，因为{a, b}开启   左侧被视为块而不是对象字面。

但是，({a, b} = {a:1, b:2})和var {a, b} = {a:1, b:2}
一样有效

解构给出解析错误

1 个答案: