数组和对象的深拷贝

一、数组的深拷贝

  var arr = ["one", "two", "three"];

  var arrCopy = arr;

  arrCopy[1] = "test";

  console.log(arr);       //["one", "test", "three"]

  console.log(arrCopy);    //["one", "test", "three"]

  1.如果直接将一个数组赋值给另一个数组,那么改变其中一个,另一个也会改变,这是数组的浅拷贝。

  2.解决方案:利用数组的slice和concat方法,这两个方法都在不会改变原数组的基础上而产生一个新数组。  

    var arr = ["one", "two", "three"];

    var arrCopy = arr.slcie(0);  // arrCopy = arr.concat();

    arrCopy[1] = "test";

    console.log(arr);       //["one", "two", "three"]

    console.log(arrCopy);    //["one", "test", "three"]

二、对象的深拷贝

  var json = {name: "aaa", age: 12};

  var jsonCopy = json;

  jsonCopy.name = "bbb";

  console.log(json);       // {name: "bbb", age: 12}

  console.log(jsonCopy);    // {name: "bbb", age: 12}

  1.同理,对象这样直接赋值也是浅拷贝。

  2.解决方案:就是把对象的属性遍历一遍,赋给一个新的对象。

    var json = {name: "aaa", age: 12};

    var jsonCopy = new Object();

    jsonCopy.name = json.name;

    jsonCopy.age = json.age;

    jsonCopy.name = "bbb";

    console.log(json);       // {name: "aaa", age: 12}

    console.log(jsonCopy);    // {name: "bbb", age: 12}

  

  var deepCopy = function(source) {
    var result={};
    for (var key in source) {
      result[key] = typeof source[key]===‘object‘? deepCopy(source[key]): source[key];
    }
    return result;
  }

时间: 2024-11-06 19:04:19

数组和对象的深拷贝的相关文章

javascript 数组以及对象的深拷贝(复制数组或复制对象)的方法

javascript 数组以及对象的深拷贝(复制数组或复制对象)的方法 前言 在js中,数组和对象的复制假设使用=号来进行复制.那仅仅是浅拷贝. 例如以下图演示: 如上.arr的改动,会影响arr2的值,这显然在绝大多数情况下,并非我们所须要的结果. 因此,数组以及对象的深拷贝就是javascript的一个基本功了. 数组的深拷贝 条条大道通罗马,实现数组的深拷贝.是有好几种方法的.举比例如以下: for 循环实现数组的深拷贝 for循环是很好用的.假设不知道高级方法.通过for循环可以完毕我们

JS中实现数组和对象的深拷贝和浅拷贝

数组的拷贝 > 数组的深拷贝,两层 var arr = [[1,2,3],[4,5,6],[7,8,9]]; var arr2 = []; 循环第一层数组 for(var i=0,len=arr.length;i<len;i++){ 循环第二层数组 for(var k=0,lens=arr[i].length;k<lens;k++){ 把每一个数组的内容添加到数组2中 arr2.push(arr[i][k]); } } console.log(arr2); //[1, 2, 3, 4,

Vue实现对数组、对象的深拷贝、复制

当组件间传递对象时,由于此对象的引用类型指向的都是一个地址(除了基本类型跟null,对象之间的赋值,只是将地址指向同一个,而不是真正意义上的拷贝),如下 数组: var a = [1,2,3]; var b = a; b.push(4); // b中添加了一个4 alert(a); // a变成了[1,2,3,4] 对象: var obj = {a:10}; var obj2 = obj; obj2.a = 20; // obj2.a改变了, alert(obj.a); // 20,obj的a跟

JS中深拷贝数组、对象、对象数组方法

我们在JS程序中需要进行频繁的变量赋值运算,对于字符串.布尔值等可直接使用赋值运算符 "=" 即可,但是对于数组.对象.对象数组的拷贝,我们需要理解更多的内容. 首先,我们需要了解JS的浅拷贝与深拷贝的区别. 我们先给出一个数组: var arr = ["a","b"]; 现在怎么创建一份arr数组的拷贝呢?直接执行赋值运算吗?我们来看看输出结果 var arrCopy = arr; arrCopy[1] = "c"; arr

C#对象的深拷贝与浅拷贝

转载自:http://blog.163.com/hr_msn/blog/static/21549405120132250396584/ 深拷贝是指源对象与拷贝对象互相独立,其中任何一个对象的改动都不会对另外一个对象造成影响.举个例子,一个人名叫张三,后来用他克隆(假设法律允许)了另外一个人,叫李四,不管是张三缺胳膊少腿还是李四缺胳膊少腿都不会影响另外一个人.比较典型的就是Value(值)对象,如预定义类型Int32,Double,以及结构(struct),枚举(Enum)等. 考虑以下写法 in

javascript -- 对象(深拷贝、浅拷贝)

拷贝:顾名思义就是复制. 1.浅拷贝:把父对象的属性,全部拷贝到子对象 function extendCopy(p) { var c = { }; for (var i in p) { c[i] = p[i] }; return c; } 2. 深拷贝就是能实现真正意义上的数组和对象的拷贝.   function deepCopy(p, c) { var c = c || {}; for (var i in p) { if (typeof p[i] === "object") { c[

探究JS中对象的深拷贝和浅拷贝

深拷贝和浅拷贝的区别 在讲深拷贝和浅拷贝的区别之前,回想一下我们平时拷贝一个对象时是怎么操作的?是不是像这样? var testObj1 = {a: 1, b:2}, testObj2=testObj1; testObj1.a = 7; console.log(testObj1); //{a: 7, b:2} console.log(testObj2); //{a: 7, b:2} 发现问题了吗?当testObj1变化时,testObj2相应的属性跟着变化了.这就是属于浅拷贝了,而所谓的深拷贝就

JS中如何进行对象的深拷贝

在JS中,一般的=号传递的都是对象/数组的引用,并没有真正地拷贝一个对象,那如何进行对象的深度拷贝呢?如果你对此也有疑问,这篇文章或许能够帮助到你 一.对象引用.浅层拷贝与深层拷贝的区别 js的对象引用传递理解起来很简单,参考如下代码: var a = {name:'wanger'} var b = a ; a===b // true b.name = 'zhangsan' a.name //'zhangan' 上述代码中,使用了=进行赋值,于是b指向了a所指向的栈的对象,也就是a与b指向了同一

js中数组和对象的合并

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