javascript - js map遍历数据进去打印都能看到数据，return的时候没有？

Question

 handleDesData(data) {
      console.log("进来", data)
      let newArry = [];
      this.des.map(item => {
        for (const key in data) {
          if (item.field == key) {
            item.num = data[key].forecastDataDTOList[0].information['oneDay'];
            console.log(data[key].forecastDataDTOList[0].information['oneDay'])
            newArry.push(item)
          }
        }
      });
      console.log("处理", newArry)
      return newArry
    },

调用的时候

  //处理数据
          this.list.map(item => {
            if (item.data.length) {
              item.data.map(i => {
                this.handleData(i.ybData);
                i.lineData = this.lineData;
                i.des = this.handleDesData(i.ybData)
              })
            }

          })

-- 数据只存在最后几个对象里面 现在遍历出来的 都是 --

这样写就可以了

 handleDesData(data) {
      console.log("进来", data)
      let newArry = [];
      let newOption = JSON.parse(JSON.stringify(this.des));
      newOption.map(item => {
        for (const key in data) {
          if (item.field == key) {
            item.num = data[key].forecastDataDTOList[0].information['oneDay'];
            console.log(data[key].forecastDataDTOList[0].information['oneDay'])
            newArry.push(item)
          }
        }
      });
      console.log("处理", newArry)
      return newArry
    },

Answer 1

一般来说这种问题都是深浅拷贝的问题，很多情况下 xxxx.push(item) 的时候都会有其它地方复用，所以经常会出现这样的问题。

一般修改思路这样的：

handleDesData(data) {
  const keyList = Object.keys(data)
  const newArray = this.des
      .filter(item => keyList.includes(item.field))
      .map(item => ({ ...item, num: data[item.field].forecastDataDTOList[0].information['oneDay']}))
  return newArray
}

主要就是不要直接去修改 item，而是在返回的时候返回一个新的对象出来。

Answer 2

没找到问题，但是可以简化下代码

handleDesData(data) {
  return this.des.map(item => data[item.field] && ({...item, num: data[item.field].forecastDataDTOList[0].information['oneDay']})).filter(v => v);
}