#app{宽度：100%；高度:100vh;框大小：边框框；padding:50px;}/deep/.el-dialog{margin-top:30vh!important;}对于js中对象的深拷贝，在项目开发中比较常用。本文举例说明常用的js对象深拷贝方式。用于开发。废话不多说，先从常用的深拷贝方式做总结，接着对常用的深拷贝方式进行相应的分析JSON.parse(JSON.stringify())Object.assign...展开operatorlodash函数关于js中变量（数据类型）拷贝的库我们知道js语言中常用的基本数据类型和引用数据类型。可以复制，但是引用数据类型栈中只存放了一个指针地址，指针指向堆中的数据。所以引用数据类型的拷贝会稍微麻烦一点。ReferenceDataTypeReferenceDataTypeClassificationObjectArrayFunctionReferenceDataTypeCopy我们知道，数据拷贝（copy）其实就是找一块单独的内存块来存放对应的具体信息，而这部分信息是独立于原来的。对于引用数据类型的拷贝，如果直接用等号给拷贝赋值，只是把引用数据类型的指针给了变量，所以我们不得不说引用数据类型的拷贝。函数一般不需要拷贝，因为函数在js中是一等公民，需要用到的地方直接调用函数即可，所以说深拷贝或者浅拷贝的时候，一般指的就是拷贝对象或数据。对象的拷贝是对象深拷贝的浅拷贝，直接等于sign=assignment，场景这里不再赘述。假设我们的项目页面上有一个表格，表格中的每一行都是对应的数据。在表格的最后右边有一个编辑按钮，点击编辑按钮，会出现一个弹出框，弹出框中有一个表格，表格中对应行的数据出现在表格中供我们编辑、修改和保存。具体逻辑也很简单，就是点击某行的编辑按钮，获取对应行的数据，将对应行的数据赋值给表单。下面两张图分别是不使用deepcopy和使用deepcopy的效果区别有时候，表中对应行的数据会被修改，因为我们以前赋值的只是表的指针引用地址对象，所以会出现这种效果。这显然不是我们想要的，所以这种方法一般是行不通的。使用深拷贝效果图，我们发现使用深拷贝修改表单中的数据，并不会改变原表单中对应行中的数据，这就是我们想要的。对应代码编辑#app{宽度：100%；高度:100vh;框大小：边框框；padding:50px;}/deep/.el-dialog{margin-top:30vh!important;}数组的补充深拷贝对于数组的拷贝，如果直接使用等号=来拷贝拷贝，它只是一个浅拷贝，浅拷贝拷贝的是地址，所以源数组变了，被拷贝的数组也会变。常用方法sliceconcat...ExtendJSON.parse(JSON.stringify())letarr=['孙悟空','猪八戒','沙僧','唐僧']//方法一sliceletnewArr=arr.slice(0)//方法二concatletnewArr=arr.concat()//方法三...扩展运算符let[...newArr]=arr//方法四letnewArr=JSON.parse(JSON.stringify(arr))当然你也可以使用lodash的函数工具库手写深度克隆letarr=[{name:'孙悟空',age:500,skill:['翻筋斗','火眼']},{name:'猪八戒',age:88,skill:['九齿耙','36变']},]functiondeepClone(params){//如果数组类型数据if(Array.isArray(params)){letnewnew=[]for(leti=0;i
