先看看数组解构:

function fn(){
return [1,2,3];
} var [a,b,c] = fn();
console.log(a,b,c); // 1 2 3 var [d,,f] = fn();
console.log(d,f); //1 3 var [e,] = fu();
console.log(e); //1

假设有一个能够返回对象的函数f :

function fn(){
return {
a:'1',
b:'2',
c:'3'
};
} var {a:x,b:y,c:z} = fn();
console.log(x,y,z);

假如使用的变量名和被匹配的属性名一样,即 var {a:a,b:b,c:c} = fn();

那么可以简写为:

function fn(){
return {
a:'1',
b:'2',
c:'3'
};
} var {a,b,c} = fn();
console.log(a,b,c);

错误写法:

var  {x:a,x:b,x:c} = fn();

console.log(x,y,z);

正确写法

var  {a:x,b:y,c:z} = fn();

console.log(x,y,z);     //  a  b c

JS中的解构的更多相关文章

  1. 【JS】325- 深度理解ES6中的解构赋值

    点击上方"前端自习课"关注,学习起来~ 对象和数组时 Javascript 中最常用的两种数据结构,由于 JSON 数据格式的普及,二者已经成为 Javascript 语言中特别重 ...

  2. ES6中的解构

    数组中的解构: 输出 : 白板 幺鸡 二条 对象的解构: 输出: 老王 12 数组的结构用[];对象的解构用{}:一定要区分它是数组还是解构. 区分方法:看 它是在赋值还是在拿值,等号左边,都为解构, ...

  3. ES6中的解构赋值

    在解释什么是解构赋值前,我们先来看一下, ES5 中对变量的声明和赋值. var str = 'hello word'; 左边一个变量名,右边可以是字符串,数组或对象. ES6 中增加了一种更为便捷的 ...

  4. C#7.0中的解构功能---Deconstruct

    解构元组 C#7.0新增了诸多功能,其中有一项是新元组(ValueTuple),它允许我们可以返回多个值,并且配合解构能更加方便的进行工作,如下面例子 static void Main(string[ ...

  5. ES2015中的解构赋值

    ES2015中允许按照一定的模式,从数组和对象中提取值,对变量进行赋值,被称为”解构(Destructering)“. 以前,为变量赋值,只能指定值. /** * 以前,为变量赋值,只能直接指定值 * ...

  6. JavaScript 中对象解构时指定默认值

    待解构字段为原始值 正常情况下, const obj = { a: 1, b: 2, }; const { a, b } = obj; console.log(a, b); // 1 2 当被解构字段 ...

  7. js变量的解构赋值

    今天在学习时看到几段代码,让我感叹JS的灵活,特此一记: let stateObj = {a:1,b:3}; let newObj = {b:13,c:4} ; stateObj = {...stat ...

  8. ES6中变量解构的用途—遍历Map结构

  9. js 数组分解 解构

    // ES5 a = list[0], rest = list.slice(1) // ES6 [a, ...rest] = list

随机推荐

  1. STL-vector-set_difference B - 人见人爱A-B

    B - 人见人爱A-B 参加过上个月月赛的同学一定还记得其中的一个最简单的题目,就是{A}+{B},那个题目求的是两个集合的并集,今天我们这个A-B求的是两个集合的差,就是做集合的减法运算.(当然,大 ...

  2. vue学习指南:第十三篇(详细) - Vue的 路由 第三篇 ( 路由的缓存 )

    路由的缓存 路由缓存是 Vue组件优化的一个重要方法 为什么实现路由缓存? 为了 组件间 相互切换不会重复加载数据,影响用户体验,我们通常需要将组件的数组实现缓存,当我们点过来,在点的时候会再次发送 ...

  3. JDBC——DriverManager驱动管理对象

    功能 1.注册驱动 注册驱动:告诉程序使用哪个驱动jar包 写代码使用:Class.forName("com.mysql.jdbc.Driver"); 查看源码 mysql-con ...

  4. JDBC未知列

    Exception in thread "main" com.mysql.jdbc.exceptions.jdbc4. MySQLSyntaxErrorException: Unk ...

  5. AcWing 1016. 最大上升子序列和

    #include<iostream> using namespace std ; ; int f[N]; int a[N]; int main() { int n; cin>> ...

  6. C#通过属性名字符串获取、设置对象属性值

    之前理工项目从这个博客找到了相对应的方法:C#通过属性名字符串获取.设置对象属性值 https://www.cnblogs.com/willingtolove/p/12198871.html

  7. 金蝶云星空使用WebAPI来新增单据

    有很多客户需求在后台自动生成某张单据,金蝶云星空提供了WebApi,包含了保存,提交,审核,删除单据的接口,下面以生产订单的保存,提交,审核为例,说明一下应用WebApi后台自动生成生产订单的功能,下 ...

  8. xstart访问centos7

    参考文档:https://blog.csdn.net/wuzhimang/article/details/51523867

  9. Ubuntu 的apt install 和卸载正确姿势

    先说下使用apt  installl 安装的包的卸载: apt-get remove: 卸载软件apt-get purge: 卸载软件和配置文件apt-get autoremove: 移除没有使用的依 ...

  10. thinkphp 二级域名绑定模块,导致设置的路由被多域名共用的问题解决方案

    问题背景: 在router.php路由配置文件设置了二级域名和路由设置 use think\Route; Route::domain('www','index'); Route::domain('ad ...