当前位置: 代码网 > it编程>编程语言>Javascript > js数组直接赋值的问题(js数组的浅拷贝与深拷贝方法)

js数组直接赋值的问题(js数组的浅拷贝与深拷贝方法)

2024年05月18日 Javascript 我要评论
1、数组的直接赋值属于数组的浅拷贝,js存储对象都是存内存地址,所以浅拷贝会导致新数组和旧数组共用同一块内存地址,其中一个数组变化,另一个数组也会相应的变化。var a =[1,2,3];var b=

1、数组的直接赋值属于数组的浅拷贝,js存储对象都是存内存地址,所以浅拷贝会导致新数组和旧数组共用同一块内存地址,其中一个数组变化,另一个数组也会相应的变化。

var a =[1,2,3];
var b=a;
a[0]=30;
console.log(a,b);

//结果: [30, 2, 3]   [30, 2, 3]

2、数组内部不含有引用类型,使用slice() 、concat() 和 assign() 方法都属于数组的深拷贝,一个数组变化,另一个数组不受影响。

数组的concat方法

var a=[1,2,3];
var b=[].concat(a); 
a[0]=30;
console.log(a,b);

//结果:[30, 2, 3]  [1, 2, 3]

使用es6的展开操作符: …arr

var a=[1,2,3];
var b=[].concat(a); 
var c=[...a]; 
a[0]=30;
console.log(a,b,c);

//结果:[30, 2, 3]  [1, 2, 3] [1, 2, 3]

利用split join map方法

let arr1=[1,2,3];
var newarr4 = arr1.join(" ").split(" ").map(function(i){
    return parseint(i);
    
}); 
arr1[0]=30;
console.log(arr1,newarr4);

//vm1175:1 (3) [30, 2, 3] (3) [1, 2, 3]

3、数组内部含有引用类型,使用slice() 、concat() 和 assign() 方法,非引用类型的值属于深拷贝,引入类型的值属于浅拷贝,一个数组变化,另一个也会相应的变化。

4、深拷贝就是指完全的拷贝一个对象,即使嵌套了对象,两者也相互分离,修改一个对象的属性,也不会影响另一个。

1、通过json.stringify转化成字符串再通过json.parse()解析成原数组。

let arr=[{a:1,b:2},{a:3,b:4}]; 
let arr1=json.parse(json.stringify(arr)); 
arr[0].a=10;
console.log(arr,arr1); 

//输出结果如下
(2) [{…}, {…}]
    0: {a: 10, b: 2}
    1: {a: 3, b: 4}

(2) [{…}, {…}]
    0: {a: 1, b: 2}
    1: {a: 3, b: 4}

2、利用jquery的$.extend方法。

let arr=[{a:1,b:2},{a:3,b:4}]; 
let arr1=$.extend(true,[],arr); 
arr[0].a=10;
console.log(arr,arr1); 

//输出结果如下
(2) [{…}, {…}]
    0: {a: 10, b: 2}
    1: {a: 3, b: 4}
    
(2) [{…}, {…}, contains: ƒ, each: ƒ, uniquelize: ƒ]
    0: {a: 1, b: 2}
    1: {a: 3, b: 4}
(0)

相关文章:

版权声明:本文内容由互联网用户贡献,该文观点仅代表作者本人。本站仅提供信息存储服务,不拥有所有权,不承担相关法律责任。 如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 2386932994@qq.com 举报,一经查实将立刻删除。

发表评论

验证码:
Copyright © 2017-2025  代码网 保留所有权利. 粤ICP备2024248653号
站长QQ:2386932994 | 联系邮箱:2386932994@qq.com