使用不是有效变量名称的属性名进行对象解构

使用不是有效变量名称的属性名进行对象解构(Object destructuring with property names that are not valid variable names)
JavaScript IT屋 2017/8/3 19:48:36

百度翻译此文 有道翻译此文
问 题

Does anyone know if you can use object destructuring with spaces in the property name? Maybe this cannot be done and I realize the JavaScript notation is incorrect but I cannot change the server json response.

var obj1 = {name: ‘Mr Smith’, age: 21};
//destructure
var {name, age} = obj1;
//name=‘Mr Smith’ and age=21
This works as expected.

But when I have the following object structure can I use object destructuring or not?

var obj2 = {“my name”: “Mr Jones”, age: 22};
var {‘my name’, age} = obj2;
If this is not possible It would be nice if I could assign the variable with some sort of syntax like ‘as’…

var {‘my name’ as name, age} = obj2; //name=‘Mr Jones’;
Thanks

解决方案
You can assign it a vali

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
### 回答1: 要从一个大对象解构出小对象,可以使用ES6的解构语法。假设有一个大对象如下: ``` const obj = { name: 'Alice', age: 25, gender: 'female', address: { street: '123 Main St', city: 'Anytown', state: 'CA', zip: '12345' } }; ``` 要从中解构出一个小对象,比如只包含`name`和`age`属性,可以这样做: ``` const { name, age } = obj; const smallObj = { name, age }; ``` 这将会从`obj`中解构出`name`和`age`属性,并将它们赋值给`smallObj`对象的同属性。现在`smallObj`就只包含`name`和`age`属性了。 ### 回答2: 在Vue2中,可以使用解构赋值的方式从一个大对象中提取需要的小对象。 假设有一个大对象`bigObj`,包含多个属性,我们希望提取其中的若干个属性值作为一个小对象`smallObj`,可以使用如下方法: 1. 使用解构赋值语法,根据需要提取的属性,将其赋值给对应的变量名。例如,要提取`bigObj`中的`prop1`和`prop2`属性,赋值给`smallObj`的`prop1`和`prop2`变量,可以使用以下代码: ```js const { prop1, prop2 } = bigObj; const smallObj = { prop1, prop2 }; ``` 解构赋值会将`bigObj.prop1`和`bigObj.prop2`的值分别赋给`prop1`和`prop2`变量。然后,我们可以使用这些变量创建`smallObj`小对象。 2. 如果希望直接将提取到的属性赋给一个已存在的对象,可以使用对象展开运算符`...`。例如: ```js const smallObj = { ...bigObj }; ``` 这样,`smallObj`将包含`bigObj`中所有属性的复制。注意,这种方式会直接复制属性值,而不是通过引用共享属性值。 需要注意的是,解构赋值是基于属性进行匹配的,所以大对象中的属性需要与小对象中的属性一一对应,否则无法正确提取属性值。 ### 回答3: 在Vue2中,解构出小对象可以使用ES6的对象解构语法。通过对象解构,我们可以将一个大对象中的属性解构出来,并赋值给多个小对象。下面是一个示例: 假设有一个大对象data,如下所示: ``` const data = { id: 1, name: 'Vue2', version: 2.6, author: 'Evan You', license: 'MIT' }; ``` 如果想从这个大对象解构出小对象id和version,可以这样做: ```js const { id, version } = data; console.log(id); // 输出: 1 console.log(version); // 输出: 2.6 ``` 通过大对象data的解构赋值,我们可以直接将data中的id和version属性解构出来,并分别赋值给id和version变量。 需要注意的是,解构对象属性必须和大对象中的属性保持一致。这里的大对象data中有id和version属性,所以我们在解构赋值的时候使用了相同的属性。 除了解构出两个属性外,我们也可以同时解构出多个属性,如下所示: ```js const { name, author, license } = data; console.log(name); // 输出: Vue2 console.log(author); // 输出: Evan You console.log(license); // 输出: MIT ``` 通过这种方式,我们可以根据需要从一个大对象解构出指定的小对象,以方便后续使用

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

叶子 ✪ω✪

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值