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. HDU 5245 Joyful(概率题求期望)

    D - Joyful Time Limit:1000MS     Memory Limit:65536KB     64bit IO Format:%I64d & %I64u Submit S ...

  2. Spring中报"Could not resolve placeholder"的解决方案(引入多个properties文件)

    除去properites文件路径错误.拼写错误外,出现"Could not resolve placeholder"很有可能是使用了多个PropertyPlaceholderCon ...

  3. centos 安装使用smb

    http://blog.csdn.net/edu_enth/article/details/52964295

  4. java keytool证书工具使用小结(转)

    Keytool 是一个Java数据证书的管理工具 ,Keytool将密钥(key)和证书(certificates)存在一个称为keystore的文件中在keystore里,包含两种数据:密钥实体(K ...

  5. ubuntu 开启PHP CURL支持

    sudo apt-get install php5-curl sudo service apache2 restart

  6. SQLite中的内连接简化技巧

    SQLite中的内连接简化技巧   在SQLite中,通过内连接可以将两个表通过条件表达式关联起来,构成一个新记录集或视图.形式如下:   SELECT ... FROM t1 JOIN t2 ON ...

  7. c++ —— .bat 对拍

    #include<cstdio> #include<cstring> #include<iostream> #include<algorithm> #i ...

  8. [BZOJ4398]福慧双修/[BZOJ2407]探险

    题目大意: 给定一个$n(n\leq40000)$个点$m(m\leq100000)$条边的有向图,求从$1$出发回到$1$的不经过重复结点的最短路. 思路: 首先Dijkstra求出从1出发到每个结 ...

  9. linux 之创建文件命令

    1.vi vi 1.txt 会直接创建并打开一个文件1.txt 2.touch touch的作用是更改一个文件或目录的时间.touch 2.txt 如果2.txt不存在,则创建空文件2.txt 3.e ...

  10. IE8下 input标签内padding失效

    在做网页兼容时 发现在ie8下的input内用padding失效 为了达到居中文字的效果 使用line-height可以解决问题