如何制作代理对象的结构化克隆？答案

【问题标题】：How to make a structuredClone of a Proxy object?如何制作代理对象的结构化克隆？
【发布时间】：2022-06-16 02:15:10
【问题描述】：

我正在使用 Vue3，其中很多对象都是响应性的代理对象。我想创建一个代理对象的深层副本，并且最近发现了结构化克隆。

https://developer.mozilla.org/en-US/docs/Web/API/structuredClone

当我运行以下代码时，在 proxyObj 上执行结构化克隆时出错：

const obj = {
    name: "Steve",
    age: 50
}
const handler = {}
const proxyObj = new Proxy(obj, {})

console.log(proxyObj)

const objCopy = structuredClone(obj)

console.log(objCopy)

const proxyObjCopy = structuredClone(proxyObj)
console.log(objCopy)

Uncaught DOMException: Failed to execute 'structuredClone' on 'Window': # could not be clone.

有没有办法克隆代理对象？有没有办法我可以先取消引用它，复制它，而不会失去反应性？任何帮助表示赞赏！

【问题讨论】：

明确一点，你不负责创建代理，也无权访问目标对象，对吧？否则 stackoverflow.com/questions/44118839/… 可能会有所帮助。
正确，据我所知，代理创建是在幕后完成的
一个简单的structuredClone({...proxyObj}) 会为您提供所有预期的键值对还是您的对象比您提供的示例更复杂？
这确实有效，并且比我找到的 Object.assign 实现更好。唯一的问题是它剥离了代理。如果我在完成这项任务后需要反应，我将不得不检查我的用例。
不支持代理，故事结束developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/…。无论如何，反应对象不太可能以这种方式按预期工作，我希望它具有内部状态。您需要坚持使用组合 API 来组合对象并保持反应性

标签： javascript node.js vue.js browser