title: p5.js 27646: Uncaught TypeError: Cannot read property '0' of undefined
body: <p>I was coding in JavaScript, p5.js and came across this error line: </p>
  
  <blockquote>
    <p>27646: Uncaught TypeError: Cannot read property '0' of undefined</p>
  </blockquote>
  
  <p>and I don't know what this means since I am not very experienced with JavaScript. It is also suspicious to me because my project does not have line 27646 anywhere.</p>
  
  <p>here is my code: </p>
  
  <pre><code>  var particles = [];
    const word0 = 'p5.js',
      word1 = 'is nice';
    var active, inactive;
    var cooldown;
    var font;
  
    function preload() {
        font = loadFont('data/LucidaSansRegular.ttf');
    }
  
    function setup() {
        createCanvas(600, 300);
        active = font.textToPoints(word0, 50, 200, 200);
        inactive = font.textToPoints(word1, 50, 200, 200);
  
        cooldown = 500;
  
        for (var i = 0; i &lt; active.length; i++) {
          particles.push(new Particle(active[i].x, active[i].y));
        }
    }
  
   function draw() {
        background(60);
  
        noStroke();
        fill(255);
  
        for (var i = 0; i &lt; particles.length; i++) {
          if (particle[i].radius &lt; 0) {
             particles.splice(i, 1);
             continue;
          }
  
          if (cooldown &lt; 0) {
             particles[i].forceToDes();
          } else {
             particles[i].fleeFromDes();
          }
  
          particles[i].update();
          particles[i].show();
       }
  
       if (cooldown &lt; 500 &amp;&amp; cooldown &gt; -500) {
         cooldown--;
       } else {
         cooldown++;
       }
  
       if (cooldown == -499) {
         changeText();
       }
   }
  
  function changeText() {
       switchActive();
  
       if (active.length == inactive.length) {
         for (var i0 = 0; i0 &lt; active.length; i0++) {
            particles[i0].des = createVector(active[i0].x, active[i0].y)
         }
       } else if (active.length &gt; inactive.length) {
         for (var i1 = 0; i1 &lt; particles.length; i1++) {
            particles[i1].des = createVector(active[i1].x, active[i1].y);
       }
  
         for (var i2 = 0; i2 &lt; active.length - inactive.length; i2++) {
            var p = new Particle(active[i2].x, active[i2].y),
              r = particles.random();
            p.pos = r.pos;
            particles.push(p);
         }
      } else {
         for (var i3 = 0; i3 &lt; inactive.length - active.length; i3++) {
           var r = floor(random(particles.length));
           particles[r].shrink();
         }
  
        for (var i4 = 0; i4 &lt; particles.length; i4++) {
           particles[i4].des = createVector(active[i4].x, active[i4].y);
        }
    }
  }
  
  function switchActive() {
     var temp = active;
     active = inactive;
     inactive = temp;
  }
  </code></pre>
  
  <p>I hope you can help me :)
  Thank you already!</p>