2

When I use the first code sample, for some reason console.log() gives me the processed HighData variable. As if the console.log() were at the end of the script.

console.log( "data", this.data['diagram'] );
var HighData = this.data['diagram'];

minSerieHeight = getMin( HighData[3] );
HighData[0] = mkSerie( HighData[0] );
HighData[1] = mkSerie( HighData[1] );
HighData[2] = mkSerie( HighData[2] );
HighData[3] = mkSerie( HighData[3] );

Whats even more strange is, when I use array.map() (which does exactly the same thing as the code above) it returns the this.data['diagram'] variable correctly as expected.

console.log( "data", this.data['diagram'] );
var HighData = this.data['diagram'];

minSerieHeight = getMin( HighData[ HighData.length - 1 ] );
HighData = HighData.map( e => {
    return mkSerie( e );
});

The code is in a Vue component in the mounted() function. The getMin() and mkSerie() are also in the mounted() function.

skirtle
  • 27,868
  • 4
  • 42
  • 57
Silvan
  • 390
  • 7
  • 24
  • can you add the 2 logs you get ? – ishay m Jun 28 '19 at 09:43
  • 1
    I'm not sure I'm understanding this right - if this code is in the `mounted()` function, why is it wrapped in ` – Lewis Jun 28 '19 at 09:45
  • @Lewis for stackoverflow. It don't get the language right without it. – Silvan Jun 28 '19 at 09:51
  • 2
    @Silvan You don't need to include ` – skirtle Jun 28 '19 at 09:55

1 Answers1

9

Console logging an object/array is 'live'. The console just stores a reference to the object. The values of the properties aren't captured until you expand the object in the console, by which time your object will have changed.

JSON.stringify can be useful to capture a string version of the object. As it's a string it can be logged without any risk of it changing. For that to work it does require that the object can be converted to JSON, which is not always possible.

The map example is a bit different. You aren't mutating the same object that was logged. Just assigning a new value to HighData won't change the value seen in the console as that is still pointing at the original object.

skirtle
  • 27,868
  • 4
  • 42
  • 57