Can't access object property, even though it shows up in a console log

Question

Below, you can see the output from these two logs. The first clearly shows the full object with the property I\'m trying to access, but on the very next line of code, I can\

Answer 1

I just encountered this issue with objects generated by csv-parser from a CSV file that was generated by MS Excel. I was able to access all properties except the first property - but it would show up ok if I wrote the whole object using console.log.

Turned out that the UTF-8 CSV format inserts 3 bytes (ef bb bf) at the start corresponding to an invisible character - which were being included as part of the first property header by csv-parser. Solution was to re-generate the CSV using the non-UTF option and this eliminated the invisible character.

Answer 2

Just in case this is helpful for someone, I had a similar problem, and it's because someone created an override for .toJSON in the object I was working with. So the object was something like:

{
  foo: {
         bar: "Hello"
         baz: "World"
       }
}

But .toJSON() was:

toJSON() {
  return this.foo
}

So when I called JSON.stringify(myObject) it returned "{"bar": "Hello", "baz": "World"}". However, Object.keys(myObject) revealed the "foo".

Answer 3

In my case I was passing an object to a promise, within the promise I was adding more key/values to the object and when it was done the promise returned the object.

However, a slight over look on my part, the promise was returning the object before it was fully finished...thus the rest of my code was trying to process the updated object and the data wasn't yet there. But like above, in the console, I saw the object fully updated but wasn't able to access the keys - they were coming back undefined. Until I saw this:

console.log(obj) ;
console.log(obj.newKey1) ;

// returned in console
> Object { origKey1: "blah", origKey2: "blah blah"} [i]
    origKey1: "blah"
    origKey2: "blah blah"
    newKey1: "this info"
    newKey2: "that info"
    newKey3: " more info"
> *undefined*

The [i] is a little icon, when I hovered over it it said Object value at left was snapshotted when logged, value below was evaluated just now. Thats when it occurred to me that my object was being evaluated before the promise had fully updated it.

Answer 4

I had a similar issue today in React. Eventually realised that the problem was being caused by the state not being set yet. I was calling user.user.name and although it was showing up in the console, I couldn't seem to access it in my component till I included a check to check if user.user was set and then calling user.user.name.

Answer 5

This might help somebody as I had a similar issue in which the JSON.parse() was returning an object that I could print on the console.log() but I couldn't acccess the specific fields and none of the above solution worked for me. Like using the combination of JSON.parse() with JSON.stringify().

var jsonObj = JSON.parse(JSON.stringify(responseText))

// where responseText is a JSON String returned by the server.

console.log(jsonObj) ///Was printing the object correctly
console.log(jsonObj.Body) /// Was printing Undefined  

I ended up solving the problem by using a different parser provided by ExtJs Ext.decode();

var jsonObj = Ext.decode(responseText)
console.log(jsonObj.Body) //Worked...

Answer 6

I had similar problem (when developing for SugarCRM), where I start with:

var leadBean = app.data.createBean('Leads', {id: this.model.attributes.parent_id});

// This should load object with attributes 
leadBean.fetch();

// Here were my attributes filled in with proper values including name
console.log(leadBean);

// Printed "undefined"
console.log(leadBean.attributes.name);

Problem was in fetch(), its async call so I had to rewrite my code into:

var leadBean = app.data.createBean('Leads', {id: this.model.attributes.parent_id});

// This should load object with attributes 
leadBean.fetch({
    success: function (lead) {
        // Printed my value correctly
        console.log(lead.attributes.name);
    }
});