js:for循环只执行最后一个值的问题

最新推荐文章于 2025-03-12 20:09:28 发布

原创最新推荐文章于 2025-03-12 20:09:28 发布 · 6.9k 阅读

4 ·

本内容遵循CC 4.0 BY-SA版权协议

2020-04 专栏收录该内容

1 篇文章

订阅专栏

在项目开发中，后台返回的数据结构不匹配CheckBox选择需求，导致选择单一项目时出现多选情况。通过重构独一无二的key，使用forEach与map方法，解决了CheckBox的选择问题，确保了选择的准确性。

在项目开发的时候后台的返回的数据结构不能满足于checkBox单个选择的条件，当我选择一个时会把其他的数据也一直选过来，这里就需要自己去重构一个独一无二的key来进行for循环选择：
如以下数据：

  tableDate: [
        { groupNum: "360120", groupName: "仙剑奇侠传" },
        { groupNum: "4542120", groupName: "结界" }
      ],
      timeList: [
        {
          endTime: "67200000",
          groupNum: "510716",
          id: 645,
          nickName: "李逍遥",
          startTime: "63600000"
        },
        {
          endTime: "67200000",
          groupNum: "510716",
          id: 646,
          nickName: "景天",
          startTime: "63600000"
        },
      ],

为了重构出一个独一无二的key，我一开始使用双重for循环：for (let i = 0; i < this.tableDate.length; i++) { for (let j = 0; j < this.timeList.length; j++) { if (j == this.timeList.length - 1) { this.timeList[j].groupTime = this.tableDate[i].groupNum + this.timeList[j].nickName; this.tableDate[i].times = this.timeList; } else { this.timeList[j].groupTime = this.tableDate[i].groupNum + this.timeList[j].nickName; } } }
但是得到的结果却是在这里插入图片描述

解决办法：

   this.tableDate.forEach(item=>{
          item.times =this.timeList.map(obj=>{
              return{
              groupTime:item.groupNum+'-'+obj.nickName
              }

            })
        })

得到的数据如下：
在这里插入图片描述