6

When I print object in HTML using for each loop I'm getting only half contents of the object but when I print using console.log and press that little triangle I'm getting full object and i is shown near that object when I hover that it says value was evaluated just now as shown in below image, enter image description here

When I print same object in HTML it looks like this,

7.33--Some Name
7.08--Some Name
7.83--Some Name

Actually, object contains a total of 5 elements as shown in the above image, Code for printing object HTML,

for (var key in obj){
    $("p").append(key+"--"+obj[key][0]+"<br>");
}
Shubham Khatri
  • 270,417
  • 55
  • 406
  • 400
Mehul Prajapati
  • 1,210
  • 2
  • 11
  • 29

1 Answers1

14

Examining objects via console.log happens in an asynchronous manner.

The reference to the object is passed synchronously to console but it doesn't display the properties till its expanded . If the object has been modified before examining it in the console, the data shown will have the updated values. Chrome console shows a little i in a box which which says value below was evaluated just now

In order to print the object completely in console, you can stringify and log it like

console.log(JSON.stringify(obj));
Shubham Khatri
  • 270,417
  • 55
  • 406
  • 400
  • How to print in html, I have tried doing like x=JSON.stringify(obj) and use x as object but thats not working. – Mehul Prajapati Jun 05 '17 at 06:32
  • After using JSON.stringify on obj, your obj will be converted to string, and hence things like obj.keyName won't work. In HTML you can directly do obj.keyName without stringifying – Shubham Khatri Jun 05 '17 at 06:37
  • That's what i can't do, before accessing object it has to be evaluated that can be done in developer tool only by clicking that small triangle arrow – Mehul Prajapati Jun 05 '17 at 07:00
  • So if I understand correctly, you need to add obj value to HTML, why do you need developerTool for that. Also if you directly print console.log(obj.keyName) then it will work properly, ie. with individual keyname – Shubham Khatri Jun 05 '17 at 07:02
  • developer tool is for checking and console.log(obj) doesn't show full object until it is evaluated that's why when i print it using for each loop in html I'm getting half object only how do i get full object in html – Mehul Prajapati Jun 05 '17 at 07:06
  • How are you handling it in HTML, can you add the code for that – Shubham Khatri Jun 05 '17 at 07:07