样例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. Note -「Dsu On Tree」学习笔记

    前置芝士 树连剖分及其思想,以及优化时间复杂度的原理. 讲个笑话这个东西其实和 Dsu(并查集)没什么关系. 算法本身 Dsu On Tree,一下简称 DOT,常用于解决子树间的信息合并问题. 其实 ...

  2. SpringBoot到底是什么?

    摘要:Spring Boot是由Pivotal团队提供的全新框架,其设计目的是用来简化新Spring应用的初始搭建以及开发过程. 本文分享自华为云社区<SpringBoot到底是什么?如何理解p ...

  3. jdbc 02: 连接mysql,并实现删除与更新

    jdbc连接mysql,并实现删除与更新 package com.examples.jdbc.o2_删除与更新; import java.sql.*; //连接与插入 /* jdbc删除操作 */ p ...

  4. AtCoder Beginner Contest 247 F - Cards // dp + 并查集

    原题链接:F - Cards (atcoder.jp) 题意: 给定N张牌,每张牌正反面各有一个数,所有牌的正面.反面分别构成大小为N的排列P,Q. 求有多少种摆放方式,使得N张牌朝上的数字构成一个1 ...

  5. 基于EasyExcel的大数据量导入并去重

    源码:https://gitee.com/antia11/excel-data-import-demo 背景:客户需要每周会将上传一个 Excel 数据文件,数据量单次为 20W 以上,作为其他模块和 ...

  6. TCP通信的客户端代码实现和TCP通信的服务器代码实现

    TCP通信的客户端代码实现 package com.yang.Test.ServerStudy; import java.io.*; import java.net.Socket; /** * TCP ...

  7. Str 真题解(置换)

    目录 题面 置换 这里没有群论 置换 置换的乘法(复合) 置换乘法的单位元 置换乘法的结合律 置换快速幂 置换求乘法逆 真题解 一种可能的代码实现 关于循环节做法 题面 对于字符串 \(s\) 定义一 ...

  8. 手把手教你 Apache DolphinScheduler 本地开发环境搭建 | 中英文视频教程

    点击上方 蓝字关注我们 最近,一些小伙伴反馈对小海豚的本地开发环境搭建过程不太了解,这不就有活跃的贡献者送来新鲜的视频教程!在此感谢@Tianqi-Dotes 的细致讲解 贡献者还贴心地录制了中英文两 ...

  9. (防坑)Alphafold 非docker 安装指南

    本指南适用于Linux系统.Alphafold官方也强调尽量使用Linux系统!官方提供了docker版安装步骤. Alphafold简介: 强大的蛋白质结构预测. 开源地址:https://gith ...

  10. xray+awvs的联动

    前言:xray是一款强大的漏扫工具,配合awvs的爬站功能可以十分轻松实现全自动挖洞,这里awvs我是使用的是12版本 1.启动xray,监听本地指定端口,这里我监听的是2222端口 命令:xray_ ...