Как узнать, какой код в Javascript изменил или получил доступ к свойству объекта?Не объект DOM - PullRequest
1 голос
/ 01 июля 2019

У меня есть объекты Javascript (некоторые из них являются массивами), которые заполняются во время запросов http get. Некоторые значения свойства в объекте обновляются во время выполнения. Код не мой, поэтому я отслеживаю, где в коде эти значения меняются. Это отслеживание может занять много времени, поэтому я смотрю, есть ли способ отладчика сломаться при изменении значения свойства.

Я видел похожие вопросы по SO, но они датируются несколькими годами и предлагают использовать разные типы фрагментов кода. Я хотел бы думать, что это стало легче с одним из современных браузеров с возможно встроенной функциональностью devtools? Есть? Если нет, то какой хороший фрагмент JS для этого?

1 Ответ

0 голосов
/ 01 июля 2019

Если вы знаете , какие свойства изменяются или к ним обращаются, но не , где , я перезаписываю эти свойства парой получатель / установщик. Когда вызывается сеттер, вызовите debugger, или throw new Error(), или console.trace() и проверьте трассировку стека:

const obj = { foo: 'foo' };

Object.defineProperty(obj, 'foo', {
  get() {
    console.log('getting foo');
    console.trace();
  },
  set(newVal) {
    console.log('setting foo');
    console.trace();
  }
});

const gottenFoo = obj.foo;
obj.foo = 'bar';

Если вы можете управлять созданием объекта, свойства которого доступны / изменены, другой вариант - создать прокси-сервер, который позволит вам перехватить получение / наборы всех свойств объекта :

const baseObj = { foo: 'foo' };
const obj = new Proxy(baseObj, {
  get(_, prop) {
    console.log('getting prop:', prop);
    console.trace();
    return baseObj[prop];
  },
  set(_, prop, newVal) {
    console.log('setting prop:', prop, 'with', newVal);
    console.trace();
    return baseObj[prop] = newVal;
  }
});
const gottenFoo = obj.foo;
obj.foo = 'bar';

(Чтобы увидеть результаты console.trace, посмотрите в консоли браузера, а не в консоли фрагмента)

...