标签： javascript es6

什么是解构赋值?

示例如下：

<!DOCTYPE html>

<html>

<head>

  <meta charset="utf-8">

  <meta name="viewport" content="width=device-width">

  <title>解构赋值</title>

</head>

<body>

  <script>

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

    let {c,d} = {c:11,d:22};

    console.log(a,b,c,d);

  </script>

</body>

</html>

测试地址

注意事项

  • 左右二边结构要相同，指[]=[]/{}={}
  • 声明和赋值必须在一句话里完成
<!DOCTYPE html>

<html>

<head>

  <meta charset="utf-8">

  <meta name="viewport" content="width=device-width">

  <title>解构赋值规则</title>

</head>

<body>

  <script>

    //左右二边结构必须相同

    //let [a,b] = {a:1,b:2}; //不成功

    //let {a,b} = [1,2]; //不成功

    //console.log(a,b)

    //声明和赋值必须在同一个语句里完成

    /*

    let [a,b];

    [a,b] = [1,2];//不成功

    console.log(a,b)

    */

    let [a,b] = [1,2];//成功

    let [{c,d},[e,f],g,h,i]=[{c:11,d:22},[111,222],333,[1,2],{a:1}]//成功

    console.log(a,b,c,d,e,f,g,h,i);

  </script>

</body>

</html>

测试地址

粗看ES6之解构赋值的更多相关文章

  1. ES6 的解构赋值前每次都创建一个对象吗？会加重 GC 的负担吗？

    本文来源于知乎上的一个提问. 为了程序的易读性,我们会使用 ES6 的解构赋值: function f({a,b}){} f({a:1,b:2}); 这个例子的函数调用中,会真的产生一个对象吗?如果会 ...

  2. 进军es6(2)---解构赋值

    本该两周之前就该总结的,但最近一直在忙校招实习的事,耽误了很久.目前依然在等待阿里HR面后的结果中...但愿好事多磨!在阿里的某轮面试中面试官问到了es6的掌握情况,说明es6真的是大势所趋,我们更需 ...

  3. es6的解构赋值学习（1）

    相对es5的简单的"="赋值来说,es6增加了一种新的赋值模式--解构赋值,按照它的规则,可以从数组和对象中提取值来对变量进行赋值,个人觉得方便了很多,但是这个模式有点恶心人,相比 ...

  4. ES6变量解构赋值

    ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构ES6之前我们申明多个变量需要按照下面的方法: let l a=1; let b=2; let c=3; let d=4; ...

  5. ES6语法~解构赋值、箭头函数、class类继承及属性方法、map、set、symbol、rest、new.target、 Object.entries...

    2015年6月17日 ECMAScript 6发布正式版本 前面介绍基本语法,  后面为class用法及属性方法.set.symbol.rest等语法. 一.基本语法:  1.         定义变 ...

  6. ES6之解构赋值

    截止到ES6,共有6种声明变量的方法,分别是var .function以及新增的let.const.import和class: 我们通常的赋值方法是: var foo='foo'; function ...

  7. Es6 新增解构赋值

    1.数组的解构赋值 基本用法 ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring). 要想实现解构,就必须是容器,或者具有可遍历的接口. 以前,为 ...

  8. ES6 之 解构赋值

    本博文配合 阮一峰 <ES6 标准入门(第3版)>一书进行简要概述 ES6 中变量的解构赋值. 数组的解构赋值 基本用法 ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这 ...

  9. es6变量解构赋值的用途

    这里是我觉得es6解构赋值,在平时我们写js的时候非常有用,而且经常用到的地方,能简化我们的代码,让写代码简介优雅易读; 用途 1.交换变量的值,太方便了这逼,写法不仅简介而且一看就明白 let [x ...

随机推荐

  1. Scrapy 中 Request 对象和 Response 对象的各参数及属性介绍

    Request 对象 Request构造器方法的参数列表: Request(url [, callback=None, method='GET', headers=None, body=None,co ...

  2. Dynamic Rankings（整体二分）

    Dynamic Rankings(整体二分) 带修区间第k小.\(n,q\le 10^4\). 这次我们旧瓶装新酒,不用带修主席树.我们用整体二分!整体二分是啥东西呢? 二分答案可以解决一次询问的问题 ...

  3. SQLAlchemy外键的使用

    orm可以将数据库存储的数据封装成对象,同时,如果封装的好的话,所有的数据库操作都可以封装到对象中.这样的代码在组织结构上会非常的清晰,并且相对与使用sql语句在sql注入方面会极具降低. SQLAl ...

  4. web安全问题-csrf

    web安全问题 csrf <script> document.write(` <form name="commentForm" target="csrf ...

  5. Sublime3插件安装

    首先声明一下,小编是做后台开发出身,但是总是想捣鼓一些小的网站出来,可能是完美心作祟,感觉前端这边不能差事,所以就自己上了,一开始是用eclipse来开发的,具体原因忘了,也不知道怎么就开始用Subl ...

  6. JavaScript Succinctly 读后笔记

    1.JavaScript does not have block scope  2.Scope is determined during function definintion,  not invo ...

  7. Mybatis学习笔记(八) —— Mybatis整合spring

    一.整合思路 1.SqlSessionFactory对象应该放到spring容器中作为单例存在. 2.传统dao的开发方式中,应该从spring容器中获得sqlsession对象. 3.Mapper代 ...

  8. Linux安装与分区解释

    Linux安装过程中最重要的就是对硬盘进行分区: Linux是先建立一个根目录“/”,然后在根目录上建立一系列的空目录,接着把硬盘分区挂载到相应目录上. 在linux系统中至少必须有两个挂载点(磁盘分 ...

  9. 读经典——《CLR via C#》(Jeffrey Richter著) 笔记_元数据

    1.元数据简介 全称:metadata 属性:数据表集合 产地:面向 CLR 的编译器在托管模块中生成 2.元数据内部结构及与托管模块的关系 [概述] 托管模块中包含着元数据,元数据是由一组数据表组成 ...

  10. 4.centos7 docker 安装

    参考这个文档进行安装docker: http://www.runoob.com/docker/centos-docker-install.html 开机启动 systemctl enable dock ...