深浅拷贝

... 巴拉巴拉 ...

实现

看见有很多人分享他们的实现方式，五花八门，各显神通。

我也分享两种简单酷炫的方式:

1. 利用 history API 实现结构化克隆

/*structuralClone easy way*/
const structuralClone = obj => {
    const oldState = history.state;
    history.replaceState(obj, document.title);
    const copy = history.state;
    history.replaceState(oldState, document.title);
    /* 可以在这里进行原型、DOM、Function 等不支持的类型的完善 */
    /* 不过基本就够用了 */
    /* copy = morePerfectCopy(copy) */
    return copy;
}

原谅我标题党。

其实这是一种结构化克隆的实现, 这里只是讨巧的使用了 H5 history api 中，在 replaceState 或者 pushState 的时候对 state 是采用 H5 实现的结构化克隆进行序列化后然后进行安全的传递这一特性。

目前支持的类型有：

• 除 symbols 之外的所有原始类型
• Boolean 对象
• String 对象
• Date
• RegExp （lastIndex 字段不会被保留。）
• Blob
• File
• FileList
• ArrayBuffer
• ArrayBufferView
• ImageData
• Array
• Object
• Map
• Set

不支持：

• 原型链
• Error 对象
• Function
• DOM

2. Notification API

const deepCloneByNotificationAPI = obj => {
    return new Notification('', {data: obj, silent: true}).data;
}

这个其实也是利用 web workers 中的传递的对象也是结构化克隆算法实现的特性。

与上面的方式异曲同工，只是这个更加简洁，但是支持率很低，在 chrome 上是可以跑的。

这两种方式的性能，你们可以自己跑一跑，应该是凑合的。