Javascript console.log(object) vs. concatenating string
Asked Answered
O

5

50

I'm running this in node.js:

> x = { 'foo' : 'bar' }
{ foo: 'bar' }
> console.log(x)
{ foo: 'bar' }
undefined
> console.log("hmm: " + x)
hmm: [object Object]
undefined

What I don't understand is why console.log(x) "pretty-prints" the object, whereas string concatenation "ugly-prints" it. And more importantly, what's the best way to make it print hmm: { foo: 'bar' }?

Observer answered 30/1, 2013 at 5:22 Comment(0)
O
86

The + x coerces the object x into a string, which is just [object Object]:

http://jsfiddle.net/Ze32g/

The pretty printing is a very nice and probably very complex underlying code that someone implemented as part of the console object and the log method.

Try this:

console.log("hmm: ", x);
Obreption answered 30/1, 2013 at 5:25 Comment(3)
I like this. It makes me wonder why more examples don't use the log(x, y) form instead of log(x + y).Observer
@JohnZwinck I don't think that the variable arguments version is as widely supported (at least Chrome and apparently node.js support it, but others may not)Obreption
console.log("Hi %s! Have a nice day!", "John"); // Hi John! Have a nice day!Streaming
P
21

The console.log function

'console.log' is an overloaded function that accepts a list of parameters that are either passed by copy (string|number|boolean) or by reference (everything else).

In the case of values passed by copy, the value is printed by casting it as a string.
In the case of values passed by reference, the value is pretty printed as the browser sees fit.

The + operator

The plus sign operator (+) is overloaded. When both sides of the operator are numbers, the sum of the two operators is returned.

If either side of the operator is a string, then both sides will be cast as string and the concatenation of those two strings will be returned.

console.log("hmm: " + x);

is the same as writing

console.log(String("hmm: ") + String(x));

Solution

Prevent the implicit string casting by swapping the plus sign (+) with a comma (,)

console.log("hmm: ", x);

More Info

For a more in depth description of the 'console.log' function, see:
https://developer.mozilla.org/en-US/docs/DOM/console.log

For a more in depth description on the plus sign operator (+), see:
http://www.w3schools.com/js/js_operators.asp

Pedagogics answered 30/1, 2013 at 5:54 Comment(1)
I would recommend linking to the MDN page on Arithmetic Operators as well (developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…) instead of W3Schools.Gagman
D
6

Use JSON.stringify when printing an object with string appending

console.log("Haa"+JSON.stringify(x))
Delisle answered 30/1, 2013 at 5:25 Comment(0)
I
4

you can use console.log(JSON.stringify(yourObject)); to print your object. it work!

Inapplicable answered 4/7, 2019 at 4:30 Comment(0)
V
3

You have multiple options:

process.stdout.write('hmm: ')
console.dir(x)

Another...

var util = require('util')
process.stdout.write('hmm: ')
console.log(util.inspect(x, true, 10, true))

See util.inspect docs for more info.

Edit: Sorry, my mind thought I read Node.js. This is valid for Node.js only. So, I'll leave it for any Googlers.

Edit2: I'm not crazy, I just need sleep. You did write Node.js. I'm going to add it as a tag.

Victorious answered 30/1, 2013 at 5:25 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.