title: React prop array length returning 0
body: <p>I have an array prop on a component called jobs that will show in the console, but always returns length:0</p>
  
  <p><img src="https://i.stack.imgur.com/qWMF0.png" alt="console.log screenshot"></p>
  
  <p>The Image you will see definitely has three elements in the array, but when I attempt to access the array length through console.log(this.props.jobs.length);</p>
  
  <p>Why do the elements of this array log out, but I can't access the elements in code?</p>
  
  <p>Per request from @finalfreq, see full code below:</p>
  
  <pre><code>const DepartmentContainer = React.createClass({
     getInitialState:function(){
       return{sortedJobs:{}, loaded:false};
     },
     componentDidMount:function(){
       //console.log(this.state.sortedJobs);
       var departments = this.props.departments;
       departments.map(function(name, index){
         this.state.sortedJobs[name] = [];
       }, this)
  
       var _this = this;
  
       axios.get('{api call returning json}')
       .then(function (response) {
         for(let i=0;i&lt;response.data.jobs.length;i++){
           for(let j=0;j&lt;response.data.jobs[i].metadata[0].value.length;j++){
             _this.state.sortedJobs[response.data.jobs[i].metadata[0].value[j]].push(response.data.jobs[i]);
           }
         }
       })
       .catch(function (error) {
         console.log(error);
       });
       //console.log(Object.keys(_this.state.sortedJobs).length);
       this.setState({sortedJobs: _this.state.sortedJobs});
       this.setState({loaded:true});
     },
     render:function(){
       var departments = this.state.sortedJobs;
       return(
         &lt;div&gt;
         {this.state.loaded ?
           &lt;div className="row grid-12"&gt;
             {Object.keys(departments).map(function(label, department){
               //console.log(departments[label]);
               return &lt;Department key={label} title={label} jobs={departments[label]}/&gt;
             })}
           &lt;/div&gt;
           :
           &lt;div&gt;Test&lt;/div&gt;
         }
         &lt;/div&gt;
       );
     }
   });
  
  
  
   const Department = React.createClass({
      getInitialState:function(){
        return{hidden:false, hasJobs:false};
      },
      componentWillMount:function(){
        const jobs = this.props.jobs;
        if(jobs.length&gt;0){
          this.setState({hasJobs:true});
        }
      },
      componentDidMount:function(){
        console.log(this.state.hasJobs);
        console.log(this.props.jobs.length);
      },
      renderNormal:function(){
        return(
                  &lt;div className="grid-4 department-block" data-dep-filter={this.state.hidden} data-loc-filter="false" data-department={this.props.title}&gt;&lt;h3 className="text-uppercase"&gt;{this.props.title}&lt;/h3&gt;
                      &lt;div className="posting-list margin-bottom"&gt;
              &lt;h3 className="text-uppercase"&gt;{this.props.title}&lt;/h3&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
        )
      },
      renderEmpty:function(){
        return(
              &lt;div className="grid-4 department-block" data-dep-filter={this.state.hidden} data-loc-filter="false" data-department={this.props.title}&gt;&lt;h3 class="text-uppercase"&gt;{this.props.title}&lt;/h3&gt;
                  &lt;div className="posting-list margin-bottom"&gt;
                      &lt;div class="no-posts job-post"&gt;
                          &lt;p&gt;&lt;em&gt;0 Current Openings&lt;/em&gt;&lt;/p&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
        );
      },
      render: function(e){
        if (this.hasJobs) {
          return (
            this.renderNormal()
          )
        }else{
          return(
            this.renderEmpty()
          )
        }
  
      }
    });
  </code></pre>
  
  <p>In the Department:componentWillMount function I want to check the jobs array passed to it from the DepartmentContainer:render function and set the state on said Department to either hasJobs true/false</p>