JS快照沙箱

自己实现一个快照沙箱：1 年前拍一张，再拍一张，将区别保存起来，再回到一年前，多个子应用就不能使用这种方式了，可以使用 ES6 的 proxy。
本篇文章就先暂时实现一个简单的快照沙箱。下篇文章再使用Proxy实现一个沙箱

class SnapshotSandbox {
    constructor() {
        this.proxy = window;
        this.sandboxSnapshot = {}; // 记录在沙箱上的所有属性快照
        this.windowSnapshot = {}; // 存储window上的所有属性快照
        this.active();
    }
    // 激活沙箱，在沙箱里进行操作
    active() {
        for (const prop in window) {
            if (window.hasOwnProperty(prop)) {
                // 激活时，先把window上的属性保存在 windowSnapshot
                this.windowSnapshot[prop] = window[prop];
            }
        }
        // 再把沙箱之前的属性重新赋值给 window
        Object.keys(this.sandboxSnapshot).forEach((p) => {
            window[p] = this.sandboxSnapshot[p];
        });
    }
    //失活
    inActive() {
        for (const prop in window) {
            if (window.hasOwnProperty(prop)) {
                // 比较现在的window 和之前的 window对比有啥区别
                if (window[prop] !== this.windowSnapshot[prop]) {
                    // 如果不一样，就说明有变化，需要保存变化
                    // 把沙箱的属性保存在sandboxSnapshot
                    this.sandboxSnapshot[prop] = window[prop];
                    // 需要将window上之间的属性 windowSnapshot 再赋值给window
                    window[prop] = this.windowSnapshot[prop];
                }
            }
        }
    }
}

let sandBox = new SnapshotSandbox();
// 应用的运行从开始到结束，切换后不会影响全局
((window) => {
    window.a = 1;
    window.b = 2;
    console.log(window.a, window.b); // 1, 2
    // 失活
    sandBox.inActive();
    console.log(window.a, window.b); // undefined undefined
    // 激活还原
    sandBox.active();
    console.log(window.a, window.b); // 1, 2
})(sandBox.proxy); // sandBox.proxy就是window

window 环境和沙箱环境，其实都是在 window 上进行操作，所以刚开始的时候有点分不清，其实就是要理解沙箱环境和 window 环境。在这两个环境来回切换的时候，需要对应环境原来的改动找回来，就需要两个变量来存储，一个 windowSnapshot 来存储 window 上的属性，一个 sandboxSnapshot 来存储沙箱上的属性

• 从 window 切换到沙箱环境的时候（激活沙箱），需要把 window 上当前的属性保存到一个地方，windowSnapshot 就是用来保存 window 上的属性的，然后之后再把原来沙箱上的属性再还原回来（即把沙箱上之前的属性 sandboxSnapshot 再赋值到 window 上）
• 从沙箱环境切换到 window 的时候（失活沙箱），需要把沙箱的改动保存到一个地方，sandboxSnapshot 就会用来保存沙箱上的属性的，然后之后再把原来 window 上的属性还原回来（即把 window 上之前的属性 windowSnapshot 再赋值到 window 上）