Projet Snake

Bonjour à tous !

Je suis nouvelle ici et j'ai grandement besoin de votre aide (ça commence hehe)

Je suis en train d'apprendre seule les bases de JS et je réalise le projet Snake. J'en suis à la partie Création du serpent et c'est là que ça bloque...

Lorsque je cherche à le faire afficher, j'ai tout le temps la même erreur :
Uncaught TypeError: Cannot read property '0' of undefined
at drawBlock (script.js:42)
at Snake.draw (script.js:56)
at refreshCanvas (script.js:36)
at init (script.js:23)
at window.onload (script.js:12)

Ci-dessous mon code complet :

window.onload = function ()
 {
    var canvasWidth = 900;
    var canvasHeight = 600;
    var blockSize = 30;
    var ctx;
    var delay = 100;
    /*var xCoord = 0;
    var yCoord = 0;*/
    var snakee;
    
    init();
    
   function init()
    {  
        var canvas = document.createElement('canvas');
        canvas.width = canvasWidth;
        canvas.height = canvasHeight;
        canvas.style.border = "1px solid";
        document.body.appendChild(canvas);
        ctx = canvas.getContext('2d');
        snakee = new Snake([[6,4],[5,4],[4,4]]);
        refreshCanvas();
   
    }
    
    function refreshCanvas()
    { 
        /*xCoord += 5;
        yCoord += 5; 
        /*ctx.fillStyle = "#ff0000";
        ctx.fillRect(xCoord, yCoord, 100, 50);
        ces notions étaient utiles avant qu'on crée le serpent en petits blocs'*/
        ctx.clearRect(0,0,canvasWidth, canvasHeight);
        snakee.advance();
        snakee.draw();
        setTimeout(refreshCanvas, delay);
    }
    
    function drawBlock(ctx, position)
    {
        var x = position [0] * blockSize;
        var y = position [1] * blockSize;
        ctx.fillRect(x ,y , blockSize, blockSize);
    }
    
    function Snake(body)
    {
        this.body = body;
        this.draw = function()
        {
            ctx.save();
            ctx.fillStyle = "#ff0000";
            for(var i = 0; i < this.body.length; i++);
            {
                drawBlock(ctx, this.body[i]);
            }
            ctx.restore();
                  
        };
        
        this.advance= function()
        {
            var nextPosition = this.body[0].slice();
            nextPosition[0] += 1;
            this.body.unshift(nextPosition);
            this.body.pop();
        }
    }
    
}

Merci beaucoup pour votre temps et votre aide !
Alicja

Salut

Uncaught TypeError: Cannot read property '0' of undefined

Ce type d'erreur dit qu'il est impossible de lire la variable, où ? ici :

at drawBlock (script.js:42)

donc cette ligne j'imagine : var x = position [0] * blockSize;

donc soit position est inconnu au bataillon, soit blockSize..

En testant sur codepen, this.body de ta boucle for est undefined..
Modifié par JENCAL (07 Nov 2017 - 16:05)

JENCAL a écrit :
OLALAL j'ai mis longtemps à le voir !!

Je comprenais pas pourquoi dans ta boucle, i était toujours égale à 3....

for(var i = 0; i < this.body.length; i++);

En faite tu as laissé un ";" à la fin du for... ce qu'il ne faut pas faire bien sur

Ca marche !!! Merci beaucoup !
C'était si simple, arffff