The failure to expand can mean that the object was subsequently removed from memory: possibly deleted or garbage-collected, or (especially if you're using Chrome dev tools on a Node.js script) it could be that the script completed, so all refs now point nowhere.
It's a good practice when inspecting objects that can change later to drop in a debugger
instead of console.log
:
window.onbeforeunload = function (e) {
debugger; // Now go find `e` in the local variables section
}
This pauses the execution of the code, so you know for sure you're seeing what the variable was at this point, rather than seeing any subsequent changes.
This way, you can access more context and don't need to worry about changes to output caused by what happens later in the code.
Always remember that in JavaScript, any time you deal with a variable that points to an object, you're dealing with a live reference, to the latest state of that object.
console.log
logs the reference, not the object's contents, and when you view and expand the logged reference, you're viewing what that reference points to at the time you look at it, not the time you logged it. This might be nothing if it has been removed from memory or reassigned.
Variables pointing to primitives like strings and numbers point to values not references, so you could also:
- log a stringified version of the object, like
console.log(JSON.stringify(someObject))
(although that output may be harder to read).
- if the object's properties are all primitive, log a shallow clone like
console.log({ ...someObject })
(though any properties that are objects may face the same problem)
The debugger
approach is usually better.