我试图通过用代理覆盖我的对象 getter 来打印出哪些节点正在通过 getter 访问。我试图基本上测试这个大对象的哪些部分没有被我的应用程序使用。我遇到的问题是能够添加一些方法来识别 getter parent 是什么。这是我到目前为止所拥有的

function tracePropAccess(obj) {
  return new Proxy(obj, {
    get(target, propKey, receiver) {
      console.log("Get fired on ", propKey);
      return Reflect.get(target, propKey, receiver);
    }
  });
}

const testObj = {
  a: 1,
  b: {
    a: "no",
    b: "yes"
  },
  c: {
    a: "green",
    b: {
      a: "blue",
      b: "orange"
    }
  }
};

const tracer = tracePropAccess(testObj);

tracer.b.a;

tracer.a;

tracer.c.c.a;

这在向我展示 Prop key 方面非常有效 - 但它只是第一级的 key 。我不确定如何使用此代理来解决此问题,因为此单个函数会覆盖所提供对象中的所有代理。有什么办法可以传入一个对象的 parent / child 吗?可能我也在错误地处理这个问题 - 所以我正在寻找任何输入。谢谢!

最佳答案

您可以使用反射并检查它是否是一个对象。如果是,则返回一个代理,如果不是,则返回值。

对未完成的对象不起作用,因为代理不知道什么时候作为结果返回对象或者代理要使用

例子:

{ foo: { bar: { baz: 42 } } }


tracer.foo.bar

不起作用,因为它应该返回
{ baz: 42 }

但它返回一个新的代理,这会导致奇怪的结果。主要问题是要知道还有哪些键即将到来,并且使用这种表示法,不可能知道下一个键是什么或没有键是什么。

function tracePropAccess(obj) {
    return new Proxy(obj, {
        get(target, propKey, receiver) {
            console.log("Get fired on ", propKey);
            var temp = Reflect.get(target, propKey, receiver);
            return temp && typeof temp === 'object'
                ? tracePropAccess(temp)
                : temp;
        }
    });
}

const testObj = { a: 1, b: { a: "no", b: "yes" }, c: { a: "green", b: { a: "blue", b: "orange" } } };

const tracer = tracePropAccess(testObj);

console.log(tracer.b.a);
console.log(tracer.a);
console.log(tracer.c.c.a);


带路径

function tracePropAccess(obj, path) {
    path = path || [];
    return new Proxy(obj, {
        get(target, propKey, receiver) {
            var newPath = path.concat(propKey);
            console.log("Get fired on ", newPath);
            var temp = Reflect.get(target, propKey, receiver);
            return temp && typeof temp === 'object'
                ? tracePropAccess(temp, newPath)
                : temp;
        }
    });
}

const testObj = { a: 1, b: { a: "no", b: "yes" }, c: { a: "green", b: { a: "blue", b: "orange" } } };

const tracer = tracePropAccess(testObj);

console.log(tracer.b.a);
console.log(tracer.a);
console.log(tracer.c.c.a);


路径在最后。

function tracePropAccess(obj, path) {
    path = path || [];
    return new Proxy(obj, {
        get(target, propKey, receiver) {
            var temp = Reflect.get(target, propKey, receiver),
                newPath = path.concat(propKey);
            if (temp && typeof temp === 'object') {
                return tracePropAccess(temp, newPath);
            } else {
                console.log("Get fired on ", newPath);
                return temp;
            }
        }
    });
}

const testObj = { a: 1, b: { a: "no", b: "yes" }, c: { a: "green", b: { a: "blue", b: "orange" } } };

const tracer = tracePropAccess(testObj);

console.log(tracer.b.a);
console.log(tracer.a);
console.log(tracer.c.c.a);

关于javascript - 在javascript中为代理添加(递归?)级别意识,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/49326345/

10-11 23:58
查看更多