ES6 对象的解构赋值
对象的解构赋值
解构不仅可以用于数组,还可以用于对象。
let {foo,bar} = {foo:"aaa",bar:"bbb"};
console.log(foo); // aaa
console.log(bar); // bbb
这里的foo,bar一定要对应。
对象的解构与数组有一个重要的不同。数组的元素是按次序排列的,变量的取值由它的位置决定;而对象的属性没有次序,变量必须与属性同名,才能取到正确的值。
真正被赋值的是后者,而不是前者。
let { foo: baz } = { foo: "aaa", bar: "bbb" };
baz // "aaa"
foo // error: foo is not defined
上面代码中,foo是匹配的模式,baz才是变量。真正被赋值的是变量baz,而不是模式foo。
与数组一样,解构也可以用于嵌套结构的对象。
let obj = {
p: [
'Hello',
{ y: 'World' }
]
};
let { p: [x, { y }] } = obj;
console.log(x) // "Hello"
console.log(y) // "World"
对象的解构也可以指定默认值。
var {x = 3} = {};
x // 3
var {x, y = 5} = {x: 1};
x // 1
y // 5
var {x: y = 3} = {};
y // 3
var {x: y = 3} = {x: 5};
y // 5
var { message: msg = 'Something went wrong' } = {};
msg // "Something went wrong"
默认值生效的条件是,对象的属性值严格等于undefined。
var {x = 3} = {x: undefined};
x // 3
var {x = 3} = {x: null};
x // null
ES6 对象的解构赋值的更多相关文章
- es6☞对象的解构赋值
变量必须与属性同名 let {name, age} = {name: 'wang', age: 22}; console.log(name, age); //wang 22 let {name} = ...
- ES6变量的解构赋值(二)对象的解构赋值
前面我们知道,数组的结构赋值需要按顺序进行赋值, let [a,,c] = [,,] console.log(a); console.log(c);//3 let [a,b] = [1];consol ...
- ES6学习-5 解构赋值(2)对象的解构赋值
啥也不说,先举个栗子: 1 let { myname, myage } = { myage: 18, myname: "郭郭" }; 2 console.log(myname) / ...
- ES6 - Note2:解构赋值
ES6的解构赋值就是利用模式匹配从按照一定模式的数组或者对象中提取值赋值给变量. 1.数组的解构赋值 在ES6以前,变量的赋值是直接指定的,以后可以这么来写,如下所示 let [a,b,c] = [1 ...
- ES6 变量的解构赋值
数组的解构赋值 var [a,b,c] = [1,2,3]; 左边是变量,右边是值,根据数据结构一一对应 只要等号两边的模式相同,左边的变量就会被赋予右边对应的值,必须模式相同 如果等号 ...
- ES6 - 变量的解构赋值学习笔记
变量的解析赋值 数组的解析赋值 es6允许按照一定的模式,从数组和对象中提取值,对变量进行赋值,这就称为解构. var a = 1; var b = 2; var c = 3; //在es6中允许写成 ...
- ES6的变量解构赋值
前 言 ES6 解构赋值: ES6允许按照一定模式从数组和对象中提取值,然后对变量进行赋值,这被称为解构. 1.1 数组的结构赋值 1.1.1基本用法 JS中,为变量赋值直接指定.例如下面代码: ...
- es6学习笔记--解构赋值
昨天学习了es6语法中解构赋值,解构赋值在声明中和函数传参提高了灵活性和便捷性,值得掌握该语法. 概念: ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构. 数组的解构 ...
- ES6中的解构赋值
在解释什么是解构赋值前,我们先来看一下, ES5 中对变量的声明和赋值. var str = 'hello word'; 左边一个变量名,右边可以是字符串,数组或对象. ES6 中增加了一种更为便捷的 ...
随机推荐
- BZOJ1902: Zju2116 Christopher
$n \leq 10^{100}$,问$C_n^m,0<=m<=n$有多少是质数$p \leq 1e7$的倍数. 一样,套高精度的题,只有战胜他才能鄙视他. 但是我TM被他鄙视了一上午!! ...
- jQuery事件委托之Safari失效的解决办法--摘抄
什么是事件委托 事件委托是Jquery中一种事件绑定的方式,不同于常见的事件绑定方式将事件绑定在目标元素上,而是将事件绑定在父级元素上通过事件冒泡来执行绑定函数. //常见的事件绑定(Jquery) ...
- android 布局之LinearLayout(学习一)
一,View localView = mRadioGroup_content.getChildAt(i);指定自定义菜单栏的点击格,如child3 其中:mRadioGroup_content = ( ...
- android调用 .net webService
package com.rockcheck.mes; import android.os.AsyncTask; import android.support.v7.app.AppCompatActiv ...
- BZOJ——1610: [Usaco2008 Feb]Line连线游戏
http://www.lydsy.com/JudgeOnline/problem.php?id=1610 Time Limit: 5 Sec Memory Limit: 64 MBSubmit: 2 ...
- Mongdb和Spring的整合
我自己的实现: 代码:https://github.com/littlecarzz/spring-data-mongodb 我使用的是spring-data-mongodb包,因为springboot ...
- HSSF生成excel文件损坏
一开始我的代码是这样的: 然后打开创建的好的excel文件出现下面的问题:,, 这里改下代码就行,其实也不用改,添加下sheet就行,就是一开始是空的,没sheet,所以可能打不开,现在至少要创建一个 ...
- 12/10 C语言程序设计竞赛 后五题
Title(题目) 小朋友顺逆报数 Problem ID(题目编号) (题目添加成功后由系统自动生成) Time Limit(运行时间限制) S(秒) Memory Limit(内存限制) MByte ...
- vSphere 6.5支持512e,NVMe SSD呢?
原创 2017-01-12 朱朋博 金笑雨 企事录 2016年底,VMware终于宣布,从vSphere 6.5开始支持512e扇区格式了. 这当然是好事.不过,不黑不舒服斯基说:原来以前的版本连51 ...
- Shiro源代码分析之两种Session的方式
1.Shiro默认的Session处理方式 <!-- 定义 Shiro 主要业务对象 --> <bean id="securityManager" class=& ...