奕玖科技 > 新闻中心 > 技术文章

ES6新特性解构赋值

来源: 奕玖科技 瘦死的猪 | 2022/12/24 17:07:12

我们先看一段解构赋值的代码

Let obj={
  id:1,
  title:"我是标题"
}
Const {id,title}=obj //解构赋值
console.log(id,title)

解构赋值的好处可以让代码量变的更少。以往我们要显示这个obj的参数需要obj.id 那么使用解构可以直接id,title这样就给定义了。

当然上面还有个小技巧可以改变obj里属性的名称

let obj={
  id:1,
  title:"我是标题"
}
const {id:num,title:name}=obj //更改默认的名称
console.log(num,name)

当然我们还可以根据以上的代码进行扩展,比如我们扩展一个form属性来。

let obj={
  id:1,
  title:"我是标题"
}
const {form="奕玖科技"}=obj //扩展一个不存在的属性,并给与默认值
console.log(form)

我们还可以进行嵌套赋值示例如下

let obj={
  id:1,
  title:"我是标题",
  info:{
    aga:10,
    sex:"男"
  }
}
const {id,title,info:{aga,sex}}=obj //aga,sex对应info
console.log(id,title,aga,sex)

除了对象的解构赋值,还支持数据与的解构赋值,这个就比较简单了啊。

let arr=[1,2,3,4]
const [a,b,c,d]=arr
console.log(a,b,c,d)

上面abcd对应1234。

我们可以看到解构可以操作对象也能操作数组,甚至还能数组和对象一起混合来使用如下

let obj={
  id:1,
  title:"标题",
  arr: [1,2,3,4]
}
const {id,title,arr:[a,b,c,d]}=obj
console.log(id,title,a,b,c,d)
栏目导航
相关文章
文章标签
关于我们
公司简介
企业文化
资质荣誉
服务项目
高端网站定制
微信小程序开发
SEO排名推广
新闻动态
行业新闻
技术学院
常见问题
联系我们
联系我们
人才招聘
联系方式
Q Q:24722
微信:24722
电话:13207941926
地址:江西省抚州市赣东大道融旺国际3栋
Copyright©2008-2022 抚州市奕玖科技有限公司 备案号:赣ICP备2022010182号-1