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 ...
随机推荐
- GitHub 系列之「怎样使用 GitHub?」
1.写在前边的话,为什么要写CitHub? 跟朋友在交流的时候听到求职的时候发现有些公司要附Github帐号,一个优秀的 GitHub 账号当然能让你增色不少.自己之前听说过,但没有花时间研究,最后花 ...
- 安装ipset车祸现场
基础环境centos6.8内核2.6.32. 本身服务器带的是6.11ipset版本,业务需求,需要升级到6.32 ipset-6.32 ./configure 报错 configure: error ...
- pyc
当运行一个高级程序的时候,需要一个翻译机把高级语言变成计算机能读懂的机器语言的过程.这个过程分为两类: 编译 在程序执行之前,先通过编译器对程序执行一个编译的过程,把程序变成机器语言,运行时就不需要翻 ...
- go语言nsq源码解读八 http.go、http_server.go
这篇讲另两个文件http.go.http_server.go,这两个文件和第六讲go语言nsq源码解读六 tcp.go.tcp_server.go里的两个文件是相对应的.那两个文件用于处理tcp请求, ...
- Semaphore简介
Semaphore简介 Semaphore是并发包中提供的用于控制某资源同时被访问的个数 操作系统的信号量是个很重要的概念,在进程控制方面都有应用.Java 并发库 的Semaphore 可以很轻松完 ...
- 模板——无旋Treap
#include "bits/stdc++.h" using namespace std; inline int read(){ ,k=;char ch=getchar(); :, ...
- CAN总线的显性电平与隐性电平
读CAN总线的书时,都会涉及到总线电平的问题,CAN总线的电平分为显性电平与隐性电平,这是CAN总线物理层的核心部分,也是总线仲裁的基础.那何为显性,何为隐性呢? 根据孔丙火(微信公众号:孔丙火)的理 ...
- nginx+php安装
1.环境概述 虚拟机系统:CentOS Linux release 7.3.1611 (Core) 宿主机系统:Mac Sierra version 10.12.3 nginx:1.10.3 php: ...
- UML用法及状态图,活动图介绍
统一建模语言UML(Unified Modeling Language)是非专利的第三代建模和规约语言.UML是一种开放的方法,用于说明.可视化.构建和编写一个正在开发的.面向对象的.软件密集系统的制 ...
- Redis in .NET Core 入门:(2) String
第1篇:https://www.cnblogs.com/cgzl/p/10294175.html‘ 本文简单介绍一下Redis的常用数据类型String. 基本上都是文档上的内容,所以比较无聊.... ...