js数组复制

转自于 http://blog.csdn.net/github_34514750/article/details/56677750

js数组也是很重要的一块,所以准备对数组的操作等写一个系列。 
1.第一部分是二元数组的基础知识。 
http://blog.csdn.net/github_34514750/article/details/51049935 
2.第二部分讲解数组的几种合并方法优劣比较 
http://blog.csdn.net/github_34514750/article/details/51320982 
3.本部分讲解数组简单复制和深度复制

对于简单复制中对象只是简单的=复制,也就是只是保存了内存地址,不是完全复制,这样修改对象的时候,会把原对象和复制对象一起修改。

深度复制则是修改复制后的对象不会影响原始对象。

简单复制

对于数组,对象,函数等引用类型的数据,等号只是保存了内存地址,而不是完全复制。

1.使用 slice 或 contcat 方法实现简单复制

简单数组如下:

var arr1 = [1, 2, 3, 4],
arr2 = arr1.slice(0),
arr3 = arr1.concat();

console.log(arr1, arr2, arr3);//[1, 2, 3, 4] [1, 2, 3, 4] [1, 2, 3, 4],
arr2[2] = 10;
arr3[2] = 11;
console.log(arr1[2], arr2[2], arr3[2]); //3 10 11
 
 
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8

有对象和函数或者数组的数组,简单值不一起改变,但是引用类型则原来对象和复制对象一起改变

var fun = function(log) {console.log},
arr1 = [1, 2, [3, 4], {a: 5, b: 6}, fun],
arr2 = arr1.slice(0),
arr3 = arr1.concat();

arr1[0] = 10;
arr3[2][1] = 5;
arr2[3].a = 100;

console.log(arr1, arr2, arr3);
 
 
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10

这里写图片描述

深度复制

1.使用jq的$.extend(true,target,obj)

var arr1 = [1, 2, [3, 4], {a: 5, b: 6}, 7],
arr2 = $.extend(true, [], arr1);
 
 
  • 1
  • 2

2.深度复制的完全实现

考虑多维数组的嵌套,以及数组值为对象的情况,可以作如下原型扩展

newobj = Object.create(sourceObj)

Object.prototype.clone = function() {
    var obj = {};

    for(var i in this) {
        obj[i] = this[i];
    }

    return obj;
}

Array.prototype.clone = function() {
    var len = this.lenght,
        arr = [];

    for(var i = 0;i < len;i++) {
        if(typeof this[i] !== "object") {
            arr.push(this[i]);
        } else {
            arr.push(this[i].clone());
        }
    }
    return arr;
}

//测试Object
var obj1 = {
    name: 'Rattz',
    age: 20,
    hello: function () {
        return "I'm " + name;
    }
};
var obj2 = obj1.clone();
obj2.age++;
console.log(obj1.age);//20

//测试2 Array
var fun = function(log) {console.log},
arr1 = [1, 2, [3, 4], {a: 5, b: 6}, fun],
arr2 = arr1.clone();
 
 
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40

3.使用JSON方法

newObj = JSON.parse(JSON.stringify(sourceObj));

var arr1 = [1, 2, [3, 4], {a: 5, b: 6}, 7],
    arr2 = JSON.parse(JSON.stringify(arr1));

console.log(arr1, arr2);//[1, 2, [3, 4], {a: 5, b: 6}, 7] [1, 2, [3, 4], {a: 5, b: 6}, 7],
arr2[1] = 10;
arr2[3].a = 20;
console.log(arr1[1], arr2[1]);//2 10
console.log(arr1[3], arr2[3]);//{a: 5, b: 6} {a:20,b:6}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值