使用forEach循环异步方法，导致使用深拷贝时，得不到最新数据，控制台会打印出最新的数据

在使用forEach循环遍历一个数组，如果循环时有异步方法，会导致最终深拷贝得不到最新数据，但是控制台会打印最新的数据

`const arr = [

{ name: "Jone", age: 18 },

{ name: "Tom", age: 15 },

{ name: "Liu", age: 48 }

];

const list = {}

function funTimeout (param) {

return new Promise((resolve) => {

setTimeout(() => { resolve(170) }, 1000)

})

};

function getData () {
  arr.forEach(async (item) => {
    const res = await funTimeout(item);
    item.height = res
  });

  console.log(arr, 'arrr');
  console.log(JSON.parse(JSON.stringify(arr)), 'copyArr');
}

getData()`

上面代码在控制台执行的结果，如图



使用JSON.parse(JSON.stringify())深拷贝后，height属性为追加到arr 数组中。刚开始以为是JSON.parse(JSON.stringify())的原因，还是使用lodash的_.cloneDeep,发现结果是一样的，

最后发现，这是由于forEach不会等待异步方法执行完成，以下是 MDN 的解释



解决方法：

1、使用原始的 for 循环；

2、使用 map 和 promise.all()

这个问题凸显出自己本身Js基本功还不扎实，需要加强练习