解构赋值

从ES6开始,JavaScript引入了解构赋值,可以同时对一组变量进行赋值。

什么是解构赋值?我们先看看传统的做法,如何把一个数组的元素分别赋值给几个变量:

var array = ['hello', 'JavaScript', 'ES6'];
var x = array[0];
var y = array[1];
var z = array[2];

现在,在ES6中,可以使用解构赋值,直接对多个变量同时赋值:

'use strict';

// 如果浏览器支持解构赋值就不会报错:
var [x, y, z] = ['hello', 'JavaScript', 'ES6'];

// x, y, z分别被赋值为数组对应元素:
console.log('x = ' + x + ', y = ' + y + ', z = ' + z);

var person = {
name: '小明',
age: ,
gender: 'male',
passport: 'G-12345678',
school: 'No.4 middle school'
};
var {name, age, passport} = person;
// name, age, passport分别被赋值为对应属性:
console.log('name = ' + name + ', age = ' + age + ', passport = ' + passport);
var person = {
name: '小明',
age: ,
gender: 'male',
passport: 'G-12345678',
school: 'No.4 middle school',
address: {
city: 'Beijing',
street: 'No.1 Road',
zipcode: ''
}
};
var {name, address: {city, zip}} = person;

ES6结构赋值的更多相关文章

  1. 2、ES6结构赋值和模板字符串

    ES6允许按照一定的模式,从数组和对象中提取值,这被称为结构,即解开数据的结构 1.数组的解构赋值 let [a,b] = [1,2] let [a,b,c=100] = [1,2] //c的默认值为 ...

  2. 一个令人兴奋的ES6星特性-结构赋值

    学完了前4节,今天我给大家带来的是一个令人兴奋的特性:解构赋值.这个章节代码片段有点偏多,不过可以放心,一点都不烧脑,还是老样子:简单易懂. 什么是解构赋值 按照一贯的套路,接下来的内容是解释:什么是 ...

  3. ES6中的变量结构赋值

    小编的上一篇文章更新了es6中关于变量定义的问题,这篇文章继续来一些实用的干货,关于数组.对象的赋值问题.特别是在前后端合作项目的时候,对后端数据的拆分,还有就是对于函数的默认值的惰性赋值问题.看完下 ...

  4. JS ES6的变量的结构赋值

    变量的结构赋值用户很多 1.交换变量的值 let x = 1; let y = 2; [x,y] = [y,x] 上面的代码交换变量x和变量y的值,这样的写法不仅简洁,易读,语义非常清晰 2.从函数返 ...

  5. ES6,变量,函数-参数,结构赋值

    变量 var 1.可以重复声明. 无法限制修改-, 没有块级作用域 let不能重复声明,变量-可以修改,块级作const不能重复声明,常量-不能修改,块级作 函数——箭头函数function 名字() ...

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

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

  7. ES6 变量的结构赋值

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

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

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

  9. ES6走一波 变量结构赋值

    Destructuring  变量的解构赋值 是一种模式匹配 ES6我关注点之一是用途  能否举些好例子是检验学习到位的方法之一 交换变量值 函数返回多个值 函数入参为对象.数组,内部使用更简洁 意义 ...

随机推荐

  1. 前端学习笔记2017.6.12 HTML的结构以及xhtml、html、xml的区别

    HTML的结构 一个HTML文档可分为几个部分,如下图所示: DOCTYPE部分.head部分和body部分 DOCTYPE部分,这个很重要,可以理解为不同的DOCTYPE意味着不同的html标准,因 ...

  2. ZROI2018普转提day2t2

    传送门 分析 我们发现2R+C实际就相当于R行C列的子集的个数.因此我们可以将所有集合的子集个数转换为每个集合属于的集合的个数.所以我们可以求出: 这个式子的意义为对于选i行j列的情况的所有方案乘上i ...

  3. ARC061E Snuke's Subway Trip

    传送门 题目大意 已知某城市的地铁网由一些地铁线路构成,每一条地铁线路由某一个公司运营,该城市规定:若乘坐同一公司的地铁,从开始到换乘只需要一块钱,换乘其他公司的价格也是一块钱,问从1号地铁站到n号地 ...

  4. linux环境安装python

    linux环境下安装python3,一步一步来吧! 安装python3 安装readline-devel依赖 ,用于解决python3安装完成后,退格和方向键乱码问题 yum install read ...

  5. SSH框架(四) struts2+spring3.0的登陆示例

    (一)关键理念及需要注意的地方: 使用struts2+spring3.0的框架搭建web程序,就是使用spring来进行依赖注入(依赖注入请参考baidu上面的解释:http://baike.baid ...

  6. C++--VECTOR的简单应用

    在c++中,vector是一个十分有用的容器,下面对这个容器做一下总结. 1 基本操作 (1)头文件#include<vector>. (2)创建vector对象,vector<in ...

  7. c# get set 理解

  8. 写一个Android输入法02——候选窗、转换

    上一篇介绍了完成Android输入法的最小化步骤,它只能将按键对应的字符上屏.一般的东亚语言都有一个转换的过程,比如汉语输入拼音,需要由拼音转成汉字再上屏.本文将在前文基础上加入完成转换过程所必需的候 ...

  9. [SinGuaRiTy] 2017-07-24 NOIP2015 模拟赛

    [SinGuLaRiTy-1030] Copyright (c) SinGuLaRiTy 2017. All Rights Reserved. 对于所有题目: Time Limit: 1s | Mem ...

  10. Spark大数据处理 之 RDD粗粒度转换的威力

    在从WordCount看Spark大数据处理的核心机制(2)中我们看到Spark为了支持迭代和交互式数据挖掘,而明确提出了内存中可重用的数据集RDD.RDD的只读特性,再加上粗粒度转换操作形成的Lin ...