Why I am getting wrong output when I modify the following Javascript object code?

Question

This is the javascript code.

var option={
  value:'',
  desc:{
   en:'',
   hn:''
  }
};
option.value='15';
option.desc.en='hello';
option.desc.hn='world'; 

console.log(option);

option.value='25';
option.desc.hn='India';

console.log(option);

This gives the output-

object {value:25,object {desc:{en:"hello",hn:"India"}}}

Instead of

object {value:15,object {desc:{en:"hello",hn:"world"}}}

object {value:25,object {desc:{en:"hello",hn:"India"}}}

http://stackoverflow.com/questions/7389069/console-log-object-at-current-state — kkkkkk, May 17 '15 at 07:49

score 0 · Answer 1 · answered May 17 '15 at 07:48

0

the output diff with different browser. I got the object {value:15,object {desc:{en:"hello",hn:"world"}}} object {value:25,object {desc:{en:"hello",hn:"India"}}} through chrome.

answered May 17 '15 at 07:48

Chales Tuang

11
2

Try with Mozilla.. Do you have the reason why its behaving like this ? – Rayon May 17 '15 at 07:55

score 0 · Answer 2 · answered May 17 '15 at 07:59

Like @Chales Tuang mentioned, I got the expected output on

jsfiddle

var option={
  value:'',
  desc:{
   en:'',
   hn:''
 }
};
option.value='15';
option.desc.en='hello';
option.desc.hn='world'; 

console.log(option);

option.value='25';
option.desc.hn='India';

console.log(option);

The only explanation I could possibly think of for the case where you get same output in each call to console.log, is that the browser is applying the principle that objects are live in Javascript, as shown by Stoyan Stefanov in his book Object Oriented Javascript

As a result, the when you call console.log, it sees the latest, up-to-date property(ies) of the object, even though the object was augmented after the call, in as much as the update is within the scope of the call, it just grabs the current updated state of the object.

That's my thought on this, anyway.

Ramanathan Muthuraman · Answer 3 · 2015-05-17T08:07:30.850

0

This is because of a bug in WebKit browsers (https://code.google.com/p/chromium/issues/detail?id=44720)

Instead of logging the entire object,try to log the particular value, you will get the expected result..

 console.log(option.desc.hn);

Or try JSON.stringify

 console.log(JSON.stringify(option));

JS Fiddle link : https://jsfiddle.net/t744ohog/2/

edited May 17 '15 at 08:07

answered May 17 '15 at 08:00

Ramanathan Muthuraman

732
3
14

Why I am getting wrong output when I modify the following Javascript object code?

3 Answers3