javascript 數組的深度復制


javascript 數組的深度復制

一般情況下,使用 “=” 可以實現賦值。但對於數組、對象、函數等這些引用類型的數據,這個符號就不好使了。

1. 數組的簡單復制

1.1 簡單遍歷

最簡單也最基礎的方式,自然是循環處理。示例:

function array_copy(arr) {

    var out = [], i, len;

    if (out[i] instanceof Array === false){

    return arr;

    }

    for (i = 0, len = arr.length; i < len; i++) {

        if (out[i] instanceof Array){

            out[i] = deepcopy(arr[i]);

        } else {

        out[i] = arr[i];

        }

    };

    return a;

}

//測試

var arr1 = [1, 2, 3, 4],

arr2 = array_copy(arr1);

console.log(arr1, arr2);

arr2[2] = 10;

console.log(arr1[2], arr2[2]);

1.2 變通的復制實現

經常出現在面試題中的取巧方法,是使用 slice 或 contcat 方法實現。示例:

var arr1 = [1, 2, 3, 4],

arr2 = arr1.slice(0),

arr3 = arr1.concat();

console.log(arr1, arr2, arr3);

arr2[2] = 10;

arr3[2] = 11;

console.log(arr1[2], arr2[2], arr3[2]);

2. 數組的深度復制

普通的一維數組且值為非引用類型,使用上述方法是沒有問題的,否則就比較麻煩了。深度復制需要考慮數組值為各種引用類型的情況。

2.1 使用 JSON 方法

JSON.stringify(array) 然后再 JSON.parse()。示例:

var arr1 = [1, 2, [3, 4], {a: 5, b: 6}, 7],

arr2 = JSON.parse(JSON.stringify(arr1));

console.log(arr1, arr2);

arr2[1] = 10;

arr2[3].a = 20;

console.log(arr1[1], arr2[1]);

console.log(arr1[3], arr2[3]);

此方法存在對古老瀏覽器的兼容性問題。如確需要作兼容,可引入如下兼容文件解決:

https://github.com/douglascrockford/JSON-js/blob/master/json2.js

注意:如果數組值為函數,上述方法還是不行的。

2.2 深度復制的完全實現

考慮到多維數組的嵌套,以及數組值為對象的情況,可以作如下原型擴展(當然寫為普通函數實現也是可以的,原型擴展是不建議的方式):

Object.prototype.clone = function () {

    var o = {};

    for (var i in this) {

        o[i] = this[i];

    }

    return o;

};

Array.prototype.clone = function () {

    var arr = [];

    for (var i = 0; i < this.length; i++)

    if (typeof this[i] !== 'object') {

        arr.push(this[i]);

    } else {

        arr.push(this[i].clone());

    }

    return arr;

};

//測試1 Object

var obj1 = {

    name: 'Rattz',

    age: 20,

    hello: function () {

        return "I'm " + name;

    }

};

var obj2 = obj1.clone();

obj2.age++;

console.log(obj1.age);

//測試2 Array

var fun = function(log) {console.log},

arr1 = [1, 2, [3, 4], {a: 5, b: 6}, fun],

arr2 = arr1.clone();

console.log(arr1, arr2);

arr2[2][1]= 'Mike';

arr2[3].a = 50;

arr2[4] = 10;

console.log(arr1, arr2);

2.3 使用 jQuery 的 extend 方法

如果你在使用 jQuery,那么最簡單的方法是使用 extend 插件方法。示例:

var arr1 = [1, 2, [3, 4], {a: 5, b: 6}, 7],

arr2 = $.extend(true, [], arr1);

console.log(arr1, arr2);

arr2[1] = 10;

console.log(arr1, arr2);

來源於 伯樂在線

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM