1 数组合并

1.1 concat 方法

1
2
3
4
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 循环遍历

1
2
3
4
5
6
7
8
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);

1
2
3
4
5
6
7
8
var arr1=['a','b'];
var arr2=['c','d','e'];
 
Array.prototype.push.apply(arr1,arr2);
 
//或者
 
arr1.push.apply(arr1,arr2);<br>console.log(arr1) //['a','b','c','d','e']

2 对象合并

2.1 $.extend()

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

2.2 遍历赋值

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

  

2.3 Obj.assign()

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

  Object.assign(target, ...sources)

1
2
3
//a. 复制一个对象<br>var obj = { a: 1 ,b:2};
var copyObj = Object.assign({}, obj);
console.log(copyObj); // { a: 1,b:2 }<br><br>//b.合并多个对象
1
2
3
4
5
6
7
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 中数组或者对象的深拷贝和浅拷贝

    浅拷贝 : 就是两个js 对象指向同一块内存地址,所以当obj1 ,obj2指向obj3的时候,一旦其中一个改变,其他的便会改变! 深拷贝:就是重新复制一块内存,这样就不会互相影响. 有些时候我们定义 ...

  2. JS中数组与对象的遍历方法实例小结

    一.数组的遍历: 首先定义一个数组 1 arr=['snow','bran','king','nightking']; 1.for循环,需要知道数组的长度; 2.foreach,没有返回值,可以不知道 ...

  3. js中数组Array对象的方法sort()的应用

    一. sort()方法的介绍 //给一组数据排序 var arrNum = [12,1,9,23,56,100,88,66]; console.log("排序前的数组:"+arrN ...

  4. JS中数组和对象的区别

  5. js中 给json对象添加属性和json数组添加元素

    js中 给json对象添加新的属性 比如现在有一个json对象为jsonObj,需要给这个对象添加新的属性newParam,同时给newParam赋值为pre.做法如下: var obj={ &quo ...

  6. js中如何访问对象和数组

    js中如何访问对象和数组 一.总结 一句话总结:js访问对象点和中括号,访问数组的话就是中括号 对象 . [] 数组 [] 1.js访问对象的两种方式? . [] 可以使用下面两种方式访问对象的属性和 ...

  7. js中数组方法大全

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

  8. js中两个对象的比较

    代码取自于underscore.js 1.8.3的isEqual函数. 做了一些小小的修改,主要是Function的比较修改. 自己也加了一些代码解读. <!DOCTYPE html> & ...

  9. js中的json对象详细介绍

    JSON一种简单的数据格式,比xml更轻巧,在JavaScript中处理JSON数据不需要任何特殊的API或工具包,下面为大家详细介绍下js中的json对象, 1.JSON(JavaScript Ob ...

随机推荐

  1. Linux下编译PHP常见错误及解决方法

    1.configure: error: xml2-config not found. Please check your libxml2 installation.yum install libxml ...

  2. 简单的scrapy实例

    前天实验室的学长要求写一个简单的scrapy工程出来,之前也多少看了点scrapy的知识,但始终没有太明白,刚好趁着这个机会,加深一下对scrapy工作流程的理解.由于临近期末,很多作业要做(其实.. ...

  3. 【HDU - 1495】非常可乐

    -->非常可乐  Descriptions: 大家一定觉的运动以后喝可乐是一件很惬意的事情,但是seeyou却不这么认为.因为每次当seeyou买了可乐以后,阿牛就要求和seeyou一起分享这一 ...

  4. DataBinding的用法

    一.基本介绍 DataBinding数据绑定库是一种支持库,借助该库,可以使用声明性格式(而非程序化地)将布局中的界面组件绑定到应用中的数据源.这是官方给出的介绍. 那么为什么要使用DataBindi ...

  5. 深入理解C#的装箱和拆箱

    个人理解(本质): 封箱是把值类型转换为引用类型 拆箱是把引用类型转换为值类型 封箱是把值类型转换为System.Object类型,或者转换为由值类型实现的接口类型: 例如: struct Mystr ...

  6. C++学习书籍推荐《C++ Concurrency in Action》下载

    百度云及其他网盘下载地址:点我 目录 Hello, world of concurrency in C++! Managing threads Sharing data between threads ...

  7. Java学习笔记之---流程控制语句

    Java学习笔记之---流程控制语句 (一)循环语句 (1)if语句 if(布尔表达式){ //如果布尔表达式为true将执行的语句 } if(i%2!=0){ System.out.println( ...

  8. Event StoryLine Corpus 论文阅读

    Event StoryLine Corpus 论文阅读 本文是对 Caselli T, Vossen P. The event storyline corpus: A new benchmark fo ...

  9. Java 读取PDF中的文本和图片

    本文将介绍通过Java程序来读取PDF文档中的文本和图片的方法.分别调用方法extractText()和extractImages()来读取.   使用工具:Free Spire.PDF for Ja ...

  10. 开源框架Autofac使用入门

    目录导航 1.Autofac是什么 1.1什么是DI和IOC 1.2DI和IOC在项目中起到什么作用 2.Autofac如何使用 2.1下载 2.2代码Demo 2.3Demo分析 3总结 1.Aut ...