title: can't assign to property x on y: not an object - Multidimentional arrays
body: <p>I'm trying to create a multidimensional array like this:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var minutes = [];
  for (let i = 1; i &lt; 10; i++) {
    minutes.push(i);
  }
  var works = [{
    startTime: 80000,
    endTime: 150000
  }, {
    startTime: 200000,
    endTime: 400000
  }, {
    startTime: 15000,
    endTime: 80000
  }, {
    startTime: 300000,
    endTime: 500000
  }];
  var sumTime = 0;
  var tasksByTime = [];
  works.forEach((work, i) =&gt; {
    tasksByTime.push(i);
    console.log(tasksByTime);
    var difference = work.endTime - work.startTime;
    minutes.forEach((time, j) =&gt; {
      console.log(time * 60 * 1000, difference);
      console.log(i, j);
      if (difference &gt; time * 60 * 1000) {
        tasksByTime[i][j] = (work.id);
      }
    });
    sumTime += difference;
  });
  console.log(tasksByTime);</code></pre>
  </div>
  </div>
  </p>
  
  <p>What I want to do, is sort the objects by the difference between <code>startTime</code> and <code>endTime</code>. But when I try to console log it I get: </p>
  
  <blockquote>
    <p>TypeError: can't assign to property 0 on 3: not an object</p>
  </blockquote>
  
  <p>Here's the full log:</p>
  
  <pre><code>Array [ 0 ]
  NumbersPanel.js:35
  60000 8498 NumbersPanel.js:40
  0 0 NumbersPanel.js:41
  120000 8498 NumbersPanel.js:40
  0 1 NumbersPanel.js:41
  180000 8498 NumbersPanel.js:40
  0 2 NumbersPanel.js:41
  240000 8498 NumbersPanel.js:40
  0 3 NumbersPanel.js:41
  300000 8498 NumbersPanel.js:40
  0 4 NumbersPanel.js:41
  360000 8498 NumbersPanel.js:40
  0 5 NumbersPanel.js:41
  420000 8498 NumbersPanel.js:40
  0 6 NumbersPanel.js:41
  480000 8498 NumbersPanel.js:40
  0 7 NumbersPanel.js:41
  540000 8498 NumbersPanel.js:40
  0 8 NumbersPanel.js:41
  Array [ [], 1 ]
  NumbersPanel.js:35
  60000 12580 NumbersPanel.js:40
  1 0 NumbersPanel.js:41
  120000 12580 NumbersPanel.js:40
  1 1 NumbersPanel.js:41
  180000 12580 NumbersPanel.js:40
  1 2 NumbersPanel.js:41
  240000 12580 NumbersPanel.js:40
  1 3 NumbersPanel.js:41
  300000 12580 NumbersPanel.js:40
  1 4 NumbersPanel.js:41
  360000 12580 NumbersPanel.js:40
  1 5 NumbersPanel.js:41
  420000 12580 NumbersPanel.js:40
  1 6 NumbersPanel.js:41
  480000 12580 NumbersPanel.js:40
  1 7 NumbersPanel.js:41
  540000 12580 NumbersPanel.js:40
  1 8 NumbersPanel.js:41
  Array(3) [ [], 1, 2 ]
  NumbersPanel.js:35
  60000 12366 NumbersPanel.js:40
  2 0 NumbersPanel.js:41
  120000 12366 NumbersPanel.js:40
  2 1 NumbersPanel.js:41
  180000 12366 NumbersPanel.js:40
  2 2 NumbersPanel.js:41
  240000 12366 NumbersPanel.js:40
  2 3 NumbersPanel.js:41
  300000 12366 NumbersPanel.js:40
  2 4 NumbersPanel.js:41
  360000 12366 NumbersPanel.js:40
  2 5 NumbersPanel.js:41
  420000 12366 NumbersPanel.js:40
  2 6 NumbersPanel.js:41
  480000 12366 NumbersPanel.js:40
  2 7 NumbersPanel.js:41
  540000 12366 NumbersPanel.js:40
  2 8 NumbersPanel.js:41
  Array(4) [ [], 1, 2, 3 ]
  NumbersPanel.js:35
  60000 66934 NumbersPanel.js:40
  3 0
  </code></pre>
  
  <p>So it kind of works to a the 4th iteration. Why is that?</p>
  
  <p>PS. It's weird but while the code crashes in the browser, it works in the snippet</p>
  
  <p><a href="https://i.stack.imgur.com/Gvpdo.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Gvpdo.png" alt="enter image description here"></a></p>
  
  <p>If this matters I'm using React. If React is not a valid tag here, please remove it.</p>