Unable to get attribute from object in javascript but can print it to the console when logging its parent

Question

Unable to get attribute from object in javascript but I can print it to the console when logging its parent. It does appears as being an ordinary object. Why cant i access _id?

The code below is in a function: $scope.create = function() { that gets called on submit of a form in my angular view:<form class="form-horizontal" data-ng-submit="create()" novalidate>

So heres the problem, in my function create:

     console.log($scope.account);
      var tmp=$scope.account;
      console.log('id:' +tmp._id);

Gives me:

      {"user":{"displayName":"David Karlsson","_id":"548217e5402b8b8c194d9c11"},"_id":"5483235cc0d8580000152f0b","__v":0,"created":"2014-12-06T15:40:12.682Z","amount":0,"interests":[{"rate":123,"date":"2014-12-30T23:00:00.000Z","_id":"5483235cc0d8580000152f0c"}],"desc":"","name":"Acount"}

      id:undefined

Changing the post method did not help:

    $scope.create = function() {
        // Create new Income object
      var copy = Object.assign({}, this.account);
      console.log(copy);
    }

Gives:

TypeError: undefined is not a function at Scope.$scope.create (localhost:3000/modules/incomes/controllers/incomes.client.controller.js:12:29) at localhost:3000/lib/angular/angular.js:10880:21 at callback (ocalhost:3000/lib/angular/angular.js:19237:17) at Scope.$eval (localhost:3000/lib/angular/angular.js:12788:28) at Scope.$apply (localhost:3000/lib/angular/angular.js:12886:23) at HTMLFormElement. (localhost:3000/lib/angular/angular.js:19242:23) at localhost:3000/lib/angular/angular.js:2853:10 at forEach (localhost:3000/lib/angular/angular.js:325:18) at HTMLFormElement.eventHandler (localhost:3000/lib/angular/angular.js:2852:5)

Oriol · Accepted Answer · 2014-12-06 22:08:47Z

1

This is because some code changes $scope.account after your call to console.log, but before the object is displayed.

For example:

var obj = {prop: {}};
console.log(obj.prop);   // Produces {foo: "bar"}
var cached = obj.prop;
console.log(cached.foo); // Produces undefined
obj.prop.foo = 'bar';

This doesn't happen with the cached value because it's a string instead of an object.

To fix it, you can use EcmaScript6 Object.assign to "copy" your object:

var obj = {prop: {}};
console.log(Object.assign({}, obj.prop)); // Produces {}
var cached = obj.prop;
console.log(cached.foo);                  // Produces undefined
obj.prop.foo = 'bar';

edited Dec 6, 2014 at 22:08

answered Dec 6, 2014 at 22:03

Oriol

291k71 gold badges459 silver badges535 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Mihai Vilcu Over a year ago

ok maybe I'm missing something but your first example makes no sense to me. Where did you run that ?

Mihai Vilcu Over a year ago

now I'm even more confuse. the first console log should log an empty object... isn't console log synchronous ? I clicked on run a few times and I got this puu.sh/dkSHk/6d5fd88601.png

Oriol Over a year ago

@ionutvmi It's asynchronous, at least on Firefox 37.

Mihai Vilcu Over a year ago

on firefox I always get what you posted but in firebug I always get an empty object on the first console log... That screenshot was from chrome 40

Mihai Vilcu Over a year ago

ok so it's asynchronous in chrome also, thank you for your replies

Collectives™ on Stack Overflow

Unable to get attribute from object in javascript but can print it to the console when logging its parent

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related