javascript - 我可以预先声明变量来解构对象的赋值吗?

标签 javascript ecmascript-6 babeljs destructuring

背景

当我尝试使用数组解构赋值时,我能够预先声明我的变量:

let a, b, c;
let arr = [1, 2, 3, 4, 5];
[a, b, c] = arr;

console.log(a) // logs 1
console.log(b) // logs 2
console.log(c) // logs 3

这很好地通过了 Babel 编译器。

但是,当我尝试对对象执行相同操作时,出现错误

let a, b, c
let obj = {cat: 'meow', dog: 'woof', mouse: 'squeak'};
{cat: a, dog: b, mouse: c} = obj;

console.log(a) // I want this to log 'meow'
console.log(b) // I want this to log 'woof'
console.log(c) // I want this to log 'squeak'

问题

这是 ES6 或 Babel 的怪癖/问题吗?如果这是 ES6 故意的,为什么与处理数组的方式不同?

注意

据我了解,替换 varlet意味着我不需要预先声明我的变量并且具有 let inline 是有效的(而且,我相信,通常是首选)。我想了解实现之间的差异,而不是“根本不要那样做”的答案。

最佳答案

当你解构一个对象时,

  1. 您需要使用与对象中的键相同的变量名称。只有这样你才会得到一一对应,并且值会被正确地解构。

  2. 如果不使用声明语句,则需要将整个赋值放在括号中,否则左侧表达式中的对象文字将被视为一个 block ,并且您将收到语法错误。

<小时/>

所以你的固定代码看起来像这样

'use strict';
let cat, dog, mouse;
let obj = {cat: 'meow', dog: 'woof', mouse: 'squeak'};
({cat, dog, mouse} = obj);     // Note the `()` around

这相当于

'use strict';
let obj = {cat: 'meow', dog: 'woof', mouse: 'squeak'};
let {cat, dog, mouse} = obj;

关于javascript - 我可以预先声明变量来解构对象的赋值吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34836126/

相关文章:

javascript - 如何在 ES6 中使用 React 编写交互式 d3 组件?

javascript - 如何提高reactjs在移动端的初始渲染性能?

javascript - webpack v2中如何实现全局 promise polyfill?

javascript - Node 表达 JSON-Schema 多字段验证

javascript - 传递联合类型的 Prop 以 react 需要联合中的一种类型的子组件

Javascript:[] = 5,没有语法错误?为什么?

css - 如何在不使用任何对象 webpack sass loader 的情况下按原样使用 sass 类名?

javascript - 语法错误 : Unexpected token export

javascript - Joomla 更新后一个文件出现 ERR_CONTENT_DECODING_FAILED

JavaScript "Uncaught TypeError: object is not a function"