JSON.parse(JSON.stringify())和深复制assign和浅复制

博客介绍了原生Js实现浅拷贝和深拷贝的方法。浅拷贝等同于Assign,深拷贝等同于JSON.parse(JSON.stringify()),为JavaScript开发中数据复制操作提供了简单实现思路。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

浅复制:

Assign 实现:res != obj
	

在这里插入图片描述

原生Js 实现, 等同于Assign

const shallowCopy = (Sobj) => {
    // 判断是否为对象,如果不是直接返回
    if (typeof Sobj !== 'object') return
    // 判断接受的参数是否是Array ,如果是, 则定义的新newObj 则是数组,反之 则为对象
    let newObj = Sobj instanceof Array ? [] : {}
    // 对接收的参数进行遍历,只会遍历可枚举属性, hasOwnProperty 方法判断属性是否存在
    for (let key in Sobj) {
        if (Sobj.hasOwnProperty(key)) {
            newObj[key] = Sobj[key]
        }
    }
    return newObj
}
let obj = {
    a: 1,
    arr: [2, 3]
};

// let res = shallowCopy(obj);
console.log(res.arr === obj.arr); // true,指向同一个引用
console.log(res.a === obj.a); // false

在这里插入图片描述

深复制: 等同于JSON.parse(JSON.stringify())

 const deepCopy = (sourceObj) => {
    if (typeof sourceObj !== 'object') return
    let newObj = sourceObj instanceof Array ? [] : {}

    for (let key in sourceObj) {
        if (sourceObj.hasOwnProperty(key)) {
            newObj[key] = (typeof sourceObj[key] === 'object' ? deepCopy(sourceObj[key]) : sourceObj[key])
        }
    }
    return newObj
} 
let obj = {
    a: 1,
    arr: [2, 3]
};
let res = deepCopy(obj);
console.log(res.arr === obj.arr); // false,指向不同的引用
console.log(res === obj); // false

在这里插入图片描述

JSON.parse(JSON.stringify())实现: 两个都不相等

在这里插入图片描述

value.annex = value.invoice ? this.processPictures( value.invoice ) : [] //处理附件 this.formData.oaClaimDetailList[ this.index ].claimAmount = value.applyAmount.toString() //处理报销金额 this.formData.oaClaimDetailList[ this.index ].annex = JSON.parse( JSON.stringify( value.annex ) ) this.formData.oaClaimDetailList[ this.index ].remarks = '' this.formData.oaClaimDetailList[ this.index ].applyAmount = JSON.parse( JSON.stringify( value.applyAmount ) ) this.formData.oaClaimDetailList[ this.index ].applyTime = JSON.parse( JSON.stringify( value.applyTime ) ) this.formData.oaClaimDetailList[ this.index ].applyTimeSearch = JSON.parse( JSON.stringify( value.applyTimeSearch ) ) this.formData.oaClaimDetailList[ this.index ].businessId = JSON.parse( JSON.stringify( value.businessId ) ) this.formData.oaClaimDetailList[ this.index ].businessType = JSON.parse( JSON.stringify( value.businessType ) ) this.formData.oaClaimDetailList[ this.index ].claimId = JSON.parse( JSON.stringify( value.claimId ) ) this.formData.oaClaimDetailList[ this.index ].claimState = JSON.parse( JSON.stringify( value.claimState ) ) this.formData.oaClaimDetailList[ this.index ].createBy = JSON.parse( JSON.stringify( value.createBy ) ) this.formData.oaClaimDetailList[ this.index ].createTime = JSON.parse( JSON.stringify( value.createTime ) ) this.formData.oaClaimDetailList[ this.index ].deptId = JSON.parse( JSON.stringify( value.deptId ) ) this.formData.oaClaimDetailList[ this.index ].endTime = JSON.parse( JSON.stringify( value.endTime ) ) this.formData.oaClaimDetailList[ this.index ].flag = JSON.parse( JSON.stringify( value.flag ) ) this.formData.oaClaimDetailList[ this.index ].id = JSON.parse( JSON.stringify( value.id ) ) this.formData.oaClaimDetailList[ this.index ].invoice = JSON.parse( JSON.stringify( value.invoice ) ) this.formData.oaClaimDetailList[ this.index ].params = JSON.parse( JSON.stringify( value.params ) ) this.formData.oaClaimDetailList[ this.index ].processInstanceId = JSON.parse( JSON.stringify( value.processInstanceId ) ) this.formData.oaClaimDetailList[ this.index ].processName = JSON.parse( JSON.stringify( value.processName ) ) // this.formData.oaClaimDetailList[ this.index ].relatedClaim = JSON.parse( JSON.stringify( value.relatedClaim ) ) this.formData.oaClaimDetailList[ this.index ].relationId = JSON.parse( JSON.stringify( value.relationId ) ) this.formData.oaClaimDetailList[ this.index ].remark = JSON.parse( JSON.stringify( value.remark ) ) this.formData.oaClaimDetailList[ this.index ].searchValue = JSON.parse( JSON.stringify( value.searchValue ) ) this.formData.oaClaimDetailList[ this.index ].startTime = JSON.parse( JSON.stringify( value.startTime ) ) this.formData.oaClaimDetailList[ this.index ].state = JSON.parse( JSON.stringify( value.state ) ) this.formData.oaClaimDetailList[ this.index ].tenantId = JSON.parse( JSON.stringify( value.tenantId ) ) this.formData.oaClaimDetailList[ this.index ].updateBy = JSON.parse( JSON.stringify( value.updateBy ) ) this.formData.oaClaimDetailList[ this.index ].updateTime = JSON.parse( JSON.stringify( value.updateTime ) ) this.formData.oaClaimDetailList[ this.index ].userId = JSON.parse( JSON.stringify( value.userId ) ) 代码优化
最新发布
03-11
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值