JS中对象赋值只传值不传对象(地址)的方法,改变新值不影响旧值

使用JS有一个很恼人的问题,当我把对象赋值给新的对象后,新的对象改变了,旧的对象也会跟着改变,如以下例子:

  // 被引用的对象
    var oldModel = {
      name: "oldModel",
      value: 123
    }
    // 新的对象从旧的对象赋值
    var newModel = oldModel
    // 只改变新对象的值
    newModel.name = "newModel"
    console.log("打印oldModel")
    console.log(oldModel)
    console.log("-------------")
    console.log("打印newModel")
    console.log(newModel)
image.png

按照我们预期的结果,打印的oldModel的name应该还是oldModel才对。

出现这问题,主要是因为在JS里面使用的是地址引用,所以无论你修改的是新对象还是旧对象,实际上操作的都是同一个对象。

解决方法:
我们在给对象赋值的时候,改成 var newModel = $.extend(true,{},oldModel) 就可以了

 // 被引用的对象
    var oldModel = {
      name: "oldModel",
      value: 123
    }
    // 新的对象从旧的对象赋值
    var newModel = $.extend(true,{},oldModel)
    // 只改变新对象的值
    newModel.name = "newModel"
    console.log("打印oldModel")
    console.log(oldModel)
    console.log("-------------")
    console.log("打印newModel")
    console.log(newModel)
image.png

现在再看效果,改变新对象,旧对象不会再跟着改变了。
恼人的问题终于解决了!

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 前端开发面试题 面试题目: 根据你的等级和职位的变化,入门级到专家级,广度和深度都会有所增加。 题目类型: 理论知...
    怡宝丶阅读 2,611评论 0 7
  • 概要 64学时 3.5学分 章节安排 电子商务网站概况 HTML5+CSS3 JavaScript Node 电子...
    阿啊阿吖丁阅读 9,350评论 0 3
  • @转自GitHub 介绍js的基本数据类型。Undefined、Null、Boolean、Number、Strin...
    YT_Zou阅读 1,213评论 0 0
  • 第一章: JS简介 从当初简单的语言,变成了现在能够处理复杂计算和交互,拥有闭包、匿名函数, 甚至元编程等...
    LaBaby_阅读 1,706评论 0 6
  • JavaScript 介绍js的基本数据类型。 Undefined、Null、Boolean、Number、St...
    cuikangjie阅读 480评论 0 3