Pushing Nested Javascript Object properties into multiple arrays

Question

Here is my object

 {
    "_id": "555ab225ae9c30b57432e1d2",
    "firstname": "Mindy",
    "lastname": "Martinez",
    "subjects": [
      {
        "name": "Mathematics",
        "grades": {
          "assignments": 16,
          "tests": 4,
          "final": 38
        }
      },{
        "name": "English",
        "grades": {
          "assignments": 10,
          "tests": 12,
          "final": 35
        }
      },{
        "name": "Chemistry",
        "grades": {
          "assignments": 19,
          "tests": 8,
          "final": 3
        }
      },{
        "name": "Physics",
        "grades": {
          "assignments": 4,
          "tests": 26,
          "final": 32
        }
      },{
        "name": "Biology",
        "grades": {
          "assignments": 19,
          "tests": 26,
          "final": 1
        }
      },{
        "name": "F Maths",
        "grades": {
          "assignments": 4,
          "tests": 6,
          "final": 11
        }
      }
    ]
  }

I need to know how to push the subject name and the total amount of grades (assignments + tests + final) into seperate arrays subjects (subject name) and scores (sum of assignments tests and final)

  var subjects = [];
  var scores = [];
  for(var x in $scope.data.subjects){
    subjects.push(x.name);
  }
  for(var y in $scope.data.subjects){
    scores.push(y.assignments+y.tests+y.final);
  }

heres my code http://plnkr.co/edit/RXzjPllg0RSWjvgMjIoU?p=preview

what I tried is under the //Data// comment . Dosent seem to work as the labels for the radar chart show undefined same thing with the data

Welcome to Stackoverflow, you need to include the relevant code in your question, just linking to it won't do. — max, May 19 '15 at 17:07
At least in for(var x in $scope.data.subjects), x is index. After changing both x&y in the loop to $scope.data.subjects[x]... I can see something. Not sure if that is what you want — ABOS, May 19 '15 at 17:09
IT shows [object,Object] it should show the name of the subjects in each of the points and the rader chart should display the data — Anthony Akpan, May 19 '15 at 17:13

score 2 · Accepted Answer · edited May 19 '15 at 18:56

You can simply replace your for loops with angular.forEach :

  angular.forEach($scope.data.subjects, function(x){
    subjects.push(x.name);
  })
  angular.forEach($scope.data.subjects, function(y){
    scores.push(y.grades.assignments+y.grades.tests+y.grades.final);
  })

Or even in a single angular.forEach like this:

  angular.forEach($scope.data.subjects, function(x){
    subjects.push(x.name);
    scores.push(x.grades.assignments+x.grades.tests+x.grades.final);
  })

Updated plunker. See console for scores.

score 1 · Answer 2 · answered May 19 '15 at 17:17

1

You need to change loop from this:

  for(var x in $scope.data.subjects){
    subjects.push(x.name);
  }

to this:

$scope.data.subjects.forEach(function(x) {
    subjects.push(x.name);
  });

It works for me in your example.

answered May 19 '15 at 17:17

Arkadiusz

489
2
10

score 1 · Answer 3 · answered May 19 '15 at 17:30

Your first loop is attempting to get the property 'name' out of the index (x), which is why you see 'undefined' on your chart. (The property 'name' is undefined on the index).

I will second what Nico said above me, you should not be using 'for in' loops on arrays, a simple for loop will suffice.

The same issue you had with the first loop applys to the second, the index y does not have a property 'tests' and so the result is undefined. Also of note, your data structure does not have 'tests' as a parameter of the subjects object, but rather the grades object inside of the subject object, so to get the data you would need to use

subject.grades.tests

to get the test scores. (You would use a similar bit of code to get the other score types)

Additionally, you don't need to use two loops to get the data into your two arrays (your loops are identical).

A sample bit of (as far as I can tell) working code is below:

//Data//
var subjects = [];
var scores = [];
var iter;
for(iter = 0; iter < $scope.data.subjects.length; iter = iter + 1)
{
    var x = $scope.data.subjects[iter];
    subjects.push(x.name);
    scores.push(x.grades.tests + x.grades.assignments + x.grades.final);
}

score 0 · Answer 4 · edited May 23 '17 at 10:26

0

Change subjects.push(x.name); to subjects.push($scope.data.subjects[x].name);.

You should not use for in with arrays in javascript. I suggest you loop with a simple for.

See Why is using "for...in" with array iteration a bad idea?

edited May 23 '17 at 10:26

Community

1
1

answered May 19 '15 at 17:16

Nico

6,395
4
25
34

Pushing Nested Javascript Object properties into multiple arrays

4 Answers4