ES6学习-5 解构赋值(2)对象的解构赋值
2024-10-19 10:08:05
啥也不说,先举个栗子:
1 let { myname, myage } = { myage: 18, myname: "郭郭" };
2 console.log(myname) //郭郭
3 console.log(myage) //18
很简单的例子,主要是为了说明对象解构赋值与数组解构赋值的不同。数组解构赋值时,变量是按次序排列的,变量的取值由它的位置决定;而对象解构赋值时,变量没有次序,变量名只要与属性同名,就才能取到正确的值。
那如果变量与对象的属性不同名,可以应用解构赋值吗?答案是肯定的,就是麻烦一点点,举栗子:
1 let {myage:youage,myname:youname}={ myage: 18, myname: "郭郭" };
2 console.log(youname) //郭郭
3 console.log(youage) //18
我们用对象的 myage 属性给 youage变量赋了值,用 myname 属性给 youname 赋了值,变量名与对象的属性名不一致时,可以 在变量的前边加上 "属性名:",用指定属性名来给变量赋值。
同数组解构赋值一样,对象的解构赋值也可以设置默认值,不再多说,举几个简单的栗子吧:
1 let { myname, myage=16 } = {myname: "郭郭" };
2 console.log(myname) //郭郭
3 console.log(myage) //16 没有对应的属性,所以使用了默认值
4
5 let { myname, myage=16 } = {myname: "郭郭",myage:39 };
6 console.log(myname) //郭郭
7 console.log(myage) //39 有对应的属性,所以默认值不起作用
已经声名的变量,应用解构赋值:
1 let myname,myage;
2 { myname, myage } = { myage: 18, myname: "郭郭" }; //报错啊,报错啊,why??
3 ({ myname, myage } = { myage: 18, myname: "郭郭" }) //外面加对括号就好了。
因为 JavaScript 引擎会将{...}
理解成一个代码块,从而发生语法错误。只要不将大括号写在行首,避免 JavaScript 将其解释为代码块,就能解决这个问题。
奇怪而有意思的用法:
1 const { log } = console; //把console 对象的 log 方法解构给 log变量。
2 log('hello') // 相当于调用了 console.log 控制台会输出hello
最新文章
- magento的url中 去掉多余的目录层级
- kmp模板,线性完成pos
- codevs1091 传染病控制
- 约束优化方法之拉格朗日乘子法与KKT条件
- effective java 笔记1--序言
- cocos2d-x lua 实现单例(管理类)
- leptonica 学习笔记1
- cocos2d与cocos2d-X中的draw和update
- Linux企业级项目实践之网络爬虫(8)——认识URL
- 关于C# 中的布尔运算符 ";&;"; ";|” 与 其类似的条件布尔运算符 ";&;&;"; ";||"; 区别说明。
- 修改GIT密码
- pyinstaller安装配置
- mysql存储过程详解 mysql存储过程和函数
- verilog 代码分析与仿真
- 机器学习随笔01 - k近邻算法
- Codeforces 718C solution
- TensorFlow进阶(二)---张量的操作
- C# 3.0 / C# 3.5 系统内置委托
- (P2022 有趣的数)||(zoj Little Sub and Mr.Potato's Math Problem)(思维)
- android 安装调试第三方应用失败