JS ES6的变量的结构赋值
变量的结构赋值用户很多
1、交换变量的值
let x = 1;
let y = 2;
[x,y] = [y,x]
上面的代码交换变量x和变量y的值,这样的写法不仅简洁,易读,语义非常清晰
2、从函数返回多个值
函数只能返回一个值,如果要返回多个值,只能讲他们放在数组或者对象里返回。了解解构赋值,取值这些值非常方便
//返回一个数组
function example(){
return [1,2,3];
}
let [a,b,c] = example();
[a,b,c]; //[1,2,3]
//返回一个对象
function example(){
return {
foo:1,
bar:2
};
}
let {foo,bar} = example();
foo; //1
bar; //2
3、函数参数的定义
解构赋值可以方便的讲一组参数与变量名对应起来。
//参数是一组有次序的值
function f([x,y,z]){
console.log(x,y,z);
}
f([1,2,3]); //1,2,3
//参数是一组无次序的值
function func({x,y,z}){
console.log(x,y,z);
}
func({z:3,y:2,x:1}); //1,2,3
4、提取JSON数据
解构赋值对提取JSON对象中的数据尤其有用
let jsonData = {
id:42,
status:"OK",
data:[123,456]
} ;
let {id,status,data:number} = jsonData;
console.log(id,status,number); //42 "OK" (2) [123, 456]
5、函数参数的默认值
、、、
6、遍历Map结构
任何部署了Iterator接口的对象都可以使用for... of循环遍历。Map结构原生支持Iterator接口,配合变量的解构赋值获取名和键值就非常方便。
var map = new Map();
map.set('first','hello');
map.set('second','world'); for(let [key,value] of map){
console.log(key,value);
}
//first hello
//second world
如果只想获取键名,或者只想获取键值,可以这样写。
//获取键名
for(let [key] of map){
console.log(key);
}
//first
//second
//获取键值
for(let [,value] of map){
console.log(value);
}
//hello
//world
7、输入模块的指定方法
加载模块时,往往需要指定输入的方法。解构赋值使得输入语句非常清晰。
const {a,b} = require('source-map');
JS ES6的变量的结构赋值的更多相关文章
- ES6—— 变量的结构赋值
变量的结构赋值.基本概念: 本质上就是一中匹配模式,只要等号两边的模式相同,那么左边的变量就可以被赋予对应的值: 1.数组的结构赋值. 2.对象的结构赋值. 3.基本类型的结构赋值. let [a,b ...
- 【ES6基础】let、const命令和变量的结构赋值
ES5声明变量(2):var .function ES6声明变量(6):var.function.let.const.import和class 1.let命令和const命令 (1)let和const ...
- ES6的变量解构赋值
前 言 ES6 解构赋值: ES6允许按照一定模式从数组和对象中提取值,然后对变量进行赋值,这被称为解构. 1.1 数组的结构赋值 1.1.1基本用法 JS中,为变量赋值直接指定.例如下面代码: ...
- ES6 变量的结构赋值
1.数组的解构赋值 a.基本用法:(‘模糊匹配’) let [a, b, c] = [1, 2, 3]; a b c b.嵌套数组结构例子: let [x, , y] = [1, 2, 3]; x y ...
- ES6 变量的结构赋值用途(实用技巧)
1.交换变量的值 let x=1; let y=2; [x,y]=[y,x];//x=2,y=1 2.从函数返回多个值 函数只能返回一个值,如果要返回多个值,只能将它们放在数组或者对象里返回,有了解构 ...
- ES6必知,变量的结构赋值。
对象和数组时 Javascript 中最常用的两种数据结构,由于 JSON 数据格式的普及,二者已经成为 Javascript 语言中特别重要的一部分. 在编码过程中,我们经常定义许多对象和数组,然后 ...
- ES6 对象增强和结构赋值
The enhanced Object literals: ES6 has added some new syntax-based extensions to {} object literal fo ...
- ES6中变量的解析赋值的用途
变量的解构赋值用途很多. (1)交换变量的值 let x = 1; let y = 2; [x, y] = [y, x]; 上面代码交换变量x和y的值,这样的写法不仅简洁,而且易读,语义非常清晰. ( ...
- 【es6】变量解构赋值
1.数组解构赋值 let [a,b,c]=[1,2,3];//数组解构赋值,注意:左右两边格式需一致 let [a,b]=[1,2,3];//不完全解构,取位置靠前的值 let [a=1,b]=[un ...
随机推荐
- logrotate 进行nginx日志分割
http://www.williamsang.com/archives/1254.html 日志分割常用方法: 自己写脚本分割 使用linux自带的logrotate 前者灵活,可以应对各种需求,自定 ...
- yii2.0 集成/引入第三方sdk
首先下载自己要使用的sdk包放到vendor文件夹下面:我以接入ping++为例子如下: 然后在入口文件出引入文件的配置文件: 下面就是在控制器使用了: 下面就可以根据自己要使用的的文件以及方法正常调 ...
- 【欧拉函数】BZOJ2705: [SDOI2012]Longge的问题
Description Longge的数学成绩非常好,并且他非常乐于挑战高难度的数学问题.现在问题来了:给定一个整数N,你需要求出∑gcd(i, N)(1<=i <=N). Solut ...
- CF_229E_Gift_概率DP+组合数学
CF_229E_Gift_概率DP+组合数学 题目描述: 很久很久以前,一位老人和他的妻子住在蔚蓝的海边.有一天,这位老人前去捕鱼,他捉到了一条活着的金鱼.鱼说:“噢,老渔人!我祈求你放我回到海里,这 ...
- BZOJ_1196_[HNOI2006]公路修建问题_kruskal+二分答案
BZOJ_1196_[HNOI2006]公路修建问题_kruskal+二分答案 题意:http://www.lydsy.com/JudgeOnline/problem.php?id=1196 分析: ...
- Linux 下配置Nginx,MySql,php-fpm开机启动
一. Nginx 开机启动 1.在/etc/init.d/目录下创建脚本 vim /etc/init.d/nginx 2.编写脚本内容 (将以下复制进去相应改动安装路径) #!/bin/bash # ...
- Https协议与HttpClient的实现
一.背景 HTTP是一个传输内容有可读性的公开协议,客户端与服务器端的数据完全通过明文传输.在这个背景之下,整个依赖于Http协议的互联网数据都是透明的,这带来了很大的数据安全隐患.想要解决这个问题有 ...
- OSI七层协议与TCP连接
概述 为了追求效率,我们写代码,不可能去关注底层知识,但往往到出了问题,或者性能调优.我们就会速手无策,仔细为自己查缺补漏,总结知识点. 网络协议 互联网的本质就是一系列的网络协议,让不同计算机能够互 ...
- 【公告】MIP组件审核平台故障-影响说明
故障通报 2017年8月8日 下午14:11,由于机器故障原因,MIP组件审核平台无法提供服务. 2017年8月8日 下午16:46,服务恢复. 故障影响 2017年8月8日下午13:00-14:00 ...
- 鸟哥的Linux私房菜笔记第四章
前言 对着<鸟哥的Linux私房菜-基础版>做了简化笔记.不想让自己知其然而不知其所然.所以写个博客让自己好好巩固一下,当然不可能把书中的内容全部写下来.在这里就简化一点把命令写下来. 让 ...