标签： 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. JavaScript之入门篇（二）

    终于学到后面的语法部分了,感觉这门语言基础部分和当初学习VB的时候感觉一样一样的,章节目录让我不禁又想到了VB课本.由于怕学过了,过段时间忘了,于是,大概总结一下. 数据类型部分 ① Typeof操作 ...

  2. left jion on和where条件的区别

    1.on是在生成临时表时()起作用,而且不管on中的条件是否为真,都会返回(left join)左边所有的数据,如果不匹配也是返回空. 2.where 是在生成了临时表后,再对表进行过滤 个人理解:先 ...

  3. Python中的Numpy包

    通过本次学习你可以掌握Numpy Numpy介绍(获取地址)更多Numpy函数 numpy的主要对象是同质多维数组.也就是在一个元素(通常是数字)表中,元素的类型都是相同的. numpy的数组类被成为 ...

  4. 状压DP【洛谷P1879】 [USACO06NOV]玉米田Corn Fields

    P1879 [USACO06NOV]玉米田Corn Fields 农场主John新买了一块长方形的新牧场,这块牧场被划分成M行N列(1 ≤ M ≤ 12; 1 ≤ N ≤ 12),每一格都是一块正方形 ...

  5. [USACO08NOV]安慰奶牛Cheering up the Cow BZOJ 1232 Kruskal

    Farmer John变得非常懒, 他不想再继续维护供奶牛之间供通行的道路. 道路被用来连接N (5 <= N <= 10,000)个牧场, 牧场被连续地编号为1..N. 每一个牧场都是一 ...

  6. Android点击事件（click button）的四种写法

    在学习android开发和测试的时候发现不同的人对于click事件的写法是不一样的,上网查了一下,发现有四种写法,于是想比较一下四种方法的不同 第一种方法:匿名内部类 代码: package com. ...

  7. Django 08 Django模型基础3（关系表的数据操作、表关联对象的访问、多表查询、聚合、分组、F、Q查询）

    Django 08 Django模型基础3(关系表的数据操作.表关联对象的访问.多表查询.聚合.分组.F.Q查询) 一.关系表的数据操作 #为了能方便学习,我们进入项目的idle中去执行我们的操作,通 ...

  8. 将tomcat的protocol改为APR模式,以提高性能

    以下是我修改的内容,以及对tomcat可以修改的参数 scm APR模式启动步骤:   1:将附件中的压缩包,在/usr/local 下解压   2:修改../bin/catalina.sh  ,在其 ...

  9. spring boot CrossOrigin不生效?

    直接postman, curl, 浏览器访问后端接口, response header是不会自动加上Access-Control-Allow-Origin的. 需要在ajax中调用,客户端reques ...

  10. my24_mysql索引-使用篇

    索引提示 SELECT * FROM table1 USE INDEX (col1_index,col2_index) ; SELECT * FROM table1 IGNORE INDEX (col ...