ES6(二)解构赋值详解
详解一下之前的解构赋值
①解构赋值中的“...”
let [a,...b]= [1];
b // [] ...代表变量b去匹配剩余的所有元素返回一个数组 ,匹配不到时返回[]
//注意:"...b"只能放在最后
②解构赋值的等号两边的数据类型必须一样
即:
let [] = [] 或者 let {} = {}
但是:Set结构也允许使用数组进行解构赋值
let [a,b]= new Set([1,2,3,4])
a //
b //
技巧: 如果你不确定该结构是否能够解构赋值,判断其是否有Iterator接口就可以啦!判断方法如下:
function* fibs() {
var x= 0;
var y= 1;
while (true) {
yield x;
[x, y] = [y, x+ y];
}
} var [a, b, c, d, e, f] = fibs();
f//
// fibs是一个Generator函数,原生具有Iterator接口。解构赋值会依次从这个接口获取值。
③解构赋值不仅适用于 let / const也适用于var指令
④解构赋值允许添加默认值
let [a = 4] = []
a //
(解构赋值的匹配模式是===)注:如果解构赋值不严格等于 undefined 的话默认值不会生效
let [a = 4]=[undefined]
a //4
let [b = 4]=[null]
b//null
⑤我自己犯过的错
let [x = y, y = 1] = []; //报错 因为x=y时y还没有被声明 不会被提升!!! 牢记
var [a = b, b = 1] = []; // a===undefined b === 1
对象的解构赋值
①对象不像数组那样有顺序所以,对象的解构赋值是按照‘键’的方式匹配的
var { foo: baz } = { foo: 'aaa', bar: 'bbb' };
baz // 'aaa' foo是匹配模式 baz是变量
②对象和数组的嵌套 如果看明白一下例子也就差不多了
var obj = {
p: [
'Hello',
{ y: 'World' }
]
}; var { p: [x, { y }] } = obj; //p是匹配模式 [x , { y }]是值 然后再看数组中的每一项
x // "Hello"
y // "World"
③不像数组那样不存在时返回undefined 对象是会报错的
字符串的解构赋值
const [a, b, c, d, e] = 'hello';
a // h
b // e
c // l
let {length : len} = 'hello';
len // 5 匹配的是字符串的length属性
干货:用途
(1)交换变量的值
[a,b]=[b,a]
(2)从函数返回多个值
function example() {
return [1, 2, 3];
}
var [a, b, c] = example();
(3)函数参数的定义
function f([x, y, z]) { ... }
f([1, 2, 3]);
(4)提取JSON数据
var jsonData = {
id: 42,
status: "OK",
data: [867, 5309]
}; let { id, status, data: number } = jsonData;
(5)函数参数的默认值
function f([x = 1, y = 2 , z]) { ... }
(6)遍历Map结构
var map = new Map();
map.set('first', 'hello');
map.set('second', 'world'); for (let [key, value] of map) {
console.log(key + " is " + value);
}
// first is hello
// second is world
// 获取键名
for (let [key] of map) {
// ...
}
// 获取键值
for (let [,value] of map) {
// ...
}
(7)输入模块的指定方法
const { SourceMapConsumer, SourceNode } = require("source-map");
ES6(二)解构赋值详解的更多相关文章
- ES6 解构赋值详解
解构赋值是对赋值运算符的扩展,可以将属性/值从对象/数组中取出,赋值给其他变量. 一.数组的解构赋值 1.基本用法 只要等号两边的模式相同,左边的变量就会被赋予对应的值. let [a, [[b], ...
- ES6解构赋值详解
文章转载自:http://www.zhufengpeixun.cn/article/167 解构赋值(destructuring assignment)语法是一个 Javascript 表达式,这种语 ...
- 【ES6 】ES6 解构赋值--数组解构赋值
定义 ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构 数组的解构赋值 以前,为变量赋值,只能直接指定值. let a = 1; let b = 2; let c = 3; ...
- 【ES6 】ES6 解构赋值--对象解构赋值
对象的解构与数组有一个重要的不同. 数组的元素是按次序排列的,变量的取值由它的位置决定 而对象的属性没有次序,变量必须与属性同名,才能取到正确的值. 基本用法 如果解构失败,变量的值等于undefin ...
- 001-es6变量声明、解构赋值、解构赋值主要用途
一.基本语法 1.1.声明变量的六种方法 参看地址:http://es6.ruanyifeng.com/#docs/let let:局部变量,块级作用域,声明前使用报错 var:全局变量,声明前使用 ...
- ES6入门之变量的解构赋值(二)
前言 在上一章 ES6入门之let和const命令中我们对ES6的相关语法已经有了初步了解,上一章中我们主要学习了三大部分的内容,let命令的使用,块级作用域,const命令的使用,那么从本篇博客将进 ...
- ES6笔记(3)-- 解构赋值
系列文章 -- ES6笔记系列 解构赋值,即对某种结构进行解析,然后将解析出来的值赋值给相关的变量,常见的有数组.对象.字符串的解构赋值等 一.数组的解构赋值 function ids() { ret ...
- es6入门2--对象解构赋值
解构赋值:ES6允许按照一定规则从数组或对象中提取值,并对变量进行赋值.说直白点,等号两边的结构相同,右边的值会赋给左边的变量. 一.数组的解构赋值: 1.基本用法 let [a, b, c] = [ ...
- 《ES6标准入门》(阮一峰)--3.变量的解构赋值
1.数组的解构赋值 基本用法 ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring). 以前,为变量赋值,只能直接指定值. let a = 1; l ...
随机推荐
- CentOS6.3编译安装Memcached
要用到如下源码包: /usr/local/src/memcached/libevent-2.0.21-stable.tar.gz /usr/local/src/memcached/memcached- ...
- CentOS6.3 编译安装LAMP(2):编译安装 Apache2.4.6
Apache官方说: 与Apache 2.2.x相比,Apache 2.4.x提供了很多性能方面的提升,包括支持更大流量.更好地支持云计算.利用更少的内存处理更多的并发等.除此之外,还包括性能提升.内 ...
- HeapSort 堆排序 基于伪代码实现
此文原创, http://www.cnblogs.com/baokang/p/4735431.html ,禁止转载 GIF 动态图 伪代码 /* From Wikipedia, the free en ...
- TCP/IP四层模型
转自:http://www.cnblogs.com/BlueTzar/articles/811160.html ISO制定的OSI参考模型的过于庞大.复杂招致了许多批评.与此对照,由技术人员自己开发的 ...
- tornado 第二种路由方法(装饰器)
#!/usr/bin/env python # _*_coding:utf-8 _*_ import tornado.ioloop import tornado.web application = t ...
- 最简单的js确认框!
随便举个栗子~ function bremove() { if (ids == "") {//触发函数,如果值是空弹框 alert("您还没有选择任何数据.") ...
- chrome浏览器跨域设置
1.新建快捷方式,在目标那里的路径后面跟上如下参数 "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" -- ...
- java5
1:final关键字(掌握) (1)是最终的意思,可以修饰类,方法,变量. (2)特点: A:它修饰的类,不能被继承. B:它修饰的方法,不能被重写. C:它修饰的变量,是一个常量. (3)面试相关: ...
- unlink和close关系
今天看到nginx用文件锁实现互斥的实现方案时,发现,unlink文件后还可需用fd,很是纳闷!于是搜索到此文,并自测了下,涨姿势了~分享给大家~ 原理: 每一个文件,都可以通过一个struct st ...
- MySql增加字段、删除字段、修改字段名称、修改字段类型
1.增加一个字段 alter table user add COLUMN new1 VARCHAR(20) DEFAULT NULL; //增加一个字段,默认为空 alter table user a ...