Chrome console returns array instead of its value, why is that?

Question

var meals = {
  breakfast: "oatmeal",
  lunch: "turkey sandwich",
  dinner: "steak and potatoes"
};

=> undefined

Object.assign({}, meals, {breakfast: ['oatmeal', 'banana']})

=> {breakfast: Array(2), lunch: "turkey sandwich", dinner: "steak and potatoes"}

Why is chrome console displaying Array(2) instead of displaying the actual value of the array which is ['oatmeal', 'banana'].

Answer 1

The value that chrome logs to the console is an array itself. You can check it by expanding it. It is just displayed as array(2) for brevity. You can always expand it to get it to display the full contents of objects and therefore the full array breakfast as well.

The nested values are just compacted while showing it for properly displaying objects and giving you a proper view of the nesting that goes on in the object.

Check below, the value returned by Object.assign(...) is just as expected. The same can be verified by expanding the object logged by chrome console.

var meals = {
  breakfast: "oatmeal",
  lunch: "turkey sandwich",
  dinner: "steak and potatoes"
};

console.log(Object.assign({}, meals, {breakfast: ['oatmeal', 'banana']}))