1 数组合并

1.1 concat 方法

var a = [1,2,3], b = [4,5,6];
var c = a.concat(b);
console.log(c);// 1,2,3,4,5,6
console.log(a);// 1,2,3 不改变本身

1.2 循环遍历

var arr1 = ['a','b'];
var arr2 = ['c','d','e']; for(var i=0;i<arr2.length;i++){
arr1.push(arr2[i]);
} console.log(arr1); //['a','b','c','d','e']

1.3 apply

合并数组arr1和数组arr2,使用Array.prototype.push.apply(arr1,arr2) or arr1.push.apply(arr1,arr2);

var arr1 = ['a','b'];
var arr2 = ['c','d','e']; Array.prototype.push.apply(arr1,arr2);
//或者
arr1.push.apply(arr1,arr2); console.log(arr1); // ['a','b','c','d','e']

2 对象合并

2.1 $.extend()

var obj1 = {'a': 1};
var obj2 = {'b': 1};
var c = $.extend(obj1, obj2); console.log(obj1); // {a: 1, b: 1} obj1已被修改 //或者
var obj3 = $.extend({}, obj1, obj2);
console.log(obj3); // {a: 1, b: 1} 不会改变obj1,obj2

2.2 遍历赋值

var obj1 = {'a':1};
var obj2 = {'b':2,'c':3}; for(var key in obj2){
if(obj2.hasOwnProperty(key)===true){
// 此处hasOwnProperty是判断自有属性
// 使用 for in 循环遍历对象的属性时,原型链上的所有属性都将被访问会避免原型对象扩展带来的干扰
obj1[key]=obj2[key];
}
} console.log(obj1); // {'a':1,'b':2,'c':3};

2.3 Obj.assign()

可以把任意多个的源对象自身的可枚举属性拷贝给目标对象,然后返回目标对象。

Object.assign(target, …sources)

//a. 复制一个对象
var obj = { a: 1 ,b:2};
var copyObj = Object.assign({}, obj);
console.log(copyObj); // { a: 1,b:2 } //b.合并多个对象
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 }, 且目标对象自身也会改变。

2.4 对象的深拷贝和浅拷贝

2.4.1 浅拷贝

var obj1 = {'a':1};
var obj2 = {'b':{'b1':22,'b2':33}}; $.extend(obj1, obj2); //obj1拷贝了obj2的属性 console.log(obj1) // {'a':1,'b'{'b1':22,'b2':33}}
console.log(obj1.b.b1) // 22 obj2.b.b1 = 44; //obj2重新赋值
console.log(obj1.b.b1) // 44 obj1.b仅拷贝了对象的指引,所以受原obj2的影响

2.4.2 深拷贝

var obj1 = {'a':1};
var obj2 = {'b':{'b1':22,'b2':33}}; $.extend(true,obj1, obj2); //第一个参数设为true表示深复制 console.log(obj1) // {'a':1,'b'{'b1':22,'b2':33}}
console.log(obj1.b.b1) // 22 obj2.b.b1 = 44; //obj2重新赋值
console.log(obj1.b.b1); // 22 obj1拷贝了obj2的所有属性以及值,并不受obj2的影响

.

js中数组的合并和对象的合并的更多相关文章

  1. js中数组,字符串,对象常用方法总结

    时间对象方法 获取当前时间的毫秒数 1.var timestamp = Date.parse(new Date()); 2.var timestamp = (new Date()).valueOf() ...

  2. JS中如何判断对象是对象还是数组

    JS中如何判断对象是对象还是数组 一.总结 一句话总结:typeof Array.isArray === "function",Array.isArray(value)和Objec ...

  3. js中数组方法大全

    js数组方法大全 一:前言 我们在学到js中数组的时候,我们会接触到js中数组的一些方法,这些方法对我们来说,可以很遍历的达到我们想要的结果,但是因为方法比较多,有些方法也不常用,可能会过一段时间就会 ...

  4. php和js中数组的总结

      php中数组的表示方法:array()或者[] js中数组的表示方法:new array()或者[] 一.php中初始化命名数组 在PHP中声明数组的方式主要有两种:一是应用array()函数声明 ...

  5. JS中数组的介绍

    一.数组: 一组数据的集合: 二.JS中数组的特点: 1.数组定义时无需指定数据类型: 2.数组定义时可以无需指定数组长度: 3.数组可以存储任何类型的数据: 4.一般是相同的数据类型: 三.数组的创 ...

  6. js中数组如何使用

    js中数组如何使用 一.总结 一句话总结:new Array()和[]两种方法都可以创建数组. 二.js中创建数组,并往数组里添加元素 数组的创建 var arrayObj = new Array() ...

  7. js中数组扁平化处理

  8. js中数组去重的几种方法

    js中数组去重的几种方法         1.遍历数组,一一比较,比较到相同的就删除后面的                 function unique(arr){                 ...

  9. JavaScript -- 时光流逝(二):js中数组的方法

    JavaScript -- 知识点回顾篇(二):js中数组的方法 1. 数组 (1)定义数组,数组赋值 <script type="text/javascript"> ...

  10. js中数组增删查改unshift、push、pop、shift、slice、indexOf、concat、join

    js中数组增删查改unshift.push.pop.shift.slice.indexOf.concat.join

随机推荐

  1. 64位操作系统安装32位客户端和PL/SQL

    PL/SQ只能使用32位的Oracle客户端.在64位系统下安装了64位的oracle 11g,使用PL/SQL需再安装32位Oracle客户端. 按以下方法试验成功: 1)安装32位的Oracle客 ...

  2. error LNK2001: unresolved external symbol "int g_cTemplates" (?g_cTemplates@@3HA)(转)

    原文转自:http://blog.sina.com.cn/s/blog_639a2ad70101kpen.html 编译directshow若干问题的解决 1.安装好windows sdk,进入dir ...

  3. 华为上机测试题(大数相乘-java)

    PS:这个不是自己写的,测试OK,供参考. /** * 大数相乘 */ public class BigData { public static void main(String[] args) { ...

  4. 【排序算法】java实现

    1.冒泡排序 最简单的排序实现,冒泡排序,是一种交换排序,它的基本思想是:两两比较相邻记录的关键字,如果反序则交换,直到没有反序的记录为止. //冒泡排序 private int[] bubbleSo ...

  5. asp.net 网站模板怎么用,就是16aspx上面下下来的模板,里面有个sln文件,其他全是文件夹的东西

    .net写的程序模板一般都被写死了.那样只有通过程序改了.

  6. Guava源码学习(五)EventBus

    基于版本:Guava 22.0 Wiki:EventBus 0. EventBus简介 提供了发布-订阅模型,可以方便的在EventBus上注册订阅者,发布者可以简单的将事件传递给EventBus,E ...

  7. 新疆大学ACM-ICPC程序设计竞赛五月月赛(同步赛)C 勤奋的杨老师【DP/正反LIS/类似合唱队形】

    链接:https://www.nowcoder.com/acm/contest/116/C 来源:牛客网 题目描述 杨老师认为他的学习能力曲线是一个拱形.勤奋的他根据时间的先后顺序罗列了一个学习清单, ...

  8. 服务的注册与发现Eureka(二)

    1.服务治理概念 在传统rpc远程调用中,服务与服务依赖关系,管理比较复杂,所以需要使用服务治理,管理服务与服务之间依赖关系,可以实现服务调用.负载均衡.容错等,实现服务发现与注册. 2.服务的注册与 ...

  9. Map集合-根据宠物昵称查找宠物

    package collection; /** * 宠物类 * @author * */ public class Pet { private String name; private String ...

  10. tomcat重启应用和tomcat重启是两回事。热部署就是重启应用

    tomcat重启应用和tomcat重启是两回事.热部署就是重启应用 tomcat重启应用和tomcat重启是两回事.热部署就是重启应用 tomcat可以设置检测到新的class后重启该应用(不是重启t ...