News for hackers. Stuff that matters.
Re:Use console.log() like a pro (2020) by matja on Monday April 12, 2021 @12:07PM (#26781047)
I was just about to mention this, I wasted a solid hour or two on this until I realised what was happening.
Re:Use console.log() like a pro (2020) by brundolf on Monday April 12, 2021 @12:17PM (#26781215)
As I pointed out in another comment:

  console.log({x, y});
the wrapping object is being created at log time, so its values will never be changed after the fact. That could still happen with the contents of x or y themselves, but then it's no different from the original way (console.log(x, y);)
Re:Use console.log() like a pro (2020) by evan_ on Monday April 12, 2021 @12:28PM (#26781390)
We can actually just test this. Here's some code:

    const x = {value: 0};
    console.log(x);
    console.log({x});
    x.value = 1;
Running that in the latest Chrome javascript console, we see that the first version prints `{value: 0}` and the second prints `{x: {...}}`. When you expand the second one, it will show `{x: {value: 1}}`.
Re:Use console.log() like a pro (2020) by Folcon on Monday April 12, 2021 @12:55PM (#26781812)
The really fun part is doing this :)...

Evaluate the expression:

    const x = {value: 0};
    console.log(x);
    console.log({x});
    x.value = 1;
You get this:

    {value: 0}
    {x: {…}}
Expand the first arrow of the `x:`:

    v {x: {…}}
     > x: {value: 1}
Now evaluate:

    x.value = 3
Then expand the second arrow:

    v {x: {…}}
     > x:
         value: 3
Now if you unexpand the arrow, you get 1, but if you expand it you get 3 =)... (Well at least in chrome)
Re:Use console.log() like a pro (2020) by Lex-2008 on Monday April 12, 2021 @01:14PM (#26782098)
> Now if you unexpand the arrow, you get 1, but if you expand it you get 3 =)...

Moreover, if you expand arrow next to {value: 0}, you will see literally this:

    v {value: 0} [i]
        value: 3
Re:Use console.log() like a pro (2020) by brundolf on Monday April 12, 2021 @01:22PM (#26782242)
> its values will never be changed after the fact

By this I mean, the x and y in the output will never themselves change value. They may be mutated, but they cannot be reassigned in the printed object. The printed object is exclusively referenced by the console itself, even if the nested objects within it may be referenced elsewhere.

> That could still happen with the contents of x or y themselves, but then it's no different from the original way (console.log(x, y);)

By this I mean exactly what you demonstrated, the point being that it had nothing to do with the original suggestion made by jchw.

Re:Use console.log() like a pro (2020) by Lex-2008 on Monday April 12, 2021 @12:49PM (#26781716)
yep, but then when I expand (click triangle) the {value: 0} line, it shows "value: 1" on the next line, only to rise the confusion.

To be fair, there is also an "i" in a square, reminding me about this behaviour.