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);

来源于 伯乐在线

时间: 2024-12-28 23:30:38

javascript 数组的深度复制的相关文章

深入探讨JavaScript如何实现深度复制(deep clone)

在代码复用模式里面有一种叫做“复制属性模式”(copying properties pattern).谈到代码复用的时候,很有可能想到的是代码的继承性(inheritance),但重要的是要记住其最终目标——我们要复用代码.继承性只是实现代码复用的一种手段,而不是唯一的方法.复制属性也是一种复用模式,它跟继承性是有所不同的.这种模式中,对象将从另外一个在对象中获取成员,其方法是仅需将其复制即可.用过jQuery的都知道,它有一个$.extend()方法,它的用途除了扩展第三方插件之外,还可以用来

深度解析javascript中的浅复制和深复制

原文:深度解析javascript中的浅复制和深复制 在谈javascript的浅复制和深复制之前,我们有必要在来讨论下js的数据类型.我们都知道有Number,Boolean,String,Null,Undefined,Object五种类型.而Object又包含Function,Array和Object自身.前面的五种类型叫做基本类型,而Object是引用类型.可能有人就要问,为什么要分基本类型和引用类型呢?后面你就会明白的. 我们首先来看看浅复制和深复制的简洁定义: 深复制:直接将数据复制给

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

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

JavaScript 中的对象深度复制(Object Deep Clone)

JavaScript中并没有直接提供对象复制(Object Clone)的方法. JavaScript中的赋值,其实并不是复制对象,而是类似`c/c++`中的引用(或指针),因此下面的代码中改变对象b中的元素的时候,也就改变了对象a中的元素. a = {k1:1, k2:2, k3:3}; b = a; b.k2 = 4; 如果只想改变b而保持a不变,就需要对对象a进行复制. 用jQuery进行对象复制 在可以使用jQuery的情况下,jQuery自带的extend方法可以用来实现对象的复制.

JavaScript数组方法对比(深度学习数组)

JavaScript数组方法对比 众所周知,JavaScript提供了许多对数组进行改变的方法,但是有些会对原数组进行影响,有些不会.下边就列举出来. 一.新增 影响原数组 array.push()  //向数组的末尾添加一个或更多元素,并返回新的长度. var array =[1,2,3,4,5]; array.push(6); // [1,2,3,4,5,6]; array.unshift() //向数组的开头添加一个或更多元素,并返回新的长度. var array =[1,2,3,4,5]

LeetCode138 Copy List with Random Pointer(深度复制带有随机指针的链表) Java题解

题目: A linked list is given such that each node contains an additional random pointer which could point to any node in the list or null. Return a deep copy of the list. 解题: 这题是要复制一个链表,这个链表比普通的链表多一个指针,这个指针可以指向任意地方,可以为空也可以为链表中的任一个节点,今天中午的时候我同学和我说起这题,当时问

【转】JavaScript中的对象复制(Object Clone)

JavaScript中并没有直接提供对象复制(Object Clone)的方法.因此下面的代码中改变对象b的时候,也就改变了对象a. a = {k1:1, k2:2, k3:3}; b = a; b.k2 = 4; 如果只想改变b而保持a不变,就需要对对象a进行复制. 用jQuery进行对象复制 在可以使用jQuery的情况下,jQuery自带的extend方法可以用来实现对象的复制. a = {k1:1, k2:2, k3:3}; b = {}; $.extend(b,a); 自定义clone

JavaScript数组知识网络

JavaScript数据类型 基本数据类型 Boolean Null Number String Symbol Undefined 对象数据类型Object Build-in object Array Date RegExp more... Array 定义:JavaScript数组是内置的对象之一,它可以用一个变量来存储多个同种类型或不同类型的值. 构造方法 var newArr = new Array(values); var newArr = [values]; 判断是否数组 Array.

js 的数组怎么push一个对象. Js数组的操作push,pop,shift,unshift JavaScript使用push方法添加一个元素到数组末 JavaScript数组函数unshift、shift、pop、push使用

push()函数用于向当前数组的添加一个或多个元素,并返回新的数组长度.新的元素将会依次添加到数组的末尾. 该函数属于Array对象,所有主流浏览器均支持该函数. 语法 array.push( item1 [,items... ] )参数 参数 描述item1 任意类型添加到当前数组末尾处的元素.items 可选参数/任意类型要添加到当前数组末尾处的其他项,可以有多个.注意:如果添加的元素类型为数组类型(Array),仍然会被当作一个元素看待,只是这个元素是数组类型而已.如果要合并两个数组,请使