变量的结构赋值用户很多

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的变量的结构赋值的更多相关文章

  1. ES6—— 变量的结构赋值

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

  2. 【ES6基础】let、const命令和变量的结构赋值

    ES5声明变量(2):var .function ES6声明变量(6):var.function.let.const.import和class 1.let命令和const命令 (1)let和const ...

  3. ES6的变量解构赋值

      前  言 ES6 解构赋值: ES6允许按照一定模式从数组和对象中提取值,然后对变量进行赋值,这被称为解构. 1.1 数组的结构赋值 1.1.1基本用法 JS中,为变量赋值直接指定.例如下面代码: ...

  4. ES6 变量的结构赋值

    1.数组的解构赋值 a.基本用法:(‘模糊匹配’) let [a, b, c] = [1, 2, 3]; a b c b.嵌套数组结构例子: let [x, , y] = [1, 2, 3]; x y ...

  5. ES6 变量的结构赋值用途(实用技巧)

    1.交换变量的值 let x=1; let y=2; [x,y]=[y,x];//x=2,y=1 2.从函数返回多个值 函数只能返回一个值,如果要返回多个值,只能将它们放在数组或者对象里返回,有了解构 ...

  6. ES6必知,变量的结构赋值。

    对象和数组时 Javascript 中最常用的两种数据结构,由于 JSON 数据格式的普及,二者已经成为 Javascript 语言中特别重要的一部分. 在编码过程中,我们经常定义许多对象和数组,然后 ...

  7. ES6 对象增强和结构赋值

    The enhanced Object literals: ES6 has added some new syntax-based extensions to {} object literal fo ...

  8. ES6中变量的解析赋值的用途

    变量的解构赋值用途很多. (1)交换变量的值 let x = 1; let y = 2; [x, y] = [y, x]; 上面代码交换变量x和y的值,这样的写法不仅简洁,而且易读,语义非常清晰. ( ...

  9. 【es6】变量解构赋值

    1.数组解构赋值 let [a,b,c]=[1,2,3];//数组解构赋值,注意:左右两边格式需一致 let [a,b]=[1,2,3];//不完全解构,取位置靠前的值 let [a=1,b]=[un ...

随机推荐

  1. windows部署SpiderKeeper(爬虫监控)

    最近发现了一个spdierkeeper的库,这个库的主要用途是在于配合这scrpyd管理你的爬虫,支持一键式部署,定时采集任务,启动,暂停等一系列的操作.简单来说将scrapyd的api进行封装,最大 ...

  2. 打开office时提示错误窗口“向程序发送命令时出现问题”的解决方案

    今天同事问了我一件很怪异的事情,说她的office打不开了,如打开word或excel时,突然出现错误提示错误窗口"向程序发送命令时出现问题",分析原因才知道她安装了 AVG pc ...

  3. bzoj5153&uoj348 【WC2018】州区划分

    五十分就是裸的O(3^n)子集dp. $$f[S]*{w[S]^{p}}=\sum_{T \in S}{f[T]*{w[S-T]^{p}}}$$ 然后我们考虑优化这个dp,我们发现这是子集卷积的形式, ...

  4. Dubbo原理和源码解析之服务引用

    一.框架设计 在官方<Dubbo 开发指南>框架设计部分,给出了引用服务时序图: 另外,在官方<Dubbo 用户指南>集群容错部分,给出了服务引用的各功能组件关系图: 本文将根 ...

  5. Linux的文件类型

    在Linux中,文件的颜色都是有含义的.其中, Linux中文件名颜色不同,代表文件类型不一样. 浅蓝色:表示链接文件: 灰色:表示其他文件: 绿色:表示可执行文件: 红色:表示压缩文件: 蓝色:表示 ...

  6. java基本数据类型传递与引用传递区别

    文章转载自  zejian的博客http://blog.csdn.net/javazejian/article/details/51192130 java的值传递和引用传递在面试中一般都会都被涉及到, ...

  7. SPPNET

    SPPNet Spatial Pyramid Pooling in Deep Convolutional Networks for Visual Recognition 文章地址:https://ar ...

  8. Adobe Photoshop CC 2019 for Mac v20.0.4 中文版安装教程

    全新Adobe Photoshop CC 2019 mac特别版终于上线了,简称ps cc 2019,Adobe Photoshop CC 2019 for Mac v20.0.4 中文版安装教程分享 ...

  9. python输出彩色字体

    Python终端如何输出彩色字体 实现过程:       终端的字符颜色是用转义序列控制的,是文本模式下的系统显示功能,和具体的语言无关.       转义序列是以ESC开头,即用\033来完成(ES ...

  10. BeetleX和Asp.net Core之webapi基础性能对比

    本文主要针对BeetleX和Asp.net Core在基础WebApi功能性能对比 测试环境描述 硬件配置:E1230V2 16G内存 10Gb带宽 操作系统:Windows server 2008 ...