送请求考虑到就比如我点击下一步此次表箱信息其实不需要修改我要修改的是控制器的信息那么点击下一步发送请求其实是没有必要的我就考虑到了进行比对如果没有变化就直接下一步不发送请求

我的想法是在点击编辑时把变化前的值给一个变量旧值然后在点击下一步用现在的值和旧值进行对比

const

//在弹窗弹出的时候把传递过来的值给一个变量initialFormData.valuedata

editDataBox.value

!isFormDataEqual(editDataBox.value,

(formDataChanged)

这是我刚开始的想法原本我以为就是initialFormData这个值不会变化然后我发现表单值变化了也没有发送请求我就输出formDataChanged这个值发现每次都是false,进而输出initialFormData它的值就发现它既然是变化后的值我就想问题在哪里原因是

JavaScript

中当你将一个对象赋值给另一个变量时实际上是将对象的引用赋值给了这个变量而不是对象本身的拷贝。

这意味着如果你修改了其中一个变量所引用的对象另一个变量也会受到影响因为它们引用的是同一个对象。

editDataBox

引用的是不同的对象而不是同一个对象的引用。

这就是为什么需要进行深拷贝的原因因为深拷贝会创建一个新的对象其值与原始对象相同但是引用不同这样就可以独立地修改新对象而不影响原始对象。

JSON.parse()

进行深拷贝修改后的代码是加了一个deepCopy函数进行深拷贝

JSON.parse()

JSON.parse(JSON.stringify(obj));

//编辑

!isFormDataEqual(editDataBox.value,

(formDataChanged)

这个方法只能实现浅拷贝但如果对象的结构比较简单且不包含嵌套对象也可以考虑使用它

const

可以编写一个递归函数来遍历对象的所有属性并对每个属性进行拷贝。

这需要一些额外的代码但也是一个有效的方法。

const

深拷贝创建了原始对象的完全独立副本这意味着修改拷贝后的对象不会影响原始对象。

这对于需要在多个地方使用同一份数据但又需要独立修改数据的情况非常有用。

避免引用问题:

中如果你简单地将一个对象赋值给另一个变量实际上是将对象的引用传递给了新变量。

这意味着如果你修改了新变量中的对象原始对象也会受到影响。

深拷贝可以避免这种问题因为它创建了一个完全独立的对象不会共享内存地址。

数据传递:

在许多情况下你可能需要将数据传递给其他函数或组件并且希望确保传递的是数据的副本而不是引用。

深拷贝可以确保你传递的是数据的完整副本而不会影响原始数据。

数据比较:

当需要比较两个对象是否相等时深拷贝可以确保比较的是对象的值而不是引用。

这在进行单元测试、数据验证或其他需要比较对象的场景中非常有用。

总的来说深拷贝是一种保护数据完整性和独立性的重要工具可以帮助避免由于对象共享引起的意外行为并确保数据在不同部分之间的传递和修改时保持一致。

我在想应该写在另一篇文章还是写在这里emmm,还是重新写一个吧可以点击跳转

最后我也是刚入行时间不长的前端如果有写的有什么问题欢迎指正与交流。