title: Angular: object structure best practice
body: <p>I'm working in Angular, currently focusing on filtering a nested object.  Here is the structure of my object:</p>
  
  <pre><code>$scope.subjectBin = {
       "Faculty of Engineering": {
             "ECE": [{&lt;course-object&gt;},{&lt;course-object&gt;}],
             "CHEM: [{&lt;course-object&gt;}]
        },
       "Faculty of Science": {
             "BIOL: [{&lt;course-object&gt;},...],
             ...
        },
        ...
  }
  </code></pre>
  
  <p>As I work with filtering this object, build new features, and render this in a layered accordion, I'm thinking I should change the design of this object.  </p>
  
  <p>Someone suggested to change the object to the following:</p>
  
  <pre><code>$scope.subjectBin = [{
      faculty: "Faculty of Engineering",
      subjects: [{
          subjectName: "ECE",
          courses: [{&lt;course-object&gt;},{&lt;course-object&gt;}]
          },
          ...
      ]
  }, {
      faculty: "Faculty of Science",
      subjects: [{
          subjectBin: "CMPUT",
          courses: [{&lt;course-object&gt;},...]
          },
          ...
      ]
  }]
  </code></pre>
  
  <p>I was told this layout is better because: "it doesn't use objects as keymaps and it follows a pattern".  </p>
  
  <p>I agree that it's better but would like some clarification on object layout, in general.</p>
  
  <p>What are <strong>best practices</strong> for laying out <strong>nested objects</strong>?  Are array-based objects with fixed key-names preferable?</p>