微信小程序 通过setData 给两个变量设置同一个数组时,为什么修改一个变量,另一个会也被修改?

在微信小程序中,使用 setData 方法更新数据时,如果给两个变量设置同一个数组,修改其中一个变量的值会导致另一个变量也被修改的原因是,数组是引用类型的数据,在内存中的存储方式是按引用地址存储。

当你将一个数组赋值给两个变量时,实际上两个变量共享同一块内存空间,即它们引用相同的地址。因此,无论你修改其中一个变量的值,另一个变量也会受到影响。

示例如下:

javascript 复制代码
// 在 Page 实例的 data 中定义两个变量
data: {
  array1: [1, 2, 3],
  array2: []
},

// 将 array1 赋值给 array2
onLoad: function() {
  this.setData({
    array2: this.data.array1
  });
},

// 修改 array1 的值
modifyArray: function() {
  this.data.array1.push(4);
  this.setData({
    array1: this.data.array1
  });
  console.log(this.data.array2);
  // 输出 [1, 2, 3, 4],array2 也被修改了
}

通过以上示例,当我们调用 modifyArray 函数更新 array1 变量的值时,array2 的值也会受到影响,因为它们引用同一块内存地址上的数组。

如果想要避免这种情况,可以使用 array.slice() 方法复制一份原数组并赋给另一个变量,这样就不会导致修改一个变量时影响到其他变量的问题。

javascript 复制代码
// 使用 array.slice() 方法复制数组
onLoad: function() {
  this.setData({
    array2: this.data.array1.slice()
  });
}

通过上述方式,array1array2 将引用不同的内存地址上的数组,因此修改其中一个变量的值不会影响到另一个变量。

相关推荐
jingqingdai316 小时前
微信小程序 Canvas 2D 踩坑指南:如何优雅地导出高清长图?(附 AI 辅助实录)
人工智能·微信小程序·小程序
2503_9284115617 小时前
AI 行业正在重塑每个人的工作方式,而你需要一个更轻松的入口
人工智能·小程序
qq_433502181 天前
微信小程序更新机制踩坑记录:updateInfo 为什么总是读到旧数据?
微信小程序·小程序·notepad++
优雅的大白鹅2 天前
创建uniapp小程序
小程序·uni-app
liangdabiao2 天前
开源AI拼豆大升级 - 一键部署cloudflare page - 全免费 web和小程序
前端·人工智能·小程序
px不是xp2 天前
DeepSeek API集成:让小程序拥有AI大脑
javascript·人工智能·小程序
小汪说干货2 天前
2026年4月最新|公众号文章插入文档附件3种技术方案
javascript·小程序
QQ22792391022 天前
Java springboot基于微信小程序的智慧旅游导游系统景点门票酒店预订(源码+文档+运行视频+讲解视频)
java·spring boot·微信小程序·maven·vuejs
小汪说干货2 天前
2026年4月优化版|公众号文档格式附件插入3种方案(推荐“附链”小程序)
小程序·微信公众平台
万岳科技系统开发2 天前
商城系统搭建自建平台与入驻第三方平台对比分析
数据库·小程序·架构