对象解构赋值: 拿到后端数据后,对这个数据进行处理,怎样重新命名赋值

在JavaScript开发中,经常需要处理后端返回的对象数据。传统方式逐项赋值效率低下,ES6引入的解构赋值提供了解决方案。通过解构赋值,可以方便地提取对象的键值对并赋值给预先声明或新创建的变量,同时支持设置默认值,避免值为undefined的问题。示例中展示了如何利用解构赋值简化代码,提高代码可读性和维护性。
摘要由CSDN通过智能技术生成

我们开发的过程中,经常会碰到这样的情况:后端传给我们一串数据,我们需要对这个数据进行处理。
如果是这样的一个数据:

let obj = {
    name:'myName',
    age:24,
    weight:'45KG',
    height:'160CM'
}

然后我们需要用变量去保存这些数据,那么我们可能会这么操作:

let name= obj.name,
    age= obj.age,
    weight= obj.weight,
    height= obj.height;

这么做能取到值,这没问题,但是如果对象里面有的键值对很多,怎么办呢?

解构赋值

所以当我们有很多个键值对的时候,这么去取值就显得有点笨拙了。
es6提出来了一个新的东西,叫解构赋值,就是用来处理这件事情的。
那么有了解构赋值之后,上面的需求我们可以这么操作:

let obj = {
    name:'myName',
    age:24,
    weight:'45KG',
    height:'160CM'
}
 
let {name,age,weight,height} = obj;
console.log(name);  //myName

可以看到在这段代码里面我们直接在let关键字后面用花括号包起来一堆变量,然后直接让它们等于obj。
其实这个操作就是从obj里面取出前面花括号里面变量所对应的值,并且对应的赋值给花括号里

  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值