学习参考:http://es6.ruanyifeng.com/#docs/destructuring

     //2017/7/20
/*对象的解构赋值*/
//对象的解构赋值,当变量名的对象的属性名相同时,才能取到正确的值。
/**/
let {foo,bar}={foo:"aaa",bar:"bbb"};
console.log(foo);//aaa
console.log(bar);//bbb //变量名与属性名不相同,必须写成下面这样
/**/
var {foo:baz}={foo:'aaa',bar:'bbb'};
console.log(baz);//aaa
console.log(foo);//es6.html:701 Uncaught ReferenceError: foo is not defined //对象的解构赋值是下面形式的简写.对象的结果赋值的内部机制,是先找到同名属性,然后在赋给对应的变量。真正被赋值的是后者,而不是前者。
/**/
let{foo:foo,bar:bar}={foo:'aaa',bar:'bbb'}; let obj={
p:[
'Hello',
{y:'world'}
]
}; let{p:[x,{y}]}=obj;
console.log(p);//es6.html:714 Uncaught ReferenceError: p is not defined。注意:这里p是模式,不是变量,因此不会被赋值。
console.log(x);//Hello
console.log(y);//world //如果想要p被赋值,可以写成下面的形式
/**/
let obj={
p:[
'Hello',
{y:'world'}
]
}; let{p,p:[x,{y}]}=obj;
console.log(p);//["Hello", Object]
console.log(x);
console.log(y); /**/
var node={
loc:{
start:{
line:1,
colum:5
}
}
};
var {loc,loc:{start},loc:{start:{line}}}=node;
console.log(loc);//Object {start: Object}
console.log(start);//Object {line: 1, colum: 5}
console.log(line);//1。这里对line的属性的解构赋值,只有line是变量,loc和start都是模式,不是变量。 //对象解构指定默认值的条件是,对象的属性值严格等于undefined。
/**/
console.log(null==undefined);//true
console.log(null===undefined);//false var {x=3}={x:undefined};
console.log(x);// var {y=5}={y:null};
console.log(y);//null //解构失败,对象的值等于undefined。
/**/
let {foo}={bar:2};
console.log(foo);//undefined /*注意*/
/**/
let x;
{x}={x:1};//es6.html:763 Uncaught SyntaxError: Unexpected token =
/*上面代码报错的原因是JavaScript引擎会将{x}理解成一个代码块,从而发生语法错,所以以下代码将整个解构赋值语句,放在圆括号里,可以正确执行。*/
/**/
let x;
({x}={x:2});
console.log(x);// //字符串解构赋值
/**/
const [a,b,c,d,e]='hello';
console.log(e);//o let {length:len}='hello';
console.log(len);//5 /*解构赋值的规则是,只要等号右边的值不是对象或数组,就先将其转为对象。由于undefined和null无法转为对象,所以对它们进行解构赋值,都会报错。*/
/**/
let{prop:x}=undefined;
let{prop:y}=null;//es6.html:779 Uncaught TypeError: Cannot match against 'undefined' or 'null'. /*以下三种解构赋值不能使用圆括号*/
//(1)变量声明语句
//(2)函数参数,函数参数也属于变量声明,因此不能带有圆括号。
//(3)赋值语句的模式。不能将整个模式或是部分模式放在圆括号中。 /*可以使用圆括号的情况:赋值语句的非模式部分*/
/**/
let x=1;
let y=2;
[x,y]=[y,x];
console.log(x);//
console.log(y);//

ES6_入门(5)_解构赋值的更多相关文章

  1. ECMAScript 6入门 - 变量的解构赋值

    定义 ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring). 解构赋值不仅适用于var命令,也适用于let和const命令. 解构赋值的规则是,只要 ...

  2. es6入门2--对象解构赋值

    解构赋值:ES6允许按照一定规则从数组或对象中提取值,并对变量进行赋值.说直白点,等号两边的结构相同,右边的值会赋给左边的变量. 一.数组的解构赋值: 1.基本用法 let [a, b, c] = [ ...

  3. ES6入门——变量的解构赋值

    1.数组的解构赋值 以前为变量复制,只能直接指定值.现在ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring). 本质上,这种写法属于模式匹配,只要等 ...

  4. es6基础入门变量的解构赋值

    let [a, b, c] = [1, 2, 3]; let [foo, [[bar], baz]] = [1, [[2], 3]]; foo bar baz let [ , , third] = [ ...

  5. ES6 学习笔记 - 变量的解构赋值

    变量的解构赋值 学习资料:ECMAScript 6 入门 数组的解构赋值 基本用法 可以从数组中提取值,按照对应位置,对变量赋值.这种写法属于"模式匹配". let [a, b, ...

  6. ES6_入门(4)_数组的解构赋值

    //2017/7/14 //变量的解构赋值(解构:Destructuring) //(1)数组的解构赋值 let [a,b,c]=[1,2,3];//模式匹配,只要等号两边的模式相同,左边的变量就会被 ...

  7. ES6入门之变量的解构赋值(二)

    前言 在上一章 ES6入门之let和const命令中我们对ES6的相关语法已经有了初步了解,上一章中我们主要学习了三大部分的内容,let命令的使用,块级作用域,const命令的使用,那么从本篇博客将进 ...

  8. ECMA Script 6_解构赋值_模式匹配

    解构赋值 从数组中提取值,按照对应位置,对变量赋值 只要等号右边的值不是对象或数组,就先将其转为对象. 由于 undefined 和 null 无法转为对象,所以对它们进行解构赋值,都会报错 let ...

  9. ECMAScript6 入门教程记录 变量的解构赋值

    (1)变量的解构赋值 基本用法:ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring). let a = 1; let b = 2; let c = ...

随机推荐

  1. Morley's Theorem

    题解: 计算几何基本操作 注意叉积的时候字母写的顺序 代码: #include <bits/stdc++.h> using namespace std; #define rint regi ...

  2. uva 1232

    题意: 建筑物在多长的部分是最高的成为该建筑物的覆盖度.求所有建筑物的覆盖度之和. 链接: https://vjudge.net/contest/202699#problem/E 题解: 这道题还是挺 ...

  3. python排序算法之冒泡,选择,插入

    1.参考 一本关于排序算法的 GitBook 在线书籍 <十大经典排序算法>,使用 JavaScript & Python & Go 实现 2.冒泡排序:两两比较,互换位置 ...

  4. Android动画模式

    在Android中,有两种动画模式:Tween Animation(渐变动画)和Frame Animation(帧动画).渐变动画是通过对场景里的对象不断做图像变换(平移.缩放.旋转等)来产生动画效果 ...

  5. BZOJ3675 [Apio2014]序列分割 动态规划 斜率优化

    原文链接http://www.cnblogs.com/zhouzhendong/p/8697258.html 题目传送门 - BZOJ3675 题意 对于一个非负整数序列,小H需要重复k次以下的步骤: ...

  6. C#中的 Stream

    目录: 什么是Stream? 什么是字节序列? Stream的构造函数 Stream的重要属性及方法 Stream的示例 Stream异步读写 Stream 和其子类的类图 本章总结 什么是Strea ...

  7. js读取cookie,并利用encrypt和decrypt加密和解密方法

    以下为支持encrypt和decrypt加密和解密方法 eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a ...

  8. 爬虫3 requests基础2 代理 证书 重定向 响应时间

    import requests # 代理 # proxy = { # 'http':'http://182.61.29.114.6868' # } # res = requests.get('http ...

  9. RBF:RBF基于近红外光谱的汽油辛烷值含量预测结果对比—Jason niu

    load spectra_data.mat temp = randperm(size(NIR,1)); P_train = NIR(temp(1:50),:)'; T_train = octane(t ...

  10. Linux学习之源码包安装与脚本安装(十八)

    Linux学习之源码包安装与脚本安装 目录 源码包与RPM包的区别 源码包安装 脚本安装 源码包与RPM包的区别 1.区别 安装之前的区别:概念上的区别 安装之后的区别:安装位置不同 源码包: 开源的 ...