JavaScript 深拷贝解决对象修改问题：循环中使用 JSON.parse 和 JSON.stringify

在 JavaScript 循环中处理对象时，如果需要修改对象的值，但又不希望影响原始对象，就需要进行深拷贝。深拷贝会创建原始对象的一个完全独立的副本，修改副本不会影响原始对象。

问题：

以下代码展示了在循环中修改对象时出现的问题：

productList.value.forEach(e => {
    let needObj = divDomList.value.get(e.productCode).needObj
    let newObj = Object.assign({}, needObj) // 创建一个新的对象
    newObj.taxRate = newObj.taxRate / 100
    obj[e.productId] = newObj
})

这段代码的目的是将 productList 中每个对象的 taxRate 除以 100，但实际运行后发现只有第一条数据中的 taxRate 被修改了。

原因：

这是因为 needObj 是一个引用类型的对象，Object.assign 只是创建了一个浅拷贝，newObj 和 needObj 指向同一个内存地址。因此，当修改 newObj 时，needObj 也会被修改，导致后续的循环中的 newObj 也是修改后的值。

解决方法：

为了解决这个问题，可以使用 JSON.parse 和 JSON.stringify 来创建一个深拷贝对象。修改后的代码如下：

productList.value.forEach(e => {
    let needObj = divDomList.value.get(e.productCode).needObj
    let newObj = JSON.parse(JSON.stringify(needObj)) // 创建一个新的对象
    newObj.taxRate = newObj.taxRate / 100
    obj[e.productId] = newObj
})

使用 JSON.stringify 将 needObj 转换为 JSON 字符串，然后使用 JSON.parse 将字符串解析成一个新的对象，这样就创建了一个深拷贝。每次创建的 newObj 都是一个全新的对象，不会受到之前循环中的修改影响。

总结：

在 JavaScript 循环中处理对象时，如果需要修改对象的值，但又不希望影响原始对象，建议使用 JSON.parse 和 JSON.stringify 进行深拷贝。

JavaScript 深拷贝解决对象修改问题：循环中使用 JSON.parse 和 JSON.stringify