样例1:

const { xxx } = this.state;

上面的写法是es6的写法,其实就相当于:

const xxx = this.state.xxx

样例2:

const {comment,index,deleteComment} = this
上面的这句话是一个简写,最终的含义相当于
const  comment = this.comment
const  index = this.index
const   deleteComment = this.deleteComment

将一个对象展开并且将其中的部分属性给另一个对象

示例:

原对象 a={ a1=xxx, b1=xxx, c1=xxx } 想得到的b对象 b={ a1=xxx, b1=xxx }

方法:

const {a1,b1} = a; const b ={a1,b1}

// 把a对象里的a1,b1解构赋值

原理:

ES6解构赋值

对象的解构赋值是根据key值进行匹配

// 这里可以看出,左侧的name和右侧的name,是互相匹配的key值

// 而左侧的name匹配完成后,再赋值给真正需要赋值的Name

let { name:Name,age } = { name:'swr',age:28 }

console.log(Name) // 'swr'

console.log(age) // 28

js对象结构赋值const {XXX } =this的更多相关文章

  1. js对象等号赋值的bug

    var a = {n: 1}; var b = a; a.x = a = {n: 2}; console.log(a.x); console.log(b.x); 有道题是这样的,觉得很奇葩,分析一下 ...

  2. js对象动态赋值

    <view class="movies-template"> <template is="movieListTemplate" data=&q ...

  3. JS ES6的变量的结构赋值

    变量的结构赋值用户很多 1.交换变量的值 let x = 1; let y = 2; [x,y] = [y,x] 上面的代码交换变量x和变量y的值,这样的写法不仅简洁,易读,语义非常清晰 2.从函数返 ...

  4. js对象的直接赋值、浅拷贝与深拷贝

    最近Vue项目中写到一个业务,就是需要把对话框的表单中的数据,每次点击提交之后,就存进一个el-table表格中,待多次需要的表单数据都提交进表格之后,再将这个表格提交,实现多个表单数据的同时提交,期 ...

  5. Atitit 跨平台异常处理(2)--------异常转换 -----java c# js异常对象结构比较and转换

    Atitit 跨平台异常处理(2)--------异常转换 -----java c# js异常对象结构比较and转换 { "@type":"java.lang.Runti ...

  6. jquery实现点击展开列表同时隐藏其他列表 js 对象操作 对象原型操作 把一个对象A赋值给另一个对象B 并且对象B 修改 不会影响 A对象

    这篇文章主要介绍了jquery实现点击展开列表同时隐藏其他列表的方法,涉及jquery鼠标事件及节点的遍历与属性操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下 本文实例讲述了jquery实现点击 ...

  7. js 对象操作 对象原型操作 把一个对象A赋值给另一个对象B 并且对象B 修改 不会影响 A对象

    我最近在做一个vue + element-UI + vue-resource + vuex项目的时候,遇到了一个对象的问题. 当我们在项目需要 复制一个对象到另一个对象并且  被复制的对象不能受复制后 ...

  8. js对象详解(JavaScript对象深度剖析,深度理解js对象)

    js对象详解(JavaScript对象深度剖析,深度理解js对象) 这算是酝酿很久的一篇文章了. JavaScript作为一个基于对象(没有类的概念)的语言,从入门到精通到放弃一直会被对象这个问题围绕 ...

  9. JS — 对象的基本操作

    JS面向对象系列教程 — 对象的基本操作 面向对象概述  面向对象(Object Oriented)简称OO,它是一种编程思维,用于指导我们如何应对各种复杂的开发场景. 这里说的对象(Object) ...

随机推荐

  1. 基于 Hexo 从零开始搭建个人博客(五)

    阅读本篇前,请先阅读前几篇文章: 基于 Hexo 从零开始搭建个人博客(一) 基于 Hexo 从零开始搭建个人博客(二) 基于 Hexo 从零开始搭建个人博客(三) 基于 Hexo 从零开始搭建个人博 ...

  2. 循环队列(严3.30)--------西工大NOJ习题.9

    #define _CRT_SECURE_NO_WARNINGS #include <stdio.h> #include <stdlib.h> typedef struct _Q ...

  3. 递归概念&分类&注意事项和使用递归计算1-n之间的和

    递归 概述 递归:指在当前方法内调用自己的这种现象. 递归的分类: 递归分为两种,直接递归和间接递归 直接递归称为方法自身调用自己 简介递归可以A方法调用B方法,B方法调用C方法,C方法调用A方法 注 ...

  4. SQL 字符串去除空格函数汇总

    SQL 中使用ltrim()去除左边空格 ,rtrim()去除右边空格 ,没有同时去除左右空格的函数,要去除所有空格可以用replace(字符串,' ',''),将字符串里的空格替换为空 . 例:去除 ...

  5. AOP实现切入

    6.AOP实现切入 AOP为Aspect Oriented Programming的缩写,意为:面向切面编程 通过预编译方式和运行期间动态代理实现程序功能的统一维护的一种技术 AOP是OOP的延续,也 ...

  6. docker 部署私人 nuget 服务

    使用docker搭建私有Nuget服务 首先在linux服务器上创建两个容器挂着目录 mkdir /home/nuget/db mkdir /home/nuget/packages 并且对该目录指定写 ...

  7. 巨细靡遗流程控制,Go lang1.18入门精炼教程,由白丁入鸿儒,Go lang流程结构详解EP09

    流程结构就是指程序逻辑到底怎么执行,进而言之,程序执行逻辑的顺序.众所周知,程序整体都是自上由下执行的,但有的时候,又不仅仅是从上往下执行那么简单,大体上,Go lang程序的流程控制结构一共有三种: ...

  8. Canvas 线性图形(一):路径

    路径的概念 路径是从起始点到结束点之间的连线.个人认为,二维画布中分为线性图形和非线性图形,线性图形包括矩形.直线.曲线.圆形等各种几何图形:非线性图形包括图象.文本.像素.线性图形中又分为路径和非路 ...

  9. linux 旁路掉协议栈的处理点

    对于协议栈的发展,目前有三种处理趋势,一种是类似于使用dpdk的方式,然后将协议栈放到用户态来做,做得比较好的一般都是以bsd的协议栈为底子,可以参考的是腾讯开源的的方案,另外一种是,继续放在内核,但 ...

  10. html、css实现导航栏5种常用下拉效果

    实现的效果:鼠标移入按钮时按钮中的内容就会出现,分别展示不同的出现效果.效果难点:不使用JavaScript,那这个效果的难点就是在于:hover伪类的掌控,以及考验对html的结构掌握. 1. ht ...