1.基本概念用法

1.1解构赋值:ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值。

var a = 1;
var b = 2;
var c = 3;
/*上述赋值语句用解构赋值为*/
var [a,b,c] = [1,2,3];

1.2上述的解构发生在等号左右模式相同的情况下,如果等号两边的模式不一致,解构可能会不成功;

/*当变量多于值个数或无值时,解构失败*/
var [foo] = [];
var [a,b] = [1];
/*当变量少于值个数,不完全解构*/
let [a,b] = [1,2,3]; //可解构,a = 1, b = 2
let [a,[b],c] = [1,[2,3],4] //可解构,a = 1, b = 2,c=4
/*等号右边不是数组时,报错,下述代码全部都会报错*/
let [foo] = 10;
let [foo] = true;
let [foo] = null;
let [foo] = {};

1.3解构赋值可指定默认值:

var [foo = true] = [];  //foo = true;
var [a,b = 2] = [1]; //a = 1;b = 2;

另需注意,指定默认值的数组成员必须是严格等于undefined,否则默认值不会生效;

/**/
var [x = 1] = [undefined]; //x =1
var [x = 1] = [null]; //x=null
var [x ,y= 1]= [2]; //y = 1

如果默认值是一个表达式,那么这个表达式是惰性求值的,即只有在用到的时候,才会求值;

function f() {
console.log('aaa');
} let [x = f()] = [1];
/*上述代码中因为x能取到值,因此f()函数不会执行*/

默认值可以引用解构赋值的其他变量,但该变量必须已经声明;

let [x = 1, y = x] = [];     // x=1; y=1
let [x = 1, y = x] = [2]; // x=2; y=2
let [x = 1, y = x] = [1, 2]; // x=1; y=2
let [x = y, y = 1] = []; // ReferenceError /*最后一个赋值,x用到默认值y时,y还没有声明。因此报错*/

ECMA Script 6新特性之解构赋值的更多相关文章

  1. ECMAscript6新特性之解构赋值

    在以前,我们要对变量赋值,只能直接指定值.比如:var a = 1;var b = 2;但是发现这种写法写起来有点麻烦,一点都不简洁,而在ECMAScript6中引入了一种新的概念,那就是" ...

  2. js--ES6新特性之解构

    前言 es6 中引入了解构这一新特性,了解解构成为一个格合前端必须掌握的基础知识,不仅作为了面试的重要考查知识,同时能极大提高我们平常工作的开发效率.本文来总结一下需要掌握的解构知识点. 正文 1.什 ...

  3. 【ES6】对象的新功能与解构赋值

    ES6 通过字面量语法扩展.新增方法.改进原型等多种方式加强对象的使用,并通过解构简化对象的数据提取过程. 一.字面量语法扩展 在 ES6 模式下使用字面量创建对象更加简洁,对于对象属性来说,属性初始 ...

  4. ES 6 系列 - 赋值的新方式:解构赋值

    变量的解构赋值 es 6 允许按照一定的模式,从数组和对象中提取值,然后对变量进行赋值,这被称之为解构: 一.数组的解构赋值 最基本写法: let [a, b, c] = [1, 2, 3]; a / ...

  5. javascript ES6 新特性之 解构

    解构的作用是可以快速取得数组或对象当中的元素或属性,而无需使用arr[x]或者obj[key]等传统方式进行赋值 var arr = [1, 2, 3]; //传统方式 var a = arr[0], ...

  6. ES6新特性之解构使用细节

    ES6的解构说白了就是能够让我们一次性取到多个值,大致可分为一下几个方面 1.数组解构 普通的一维数组解构,如下one = array[0],two=array[1],three=array[2] v ...

  7. ES6解构赋值

    前面的话 我们经常定义许多对象和数组,然后有组织地从中提取相关的信息片段.在ES6中添加了可以简化这种任务的新特性:解构.解构是一种打破数据结构,将其拆分为更小部分的过程.本文将详细介绍ES6解构赋值 ...

  8. ES6里的解构赋值

    我们经常定义许多对象和数组,然后有组织地从中提取相关的信息片段.在ES6中添加了可以简化这种任务的新特性:解构.解构是一种打破数据结构,将其拆分为更小部分的过程. 一.引入背景 在ES5中,开发者们为 ...

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

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

随机推荐

  1. Jquery复习(八)之遍历

    jQuery 遍历 - 祖先 parent() parents() parentsUntil() jQuery parent() 方法 parent() 方法返回被选元素的直接父元素. 该方法只会向上 ...

  2. 我所不知的JS

    几天前在阅读 MDN 文档时我发现了一些我从来不知道的 JS 特性和 API. 下面是一份简短的清单, 无论有用不有用——学习 JS 的道路似乎是没有尽头的. 标签语句 在 JS 中,你可以对 for ...

  3. css练习小总结

    1.div水平居中:/*设置div宽度后,margin:0 auto:*/2.div显示在一行:/*float:left:*/ 3.text-align:/*后面标签里的内容水平居中:*/4.alig ...

  4. 2019-2020-1 20199319《Linux内核原理与分析》第二周作业

    计算机是如何工作的 反汇编一个简单的C程序 1.在实验环境下,创建main.c,并进入该文件进行代码的编写 在VIM文本编辑器中编写完代码后按"Shift"+":&quo ...

  5. PAT Basic 1039 到底买不买 (20 分)

    小红想买些珠子做一串自己喜欢的珠串.卖珠子的摊主有很多串五颜六色的珠串,但是不肯把任何一串拆散了卖.于是小红要你帮忙判断一下,某串珠子里是否包含了全部自己想要的珠子?如果是,那么告诉她有多少多余的珠子 ...

  6. JDK12的安装搭建

    JDK12的安装搭建 一.JDK下载 ​ 1.JDK官网下载地址:https://www.oracle.com/technetwork/java/javase/downloads/jdk12-down ...

  7. python中英文翻译模块

    从一种语言到另一种语言的文本翻译在各种网站中越来越普遍. 帮助我们执行此操作的python包称为translate. 可以通过以下方式安装此软件包. 它提供主要语言的翻译. 官网:https://py ...

  8. RPC框架pigeon源码分析

    Pigeon是一个分布式服务通信框架(RPC),是美团点评最基础的底层框架之一.已开源,链接:https://github.com/dianping/pigeon 从接下来三个方面来分析pigeon的 ...

  9. ARM汇编 汇编文件后缀.s与.S

    有两套汇编的语法: ARM公司的标准ARM汇编语言和GNU对ARM支持的GNU ARM汇编. ARM标准汇编语言即ARM公司的开发工具ADS里用的汇编语言: GNU汇编即在Linux下用GCC编译的汇 ...

  10. Berlekamp-Massey algorithm

    https://www.cnblogs.com/zzqsblog/p/6877339.html https://blog.csdn.net/qq_39972971/article/details/80 ...