Es6 -- 对象的解构赋值

解构不仅可以用于数组,还可以用于对象。

var {foo, bar} = {foo: "aaa", bar: "bbb"};
console.log(foo); //aaa
console.log(bar); //bbb

 对象的解构与数组有一个重要的不同。数组的元素是按次序排列的,变量的取值由它的位置决定;而对象的属性没有次序,变量必须与属性同名,才能取到正确的值。

var {bar, foo} = {foo: "aaa", bar: "bbb"};
console.log(foo) // aaa
console.log(bar) // bbb

var {baz} = {foo: "aaa", bar: "bbb"};
console.log(baz); // undefined

以上的代码中的第一个例子,等号左边两个变量的次序与等号右边两个同名属性不一致。但是对取值完全没有影响。第二个例子中,变量没有相应的同名属性,导致取不了值,最后等于undefined.

如果变量名与属性名不一致,必须写成下面这样。

var {foo: baz} = {foo: "aaa", bar: "bbb"};
console.log(baz); // aaa
let obj = {foo: "aaa", bar: "bbb"};
let {foo: f, bar: b} = obj;
console.log(f); // aaa
console.log(l); // bbb

这实际上说明,对象的解构赋值是以形式的简写

var {foo: f, bar: b} = {foo: "aaa", bar: "bbb"};

  

原文地址:https://www.cnblogs.com/qjuly/p/9011678.html

时间: 2024-11-03 22:22:53

Es6 -- 对象的解构赋值的相关文章

ES6变量的解构赋值(二)对象的解构赋值

前面我们知道,数组的结构赋值需要按顺序进行赋值, let [a,,c] = [1,2,3] console.log(a);//1 console.log(c);//3 let [a,b] = [1];console.log(a);//1console.log(b);//undefined 而对象的解构赋值则是通过对象属性进行赋值,不需要按照顺序进行,而无法匹配的则为undefined let {a,b,c}={b:1,a:2}; console.log(a);//2 console.log(b)

es6 变量的解构赋值

一.数组的解构赋值 数组解构赋值,索引很重要,即顺序很重要 1.解构[1,2,3] //把1,2,3分别赋值给a,b,c var [a,b,c]=[1,2,3]; console.log(a+' | '+b+' | '+c);//1 | 2 | 3 2.更复杂,更强大的赋值,解构[1,[2,3]] //把1,2,3分别赋值给a,b,c var [a,[b,c]]=[1,[2,3]]; console.log(a+' | '+b+' | '+c);//1 | 2 | 3 3.跳着赋值 //把1赋值

ES6 - Note2:解构赋值

ES6的解构赋值就是利用模式匹配从按照一定模式的数组或者对象中提取值赋值给变量. 1.数组的解构赋值 在ES6以前,变量的赋值是直接指定的,以后可以这么来写,如下所示 let [a,b,c] = [1,2,3]; console.log(a,b,c) 1 2 3 解构赋值只要等号两边的模式一致,便可解析成功,如下所示 var [d,[f,g]] = [3,[4,5]]; console.log(d,f,g); 3 4 5 ----------------------------- var [,,

对象的解构赋值

let { foo, bar } = { foo: "aaa", bar: "bbb" }; foo // "aaa" bar // "bbb" 对象的解构与数组有一个重要的不同.数组的元素是按次序排列的,变量的取值由它的位置决定:而对象的属性没有次序,变量必须与属性同名,才能取到正确的值. 如果变量名与属性名不一致,必须写成下面这样. let { foo: baz } = { foo: 'aaa', bar: 'bbb' }

ES6数组的解构赋值( 下)

对象的解构赋值 对象的解构赋值跟数组的解构赋值很类似,我们来看一段小代码: var { a,b,c} = {"a":1,"b":2,"c":3}; console.log(a);//结果:a的值为1 console.log(b);//结果:b的值为2 console.log(c);//结果:c的值为3 这段例子的代码是不是跟数组的解构赋值很相似,只不过是数组换成了对象.但是两者有一个不同的地方,我们对上面的代码稍做修改: var { a,b,c

对象 与 解构赋值

对象 定义:在javascript中,对象就是拥有属性和方法的无需数据集合 创建对象: 1.object构造函数 var person=new object(); 2.字面量方式 var person = {}; 对象的属性: 对象属性的分类 1.数据属性:一般用于储存数据值 2.访问器属性:不包含数据值,多用于get/set操作 定义对象的数据属性 通过点运算符.来操作一个对象的属性 person.name="zhangsan"; 通过方括号[]操作一个对象的属性 person[&q

ES6变量的解构赋值

// -------------------------------------------------------------------/** * 基本概念: * 本质上就是一种匹配模式,只要等号两边的模式相同,那么左边的变量就可以 * 被赋予对应的值. * 结构赋值主要分为: * 1 数组的解构赋值 * 2 对象的结构赋值 * 3 基本类型的解构赋值 */// let a = 1;// let b = 2;// let c = 3; // let [a, b, c] = [1, 2, 3]

ES6相关特性(解构赋值)

解构赋值:本质上是一种匹配模式,等号两边的模式相同,则左边的变量可以被赋予对应的值. 注意:null & undefined 不能解构赋值!!! 数组的解构赋值: let [a,[[b],c]]=[1,[[2],3]]; // a=1,b=2,c=3; let [,,c]=[1,2,4]; // c=4; let[x]=[]; // let x; // x=undefined; 可以指定默认值: let [y=1]=[]; // y=1; 对象的解构赋值(找同名属性): let {a,b}={b

ES6中的解构赋值

在解释什么是解构赋值前,我们先来看一下, ES5 中对变量的声明和赋值. var str = 'hello word'; 左边一个变量名,右边可以是字符串,数组或对象. ES6 中增加了一种更为便捷的赋值方式.称为 Destructuring .好像大家普遍翻译为解构.解构赋值允许我们将数组或对象的属性赋予给任何变量,该变量的定义语法与数组字面量或对象字面量很相似.举个例子可以直观的说明. let [speak, name] = ['hello', 'destructuring']; conso