标签： javascript es6

什么是解构赋值?

示例如下：

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.   <meta charset="utf-8">
  5.   <meta name="viewport" content="width=device-width">
  6.   <title>解构赋值</title>
  7. </head>
  8. <body>
  9.   <script>
  10.     let [a,b] = [1,2];
  11.     let {c,d} = {c:11,d:22};
  12.     console.log(a,b,c,d);
  13.   </script>
  14. </body>
  15. </html>

测试地址

注意事项

  • 左右二边结构要相同，指[]=[]/{}={}
  • 声明和赋值必须在一句话里完成
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.   <meta charset="utf-8">
  5.   <meta name="viewport" content="width=device-width">
  6.   <title>解构赋值规则</title>
  7. </head>
  8. <body>
  9.   <script>
  11.     //左右二边结构必须相同
  12.     //let [a,b] = {a:1,b:2}; //不成功
  13.     //let {a,b} = [1,2]; //不成功
  14.     //console.log(a,b)
  15.     //声明和赋值必须在同一个语句里完成
  16.     /*
  17.     let [a,b];
  18.     [a,b] = [1,2];//不成功
  19.     console.log(a,b)
  20.     */
  22.     let [a,b] = [1,2];//成功
  23.     let [{c,d},[e,f],g,h,i]=[{c:11,d:22},[111,222],333,[1,2],{a:1}]//成功
  24.     console.log(a,b,c,d,e,f,g,h,i);
  25.   </script>
  26. </body>
  27. </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. Linux配置国内的Yum源

    因为Linux默认的yum源是国外的源,所以会有卡顿,缓慢的情况.而国内的Yum源相对速度较快,现在也比较成熟,所以给Linux更换国内Yum源是一个很好的选择. 1.  备份(备份之前需要yum i ...

  2. ELK+Filebeat 实践 Error : read tcp 192.168.0.2:48968->121.40.216.20:5044: i/o timeout

    问题描述: 这是一个i/o time 的问题,一般考虑就是磁盘满的问题.以下是我遇到的具体问题: 1.Kibana页面刷新,没有新数据出来,再次刷新或者点击页面上其他地方,kibana就变成这样了: ...

  3. Android----获取包名和sh1

    第一种:使用java的一个工具---keytool工具(jdk目录下) SHA1叫安全哈希算法用于签名 keytool -list -v -keystore 签名证书所在位置path 第二种:通过An ...

  4. vue.js组件之j间的通讯二

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  5. Bootstrap FileInput 上传 中文 API 整理

    Bootstrap FileInput 上传  中文 API 整理 上传插件有很多 但是公司用的就是 Bootstrap FileInput 自己就看了看  会用就行 自己都不知道每个值是干嘛用的就问 ...

  6. SprimgMVC学习笔记（五）—— Controller方法返回值

    一.返回ModelAndView controller方法中定义ModelAndView对象并返回,对象中可添加model数据.指定view. /** * 查询商品列表 * @return */ @R ...

  7. [Leetcode]017. Letter Combinations of a Phone Number

    public List<String> letterCombinations(String digits) { LinkedList<String> ans = new Lin ...

  8. C语言的存储类别和动态内存分配

    存储类别分三大类: 静态存储类别 自动存储类别 动态分配内存 变量.对象--->内存管理 内存考虑效率(时间更短.空间更小) 作用域 链接.---->空间 存储器   ----->时 ...

  9. 读经典——《CLR via C#》(Jeffrey Richter著) 笔记_方法执行

    [前言] 方法执行前,CLR 会检测方法内代码引用的所有类型.同时 CLR 会分配一个内部数据结构,用来管理对所有引用的类型的访问. 首次执行方法时,托管程序集会把 IL 转换成本地 CPU 指令,并 ...

  10. 关于Django中路由层(URL-conf)

    关于路由层 路由层其实就是项目中urls.py那个文件,那里面存放着url和视图函数的对应关系它的本质是URL与要为该URL调用的视图函数之间的映射表:你就是以这种方式告诉Django,对于客户端发来 ...