не могу найти в чем ошибка

@golosalex · Регистрация: 02.07.2013

Author24 — интернет-сервис помощи студентам

PHP/HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="css.css">
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <canvas id="canvas" width="200" height="200"></canvas>
<script src="https://code.jquery.com/jquery-2.1.0.js"></script>
<script>
var canvas=document.getElementById("canvas");
var ctx=canvas.getContext("2d");
var circle = function(x,y,radius,fillCircle)
{
    ctx.beginPath();
    ctx.arc(x,y,radius,0,Math.PI*2,false);
    if (fillCircle)
    {
        ctx.fill();
    }
    else
    {
        ctx.stroke();
    }
};
var drowBee=function(x,y)
{
    ctx.lineWidth=2;
    ctx.strokeStyle="Black";
    ctx.fillStyle="Gold";
 
    circle(x,y,8,true);
    circle(x,y,8,false);
    circle(x-5,y-11,5,false);
    circle(x+5,y-11,5,false);
    circle(x-2,y-1,2,false);
    circle(x+2,y-1,2,false);
};
 
var update=function(coordinate)
{
    var offset=Math.random()*4-2;
    coordinate+=offset;
 
    if(coordinate>200)
    {
        coordinate=200;
    }
    if(coordinate<0){
        coordinate=0;
    }
    return coordinate;
};
 
// var x=100;
// var y=100;
 
// var x1=120;
// var y1=100;
 
// setInterval(function(){
// ctx.clearRect(0,0,200,200);
// drowBee(x,y);
// drowBee(x1,y1);
// x=update(x);
// y=update(y);
// x1=update(x1);
// x2=update(x2);
// },30);
 
var Point = function(x,y)
{
    this.x=x;
    this.y=y;
};
// Point.prototype.updatep=function()
// {
//  this.x=update(this.x);
//  this.y=update(this.y);
// };
var updatep= function(point){
    console.log(point);
var pointx = new Point(update(point.x),update(point.y));
return pointx;
}
 
var roy=[];
for (var i=0;i<20;i++)
{
    roy[i]= new Point(100,100);
}
 
// setInterval(function(){
    ctx.clearRect(0,0,200,200);
    for (i=0;i<20;i++)
    {
 
        drowBee(roy[i].x, roy[i].y);
    }
    roy[i]=updatep(roy[i]);
// },30);
 
</script>   
</body>
</html>

в общем ковыряю популярную книгу js для детей. после прочтения главы где рисуется пчелка в конвасе, решил нарисовать и анимировать n пчелок. в результате где-то накосячил. видимо не очень я еще разобрался с классами в JS. в общем я создал массив из элементов класса Point и написал для элемента класса Point функцию updatep. вроде бы все по правилам, однако, вижу что в функцию передается переменная класса undefine. как так может быть?аналогично пробовал немного по-другому чуть выше в коде и тоже не получилось в итоге закоментил. скажите где я ошибся и как правильно.

@j2FunOnly · 03.05.2018, 15:39

Сообщение от golosalex

Javascript

// setInterval(function(){
    ctx.clearRect(0,0,200,200);
    for (i=0;i<20;i++)
    {
 
        drowBee(roy[i].x, roy[i].y);
    }
    roy[i]=updatep(roy[i]);
// },30);

У вас строка roy[i]=updatep(roy[i]); за пределами цикла, и в этот момент i == 20, то есть выход за пределы цикла, отсюда и передаётся undefined в вашу функцию.

Javascript

setInterval(function() {
  ctx.clearRect(0, 0, 200, 200);
  for (i = 0; i < 20; i++) {
    drowBee(roy[i].x, roy[i].y);
    roy[i] = updatep(roy[i]);
  }
}, 30);

https://jsfiddle.net/rgyqhcq6/

@golosalex · 03.05.2018, 19:18 **[ТС]**

вот я слепой!и как я это не заметил

@golosalex 88 / 79 / 22 Регистрация: 02.07.2013 Сообщений: 627
	03.05.2018, 19:18 [ТС]	3
	вот я слепой!и как я это не заметил 0

Опции темы

не могу найти в чем ошибка

Решение