Every so often I want to view what an object looks like at various points of an execution cycle. Many people like to use breakpoint debugging but I find it a bit annoying and tedious -- it's simply not for me. The problem comes when I log an object to the console; since other operations may have occurred between my log call and the rest of execution, I may not be seeing a true representation of the object at that moment within the console. There are a few solutions you can employ:
The first solution is converting the object to a JSON string to browse its contents:
// Log the JSON representation of this object // at *this* moment console.log(JSON.stringify(myObject));
Now I can see every key and value of the object without needing to click around it. If you prefer to work with a real object in the debugger, simply convert the JSON object from string to an object again, effectively cloning it:
// Object -> String -> Object (clone) console.log(JSON.parse(JSON.stringify(myObject)));
Of coures this isn't a perfect solution for some people but it has worked beautifully for me in the past. Maybe I'm a lesser programmer for not liking breakpoint debugging but hey -- I tend to get things done!