先看看数组解构:

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. SpringMVC处理中文乱码

    SpringMVC自带过滤器 添加至web.xml文件 <filter> <filter-name>encoding</filter-name> <filte ...

  2. JavaScript 引擎基础:Shapes 和 Inline Caches

    JavaScript 引擎基础:Shapes 和 Inline Caches hijiangtao ​ 中国科学院大学 计算机应用技术硕士 260 人赞同了该文章 前言:本文也可以被称做 “JavaS ...

  3. java内部类概念

    一.成员内部类作为外部类的成员存在的类,则称之为成员内部类 public class OuterClass{ public class InnerClass{ } } 成员内部类样例 成员内部类具有如 ...

  4. C# ODP.Net oracle数据库操作 支持不安装客户端

    下载: http://download.oracle.com/otn/other/ole-oo4o/ODTwithODAC1110720.zip?AuthParam=1414811820_e61f2f ...

  5. docker命令总结(一)

    个人简单总结: 参数 用途 语法 示例 search 在docker hub中搜索镜像 docker search 镜像名称 docker search nginx pull 在docker hub中 ...

  6. python之路之io多路复用

    1.实现io多路复用利用select s1同时接受三个客户端(开启了三个服务器端口) #!/usr/bin/env python # -*- coding: utf-8 -*- import sock ...

  7. listView有感

    listView显示出来框,设置的是裁切后显示出来的界面,而非能装入item的空间.

  8. L1-7 谁是赢家

    思路 这题好简单,可以分析一下,没有别的情况了. 代码 #include <bits/stdc++.h> using namespace std; int main() { int p1, ...

  9. Ztree使用教程

    这两天项目需要写一个树形帮助,学习了我们项目组的老师的Ztree的树的写法,实现了这个帮助,下面来总结一下Ztree的用法. (也是参考的一篇csdn上的博客了) zTree 是一个依靠 jQuery ...

  10. 使用ResponseBodyAdvice统一包装响应返回String的时候出现java.lang.ClassCastException: com.xxx.dto.common.ResponseResult cannot be cast to java.lang.String

    代码如下: @Override public ResponseResult<Object> beforeBodyWrite(Object returnValue, MethodParame ...