【问题标题】:lodash cloneDeep remove proxy from objectlodash cloneDeep 从对象中删除代理
【发布时间】:2018-11-12 19:08:26
【问题描述】:

当我深度克隆代理对象时,它会返回一个没有代理的普通对象。但是当我深度克隆对象时我想要代理对象。

前:

class Abc {
  constructor() {
    this.a = 4;
    return new Proxy(this, {
      get(target, name) {
        return target[name];
      },
    });
  }
}

class Xyz {
  constructor() {
    this.x = new Abc();
    this.y = _.cloneDeep(this.x);
  }
}

var proxyObject = new Xyz().x;
var normalObject = new Xyz().y;
console.log(proxyObject); // Type Proxy
console.log(normalObject); // Type Object

有没有办法像this.x这样的原始对象行为克隆深层对象

【问题讨论】:

    标签: javascript ecmascript-6 lodash es6-proxy


    【解决方案1】:

    我不知道有什么简单(直截了当)的方法可以解决这个问题。

    实现此功能的一种方法是修改您的Abc 构造函数,以将原始对象本身(不是代理)包含在属性中(比如orig)。

    然后您可以定义自己的复制方法。当您在代理对象上调用此方法时,它会获取存储在 orig 属性中的非代理对象,执行 lodash 的 cloneDeep 并返回从该克隆对象创建的新代理对象。

    class Abc {
      constructor(orig = this) {
        this.orig = orig;
        this.a = 4;
        this.arr = [1, 2];
        return new Proxy(this, {
          get(target, name) {
            return target[name];
          },
        });
      }
    
      copy() {
        const cloned = _.cloneDeep(this.orig);
        return new Proxy(cloned, {
          get(target, name) {
            return target[name];
          }
        });
      }
    }
    
    class Xyz {
      constructor() {
        this.x = new Abc();
        this.y = this.x.copy();
      }
    }
    
    var proxyObject = new Xyz().x;
    var normalObject = new Xyz().y;
    
    console.log(proxyObject); 
    console.log(normalObject);
    
    proxyObject.arr.push(3);
    
    console.log(proxyObject.arr);
    console.log(normalObject.arr);
    <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.10/lodash.js"></script>

    现在proxyObjectnormalObject 都是代理,我们还可以看到代理对象确实被复制了,因为在运行proxyObject.arr.push(3) 之后normalObject 的arr 保持不变。

    【讨论】:

      猜你喜欢
      • 2016-01-03
      • 2014-03-18
      • 2014-07-18
      • 2016-11-11
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-03-12
      相关资源
      最近更新 更多