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

解构有三种类型:

1.数组的解构赋值

(1)简单的数组解构

以前,我们给变量赋值是直接单个指定值,比如:

let a=0;
let b=1;
let c=2;

数组解构的方式来进行赋值,如下:

let  [a,b,c]=[1,2,3];

总结:从数组中提取值,按照位置的对象关系(次序)对变量赋值。

(2)数组模式和赋值模式统一

可以简单的理解为等号左边和等号右边的形式要统一,如果不统一解构将失败。相关代码如下:

let [a,[b,c],d]=[1,[2,3],4];

如果等号两边形式不一样,很可能获得undefined或者直接报错。

(3)解构的默认值

解构赋值是允许你使用默认值的,相关代码如下:

let [foo = true] =[];
console.log(foo); //控制台打印出true

undefined和null的区别:

*undefined相当于什么都没有。

*null相当于有值,但值为null。

2.对象的解构赋值

对象的属性没有次序,变量必须与属性同名,才能取到正确的值。

(1)圆括号的使用

如果在解构之前就定义了变量,这时候再解构会出现问题,而且编译就会报错。

let foo;
{foo} ={foo:'i love you'};
console.log(foo);

要解决报错,使程序正常,我们这时候只要在解构的语句外边加一个圆括号就可以了。

let foo;
({foo} ={foo:'i love you'});
console.log(foo); //控制台输出i love you

3.字符串解构

字符串解构,此时字符串被转换成了一个类似数组的对象。

const [a,b,c,d,]="love";
console.log(a);//l
console.log(b);//o
console.log(c);//v
console.log(d);//e

学习参考链接为:http://jspang.com/post/es6.html#toc-696 。

ES6系列_3之变量的解构赋值的更多相关文章

  1. ES6学习笔记之变量的解构赋值

    变量的解构赋值 ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构. 数组的解构赋值 以前,为变量赋值,只能直接指定值: 1 2 3 var a = 1; var b = 2; ...

  2. ES6学习 第二章 变量的解构赋值

    前言 该篇笔记是第二篇 变量的解构赋值. 这一章原文链接: 变量的解构赋值 解构赋值 ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring). 解构 ...

  3. ES6标准入门之变量的解构赋值简单解说

    首先我们来看一看解构的概念,在ES6标准下,允许按照一定模式从数组和对象中提取值,然后对变量进行赋值,这被称作解构,简而言之粗糙的理解就是变相赋值. 解构赋值的规则是,只要等号右边的值不是对象或者数组 ...

  4. ES6第三节:变量的解构赋值

    ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构.下面我们看实际的例子: 一.数组解构: let [a,b,c] = [1,2,3]; console.log(a); //a ...

  5. es6学习2:变量的解构赋值

    一:数组的解构赋值 ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构 let [foo, [[bar], baz]] = [1, [[2], 3]]; foo bar ba ...

  6. ES6 - 基础学习(3): 变量的解构赋值

    解构赋值概述 1.解构赋值是对赋值运算符的扩展. 2.它是一种针对数组或者对象进行模式匹配,然后对其中的变量进行赋值. 3.代码书写上显得简洁且易读,语义更加清晰明了:而且还方便获取复杂对象中的数据字 ...

  7. ES6 第三章 变量的解构赋值 具体参照http://es6.ruanyifeng.com

    1.基本用法 let [a, b, c] = [1, 2, 3];左右两边解构格式要保持一致. 2.默认值 let [x, y = 'b'] = ['a']; // x='a', y='b' let ...

  8. es6系列-变量的解构赋值

    git地址: https://github.com/rainnaZR/es6-study/tree/master/src/destructuring 变量的解构赋值 变量的解构赋值: 数组, 对象, ...

  9. es6之变量的解构赋值

    es5中通常我们声明变量都是以下的方式: var a = 10; var b = 20; var c = 30; //或者 var a = 10,b = 20,c = 30; //或者 var arr ...

随机推荐

  1. 朴素贝叶斯 Naive Bayes

    2017-12-15 19:08:50 朴素贝叶斯分类器是一种典型的监督学习的算法,其英文是Naive Bayes.所谓Naive,就是天真的意思,当然这里翻译为朴素显得更学术化. 其核心思想就是利用 ...

  2. ruby on rails Mac 安装

    网上的资料有很多,但好多坑,有的已经过期了,有的不符合现整理了一下 貌似有的还跟os系统版本有关系,请勿照搬,根据实际情况安装 我的系统版本是10.12.3 ps:选择一个较好的网络,很多问题有得时候 ...

  3. VM虚拟机安装的XP如何全屏

    首先安装install VMwear Tools..,如图:

  4. SGU 144. Meeting 概率dp 几何概率分布 难度:0

    144. Meeting time limit per test: 0.25 sec. memory limit per test: 4096 KB Two of the three members ...

  5. json.dumps与json.dump的区别 json.loads与json.load的区别(简洁易懂)

    json.dumps是将一个Python数据类型列表进行json格式的编码解析, 示例如下: >>> import json #导入python 中的json模块 >>& ...

  6. 201621123006 《Java程序设计》第9周学习总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结集合与泛型相关内容. 2. 书面作业 本次作业题集集合 List中指定元素的删除(题集题目) 1.1 实验总结.并回答:列举至少2种 ...

  7. Memcached工作原理及常见问题

    memcached是怎么工作的? Memcached的神奇来自两阶段哈希(two-stage hash).Memcached就像一个巨大的.存储了很多<key,value>对的哈希表.通过 ...

  8. Yii 初识

    接管一个Yii的系统,因为没有文档,所以非常上火. 01 查版本 Yii::getVersion(); 02 生成webapp Yii 是支持通过命令行生成webapp的.其中, yiic.bat是W ...

  9. 那些实用的Nginx规则

    1. 概述 大家都知道Nginx有很多功能模块,比如反向代理.缓存等,这篇文章总结下我们这些年实际环境中那些有用的Nginx规则和模块,大部分是用法的概括及介绍,具体细节在实际配置时再自行google ...

  10. hdu 3613 Best Reward

    After an uphill battle, General Li won a great victory. Now the head of state decide to reward him w ...