Почему не учитывается счётчик?

var canvas = document.getElementById('canvas'); 
var c = canvas.getContext('2d'); 
var arr = [ "hello", "hi", "buy"];
      function loop() { 
  window.requestAnimationFrame(loop); 
  createWords(); 
//  updateWords(); 
//  drawWords(); 
} 
window.requestAnimationFrame(loop);



  function createWords() {
      var ccc = 0;
      if ( ccc < 3 ) {
          for (var i of arr) {
          c.fillText(i, Math.random()*canvas.width, 10);
              ccc++;
              }  
  }    
  }

Я хочу, чтобы слова из массива появились только один раз, которые потом я буду двигать. Для этого сделал счётчик (ccc) перед циклом, но создаётся всё равно бесконечно. В чём ошибка?