修改数组内的值后,其他所有引用的地方都发生了改变

本文探讨了JavaScript中对象赋值导致的引用问题,当多个变量指向同一内存地址时,修改其中一个会影响其他变量。解决方案包括使用解构赋值或JSON序列化来创建新对象,避免直接修改原始数据。这两种方法确保了对params的修改不会影响data。

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

1、问题代码

	  const data = {
        page: 1
      }
      let params=data
      params.page = 2
      console.log('params.page=' + params.page)
      console.log('data.page=' + data.page)

这是一种比较常见的问题代码,需要注意的是,在这时,params并未开辟新的内存,params与data引用的是同一个内存地址,所以当你进行修改时,所有引用这个内存地址的值都会发生变化,看一下打印结果
打印结果1
我并未修改data中page的值, 但由于这两个对象引用的是同一个内存地址,所以都发生了变化

2、解决问题

既然知道问题所在(两个对象引用的同一个内存地址),那么解决起来也就简单了,我们只需要开辟一个新的内存后,再将需要用的值存进去就可以解决这个问题,方案如下:

1. 方案一

	  const data = {
        page: 1
      }
      let params = {
        ...data
      }
      params.page = 2
      console.log('params.page=' + params.page)
      console.log('data.page=' + data.page)

2. 方案二

	  const data = {
        page: 1
      }
      let params = JSON.parse(JSON.stringify(data))
      params.page = 2
      console.log('params.page=' + params.page)
      console.log('data.page=' + data.page)

这两种方案的打印结果如下:
打印结果2
因为params引用的是一个新的内存地址,所以无论我如何修改params的值,data都不会受影响。
以上仅仅只列出两种解决方案,仅供参考,解决这个问题的核心思想就是“开辟一个新的内存,不让两个对象引用同一个内存地址的值

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值