先看看数组解构:

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. python面试的100题(15)

    41.super函数的具体用法和场景 为了调用父类(超类)的一个方法,可以使用 super() 函数,比如: class A: def spam(self): print('A.spam') clas ...

  2. IDEA 在SVN上更新代码错误: Error:Server SSL certificate rejected

    在IDEA中更新代码到SVN中 ,出现了   Error:Server SSL certificate rejected    ---服务器的SSL证书  的错误 之前在网上有找过一些相关的做法,但是 ...

  3. mysql-sql分析策略及优化

    tranlation事务:从失败中回复到正常状态的方法多个应用并发访问数据库时,提供隔离方法 acid原子性:要么成功.要么失败一致性:数据保持“合理性”隔离型:多个事务同时并发执行,每个事务就像各自 ...

  4. HTML的表单初级验证

    HTML的表单初级验证 placeholder(提示信息) required(确保不能为空) pattern(正则表达式验证) 1. placeholder(提示信息) 语法: <p>账号 ...

  5. Keep-Alive 以及服务器心跳

    Keep-Alive 来源 :http://www.nowamagic.net/academy/detail/23350305 服务器心跳  来源 :http://www.cnblogs.com/lw ...

  6. 题解【Codeforces859C】Pie Rules

    题面 一道需要一定思考的 \(\text{DP}\) . 设 \(dp_i\) 表示第 \(i\) 步走的人能得到的最大分数, \(sum_i\) 表示 \(\sum_{j=i}^n a_j\) ,即 ...

  7. 增删改查-删除(php)

    <!DOCTYPE html> <html><script type="text/javascript" src="jquery-1.11. ...

  8. 使用Python发送、订阅消息

    使用Python发送.订阅消息 使用插件 paho-mqtt 官方文档:http://shaocheng.li/post/blog/2017-05-23 Paho 是一个开源的 MQTT 客户端项目, ...

  9. SVN提交时没有写注释

    会报错: Error: Commit blocked by pre-commit hook (exit code 1) with output: Error: [Commit failed]: Emp ...

  10. VC++编译选项

    -优化- /O1 最小化空间 minimize space /Op[-] 改善浮点数一致性 improve floating-pt consistency /O2 最大化速度 maximize spe ...