转载:https://www.cnblogs.com/DJeanWeb/p/4388689.html

$.extend
一般情景下,使用深度拓展两个对象时,我们想要的效果是,b对象覆盖掉a对象中存在的所有属性,没有则新增到a对象中;
下面我们看一下我所遇到的问题:

我希望通过深度拓展将tmp中的editoption覆盖掉ret中的editoption;所以采用了深度拓展方法  ret = $.extend(true,{},ret,tmp);
但结果并没有达到我想要的效果:

对象属性中的数组长度依然没有发生变化。
通过样例比较发现,数组长度虽然没有发生变化,但是数组前排列在前8位的值发生了改变,也就是是说,变量深度拓展覆盖到了数组的值,而不是覆盖掉整个数组对象。

注意如果直接使用$.extend(a,b)将改变a对象值。注意对象引用引发的神奇bug

因为$.extend(a,b)返回的是将a通过与b融合以后的结果,a对象会被改变。

最后我直接使用$.extend({},a,b)解决此需求:即不改变a,b对象的引用,也返回了我想要的值。

总结:即使简单的方法,也需深入理解,避免潜意识里的认知干扰对事物的判断。

对象的深度拓展$.extend(true,{},a,b),深入理解,小心陷阱的更多相关文章

  1. jQuery中$.extend(true,object1, object2);深拷贝对象

    语法:jQuery.extend( [deep ], target, object1 [, objectN ] ) 深浅拷贝对应的参数就是[deep],是可选的,为true或false.默认情况是fa ...

  2. 对象拷贝:jQuery extend

    今天操作一个Array数组对象,本来想着先取出该数组某一行数据,然后把该数据当作另一份数据进行操作. 结果发现,对该数据操作的同时,也对Array数组进行了修改,因为这个数据指向了array数组对象. ...

  3. javascript中对数组对象的深度拷贝

    在前端开发的某些逻辑中,经常需要对现有的js对象创建副本,避免污染原始数据的情况. 如果是简单的一维数组对象,可以使用两个原生方法: 1.splice var arr1 = ['a', 'b', 'c ...

  4. Angular2中实现基于TypeScript的对象合并方法:extend()

    TypeScript里面没有现成的合并对象的方法,这里借鉴jQuery里的$.extend()方法.写了一个TypeScript的对象合并方法,使用方法和jQuery一样. 部分代码和jQuery代码 ...

  5. $.extend(true,{},a,b)解析

    原文:$.extend(true,{},a,b)解析 版权声明: https://blog.csdn.net/bsfz_2018/article/details/81738437 什么是$.exten ...

  6. javascript中对象的深度克隆

    记录一个常见的面试题,javascript中对象的深度克隆,转载自:http://www.2cto.com/kf/201409/332955.html 今天就聊一下一个常见的笔试.面试题,js中对象的 ...

  7. JavaScript实现对象的深度克隆及typeof和instanceof【简洁】【分享】

    JavaScript实现对象的深度克隆 代码实现如下: <!DOCTYPE html> <html lang="en"> <head> < ...

  8. 继承 原生js 与 $.extend(true,default,opts||{});

    $.extend(true,default,opts||{}); var obj1={ name:'liu', sex:'m', work:'pc' } var obj2={ sex:'w' } va ...

  9. c#:如何处理对对象进行深度拷贝

    /// <summary> /// 对对象进行深度拷贝 /// </summary> /// <param name="obj"></pa ...

随机推荐

  1. Map 综述(三):彻头彻尾理解 ConcurrentHashMap

    https://blog.csdn.net/justloveyou_/article/details/72783008

  2. Day 24 继承

    # 一.什么是继承 # 继承是一种创建新类的方式,在python中,新建的类可以继承一个或多个父类,父类又可成为基类或超类,新建类称为派生类或子类.# python中类的继承分为:单继承和多继承cla ...

  3. 201621123023《Java程序设计》第5周学习总结

    一.本周学习总结 1.1 写出你认为本周学习中比较重要的知识点关键词 接口.interface.comparable.comparator 1.2 尝试使用思维导图将这些关键词组织起来.注:思维导图一 ...

  4. if判断和switch case 和三元运算符整理

    if判断和switch case 和三元运算符整理 例子1:if判断写法: <script type="text/javascript"> var num = 12; ...

  5. Chrome浏览器插件开发-淘宝自动登录

    浏览器插件的介绍 Chrome浏览器插件开发的准备工作 manifest.json配置介绍 页面如何注入scripts文件 一. 浏览器插件的介绍 浏览器插件是一种遵循一定规范的应用程序接口编写出来的 ...

  6. 什么是Ajax?Ajax的原理是什么?Ajax的核心技术是什么?Ajax的优缺点是什么?

    Ajax是一种无需重新加载整个网页,能够更新部分网页的技术.Asynchronous JavaScript and XML的缩写,是JavaScript.XML.CSS.DOM等多个技术的组合. Aj ...

  7. JS弹出对话框函数alert(),confirm(),prompt()

    1,警告消息框alert() alert 方法有一个参数,即希望对用户显示的文本字符串.该字符串不是 HTML 格式.该消息框提供了一个“确定”按钮让用户关闭该消息框,并且该消息框是模式对话框,也就是 ...

  8. 非对齐访问(unaligned accesses)

    从CPU角度看内存访问对齐 结构体成员非对齐访问所带来的思考 ARM体系中存储系统非对齐的存储访问操作 什么是cache line? cache line就是处理器从RAM load/store数据到 ...

  9. easyUI combobox下拉框很长,easyUI combobox下拉框如何显示滚动条的解决方法

    如下图,combobox下拉框里内容很多时,会导致下拉框很长,很不美观. 如何使得combobox下拉框显示滚动条 方法:把属性panelHeight:"auto"注释掉即可. $ ...

  10. CentOS7启动Tomcat报错:./startup.sh: Permission denied

    错误信息:./startup.sh: Permission denied 执行./startup.sh,或者./shutdown.sh的时候, 报:Permission denied,因为是执行tom ...