JS 数组和对象的深拷贝操作示例
本文实例讲述了JS数组和对象的深拷贝操作。分享给大家供大家参考,具体如下:
一.数组的深拷贝
letarr=[ undefined, function(){ console.log(123); }, true, null, { name:"123", age:23 } ]; //arr作为拷贝对象
1.Array.from()
Array.from()能将一个类数组转化成一个真正的数组,因此它返回的是一个新数组。
letarr1=Array.from(arr); arr[0]=2; console.log(arr1); //[undefined,[Function],true,null,{name:'123',age:23}]
2.Object.assign()
letarr1=Object.assign([],arr) arr[0]=2; console.log(arr1); //[undefined,[Function],true,null,{name:'123',age:23}]
此方法也可用作对象的深拷贝
3.Slice()
letarr1=arr.slice(0); arr[0]=2; console.log(arr1); //[undefined,[Function],true,null,{name:'123',age:23}]
4.Concat()
letarr1=arr.concat(); arr[0]=2; console.log(arr1); //[undefined,[Function],true,null,{name:'123',age:23}]
5.扩展运算符深拷贝
//let[...arr1]=arr;//这两种都可以 letarr1=[...arr]; arr[0]=2; console.log(arr1); //[undefined,[Function],true,null,{name:'123',age:23}]
此方法也可用作对象的深拷贝
二.对象的深拷贝
letobj={ name:"a", age:20, sex:false, user:{ a:20, n:"b" }, f:function(){ return1; }, u:undefined, n:null }
用扩展运算符和Object.assign()方法可以深拷贝对象
letobj1=Object.assign({},obj) obj[age]=2; console.log(obj1); //letobj={name:"a",age:20,sex:false,user:{a:20,n:"b},f:function(){return1;},u:undefined,n:null}
感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.jb51.net/code/HtmlJsRun测试上述代码运行效果。
更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》
希望本文所述对大家JavaScript程序设计有所帮助。