javascript - When loggin an event object, currentTarget is null, but when logging event.currentTarget it logs a value. Why is that? -

javascript - When loggin an event object, currentTarget is null, but when logging event.currentTarget it logs a value. Why is that? -

with below code noticed in browser console when log event, value currenttarget logs null. when log e.currenttarget logs value. idea's on how works?

var button = document.getelementbyid("btn"); var eventbuttonhandler = function(e) { var button = e.target; console.log(e); // logs mouseevent object currenttarget:null console.log(e.currenttarget); // logs value if(!button.classlist.contains("active")) button.classlist.add("active"); else button.classlist.remove("active"); }; button.addeventlistener("click", eventbuttonhandler);

a jsbin can found here: http://jsbin.com/xatixa/2/watch?html,js,output

this artifact of way javascript console works when log object. log doesn't contain re-create of object properties, contains reference object. when click on disclosure triangle, looks properties , displays them.

in case, @ time phone call console.log(e), there's dom element in currenttarget property. sometime later, property reset null reason. when expand event object, that's see.

a simple illustration demonstrates is:

class="snippet-code-js lang-js prettyprint-override">var foo = { }; (var = 0; < 100; i++) { foo['longprefix' + i] = i; } console.log(foo); foo.longprefix90 = 'abc';

when view object in console, you'll see foo.longprefix90 contains "abc", though contained 90 @ time console.log(foo) called.

the demonstration needs utilize object lots of properties. when it's logging, shows first few properties fit in console, in snapshot. properties after display anomalous behavior.

javascript javascript-events