JS / Event / currentTarget = null?

Question

 #test {
    width: 100px;
    height: 100px;
    background-color: #ddd;
  }

test.onclick = function(e) {
  console.log(e);
}

если раскрыть объект в консоли, то увидим, что currentTarget: null ?

при этом если выписать console.log(e.currentTarget) - то всё-таки там не null, а этот див.. как так то? почему объект MouseEvent нас вводит в заблуждение?

потому что консоль помнит ссылку на объект и обновляет его представление, отражая текущее состояние объекта — , Sep 06 '17 at 03:45
красивый ответ, но я его не понял.. currentTarget должен быть в этом случае таким же, как и target почему это не так? может это из-за того, что консоль не успевает записать туда значение, а выплёвывает то, что готово "на данный момент"? — 1px_solid_black, Sep 06 '17 at 03:49
https://stackoverflow.com/questions/17607766/how-come-my-event-currenttarget-is-changing-automatically — , Sep 06 '17 at 04:06
"After the event left the document, it will be set to null." - то есть клик всплывает вверх, аж за границы самого документа? Поэтому становится null? — 1px_solid_black, Sep 06 '17 at 04:21
Давайте на пальцах ) Грубо говоря, каждый раз когда вы обращаетесь к ссылке на объект (не копирует его и не создаёт новый на его основе), консоль идёт и ещё раз смотрит на тот объект.
Вот простой пример для понимания. var a = {name:'Vasya'} var b = a; console.log(b) delete a.name; console.log(b) — Kamil Magomedov, Sep 06 '17 at 07:39
Когда вы выводите объект в консоли, то выводится уже отработанный объект, то есть в состоянии после всех фаз обработки события. Стоит обратить внимание также на ещё одно свойство eventPhase, которое равно 0, что говорит о том что событие себя исчерпало и что подтверждает идею о том, что это отработанный объект. Ибо если бы значение eventPhase было равным 2, оно бы означало "фазу цели", то и currentTarget был бы не пустым и равным вашему элементу test. — DolphinRamses, Sep 06 '17 at 07:49
Кстати если вы выводите объект события в консоли chrome, то тогда можно обратить внимание на значок i рядом со строкой вывода, что говорит о том что "значение ниже было вычислено только что", что как бы намекает — DolphinRamses, Sep 06 '17 at 07:51

score 0 · Answer 1 · answered Sep 06 '17 at 07:45

Для "Создания копии" состояния и последующей работы с объектом, который имеет динамическое состояние используйте

Метод Object.assign() используется для копирования значений всех собственных перечисляемых свойств из одного или более исходных объектов в целевой объект. После копирования он возвращает целевой объект.

Это позволит сохранить данные, которые нужны вам в моменте обработки и использовать их для дальнейшей работы.

test.onclick = function(e) {
 var event = Object.assign({},e)
  console.log(event);
}

JS / Event / currentTarget = null?

1 Answers1