js中或者vue中 Object.assign()用法详解

时间:2021-09-21 04:59:19

Object.assign()是浅拷贝。

合并对象
    var o1 = { a: 1 };
    var o2 = { b: 2 };
    var o3 = { c: 3 };

    var obj = Object.assign(o1, o2, o3);
    console.log(obj); // { a: 1, b: 2, c: 3 }
    console.log(o1); // { a: 1, b: 2, c: 3 }, 注意目标对象自身也会改变。

注意,具有相同属性的对象,同名属性,后边的会覆盖前边的。

Vue中的使用技巧
  由于Object.assign()有上述特性,所以我们在Vue中可以这样使用:
Vue组件可能会有这样的需求:在某种情况下,需要重置Vue组件的data数据。此时,我们可以通过this.$data获取当前状态下的data,通过this.$options.data()获取该组件初始状态下的data。然后只要使用Object.assign(this.$data, this.$options.data())就可以将当前状态的data重置为初始状态,非常方便!

js中或者vue中 Object.assign()用法详解的更多相关文章

  1. CSS中伪类及伪元素用法详解

    CSS中伪类及伪元素用法详解   伪类的分类及作用: 注:该表引自W3School教程 伪元素的分类及作用: 接下来让博主通过一些生动的实例(之前的作业或小作品)来说明几种常用伪类的用法和效果,其他的 ...

  2. SVN组成中trunk,branches and tags功能用法详解

    SVN组成中trunk,branches and tags功能用法详解  我相信初学开发在SVN作为版本管理时,都估计没可能考虑到如何灵活的运用SVN来管理开发代码的版本,下面我就摘录一篇文章来简单说 ...

  3. Python中生成器和yield语句的用法详解

    Python中生成器和yield语句的用法详解 在开始课程之前,我要求学生们填写一份调查表,这个调查表反映了它们对Python中一些概念的理解情况.一些话题("if/else控制流&quot ...

  4. Vue插件编写、用法详解(附demo)

    Vue插件编写.用法详解(附demo) 1.概述 简单来说,插件就是指对Vue的功能的增强或补充. 比如说,让你在每个单页面的组件里,都可以调用某个方法,或者共享使用某个变量,或者在某个方法之前执行一 ...

  5. javascript学习总结之Object.assign()方法详解

    最近再写ES6的文章时候发现自己对Object.assign()方法不太了解,之前也没有接触过所以就就查阅了相关的资料,为了自己以后肯能会用到以及对知识进行巩固,所以在这里记录下自己学习的点点滴滴,毕 ...

  6. ThinkPHP中,display和assign用法详解

    thinkphp 模板显示display和assign的用法 $this->assign('name',$value); //在 Action 类里面使用 assign 方法对模板变量赋值,无论 ...

  7. oracle中的exists 和not exists 用法详解

    有两个简单例子,以说明 “exists”和“in”的效率问题 1) select * from T1 where exists(select 1 from T2 where T1.a=T2.a) ; ...

  8. oracle中的exists 和not exists 用法详解(转)

    有两个简单例子,以说明 “exists”和“in”的效率问题 1) select * from T1 where exists(select 1 from T2 where T1.a=T2.a) ; ...

  9. C#中哈希表(HashTable)的用法详解以及和Dictionary比较

    1.  哈希表(HashTable)简述 在.NET Framework中,Hashtable是System.Collections命名空间提供的一个容器,用于处理和表现类似keyvalue的键值对, ...

随机推荐

  1. 为什么C++类定义中,数据成员不能被指定为自身类型,但可以是指向自身类型的指针或引用?为什么在类体内可以定义将静态成员声明为其所属类的类型呢 ?

    static的成员变量,不是存储在Bar实例之中的,因而不会有递归定义的问题. 类声明: class Screen: //Screen类的声明 1 类定义: class Screen{ //Scree ...

  2. Ubuntu 安装字体

    将字体Copy到/usr/share/fonts/windows目录下,然后执行以下几条命令更新系统字体缓存: cd /usr/share/fonts/vista/ sudo mkfontscale ...

  3. storm系统架构学习

    Storm架构如下图所示: 1.主控节点(Master Node) 运行Storm nimbus后台服务的节点(Nimbus),它是storm系统的中心,负责接收用户提交的作业(如同spark sub ...

  4. MFC学习问题总结

    1.学习MFC添加位图,无法获取其ID 1).点击视图->其他窗口->资源视图,你会发现“无法在此窗口显示”,找到resource.h文件,关闭即可重新走一遍上面的过程就会发现可以打开了. ...

  5. TypeScript: this bind 和 回调的正确用法

    TypeScript 中如果传递了 而且在回调函数中用了this 的话, 就要小心了, 这个this 不一定是指向当前类对象了,如果想确保指向的还是那个对象的话, 需要在传递那个方法的时候, 先调用b ...

  6. ubuntu12.04下编译Linux tina 2.1/android经验

    用的是osboxes下的vdi. 编译Linux 1. 不能在root用户下操作 2. 执行 make kernel_menuconfig 报错,需要 apt-get install zlib1g z ...

  7. Ubuntu 16.04安装Tomcat 8

    此篇为http://www.cnblogs.com/EasonJim/p/7139275.html的分支页. 前提:必须正确安装JDK. 一.通过二进制包(tar.gz)安装 下载: https:// ...

  8. runtime MethodSwizzle 实践之扩展 NIAttributedLabel

    runtime MethodeSwizzle 提供 简单的方法交换已知类的  Method IMP. Method 可以是 外部可访问的 public 或者 private Method .所谓的属性 ...

  9. Vuex结合 async/await 优雅的管理接口请求

    先看看 async/await 的语法 async 函数返回一个 Promise 对象 async 函数内部 return 返回的值.会成为 then 方法回调函数的参数. 1 2 3 4 async ...

  10. 版本管理(二)之Git和GitHub的连接和使用

    首先需要注册登录GitHub:https://github.com 然后 ①:下载Git 先从Git官网,由于我的系统是64位的所以选择64-bit Git for Windows Setup htt ...