原文:$.extend(true,{},a,b)解析

版权声明: https://blog.csdn.net/bsfz_2018/article/details/81738437

什么是$.extend

jQuery.extend() 函数用于将一个或多个对象的内容合并到目标对象。

$.extend(true,{},a,b)

true:是否深度拷贝,不加为false,浅拷贝,加了深拷贝

{}:将合并结果保存到新对象,这样原对象将不会发生改变

a:第一个合并的对象

b:第二个合并的对象

浅拷贝

var defaults = {name:"张三",age:18,sex:"true",scores:{chinese:70,science:100}};
var options = {name:"李四",age:20,scores:{chinese:98,math:99,english:100}};
var settings = $.extend(defaults,options);
console.log(defaults);
console.log(options);
console.log(settings);

结果:



可以发现原对象发生改变,规则:a对象和b对象相同的部分,b覆盖a,不同的部分,a保留,b追加到a中

深拷贝

var defaults = {name:"张三",age:18,sex:"true",scores:{chinese:70,science:100}};
var options = {name:"李四",age:20,scores:{chinese:98,math:99,english:100}};
var settings = $.extend(true,defaults,options);
console.log(defaults);
console.log(options);
console.log(settings);



结果可以发现b不是像浅拷贝一样属性中的对象分数完全被覆盖,而是分数对象中的属性b覆盖a中相同的,b不同的追加,a中的保留

保存到新对象,不改变a对象的值

var defaults = {name:"张三",age:18,sex:"true",scores:{chinese:70,science:100}};
var options = {name:"李四",age:20,scores:{chinese:98,math:99,english:100}};
var settings = $.extend(true,{},defaults,options);
console.log(defaults);
console.log(options);
console.log(settings);



可以看出a对象没有发生改变,不同于上面第二个例子,即单纯的深度拷贝。这个例子的结果即使新对象{}被填充数据的结果

随机推荐

  1. jQuery----鼠标移动、点击案例

    单击隐藏: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <tit ...

  2. JSONModel

    JSONModel 一个解析 JSON 数据的开源库,可以将 JSON 数据直接解析成自定义的 model ,其中对数据类型的检查和对数据类型的转换比较贴心.最近在项目中使用了以后觉得确实方便很多,推 ...

  3. 使用ClassyShark压缩你的项目

    原文链接 : Shrinking Your Build With No Rules and do it with Class(yShark) 原文作者 : Roberto Orgiu 译文出自 : 开 ...

  4. [WASM] Write to WebAssembly Memory from JavaScript

    We write a function that converts a string to lowercase in WebAssembly, demonstrating how to set the ...

  5. Java Tread多线程(2)多线程安全问题

    作者 :卿笃军 原文地址:http://blog.csdn.net/qingdujun/article/details/39348093 本文演示,Tread多线程安全问题,以及几种解决多线程安全方式 ...

  6. position:absolute和margin:auto 连用实现元素水平垂直居中

    有时候,要实现一些元素水平垂直都居中,这部分元素呢 可能大小未知,例如一些图片或者是一些未知大小的块元素. 利用绝对定位可以将要居中的元素脱离文档流. position: absolute; left ...

  7. 11、V4L2摄像头获取单幅图片测试程序

    #根据网上常见的一个测试程序修改而来 by rockie cheng#include <stdio.h>#include <stdlib.h>#include <stri ...

  8. MFC的CListCtrl的使用与技巧

    http://blog.csdn.net/artechtor/article/details/2508070 列表控件可以看作是功能增强的ListBox,它提供了四种风格,而且可以同时显示一列的多中属 ...

  9. Windows Phone 8.1 数据处理

    Windows Phone 8.1 应用的数据存储位置包括: Installation Folder ApplicationData Credential Locker Known Folders S ...

  10. [Angular Directive] Write a Structural Directive in Angular 2

    Structural directives enable you to use an element as a template for creating additional elements. C ...