Question

这是我的代码，它应该能够呈现带有蛇及其食物的画布，只要蛇在它的1个像素内，食物就会移动到一个新的位置。正如我在标题中所说，错误读取/; TypeError：pos未定义

var snake;
var scl = 10;
var food;

function setup()
{
  //Sets the Canvas
  createCanvas(700, 700);

  //Creates a new object using the variable snake
  snake = new Snake();

  //Sets the frame rate
  frameRate(10);

  //Creates a vector called food
  //setLocation();
}

function draw()
{
  //Sets the Background, number implies the colour
  background(50);

  //Adds all the values set within the function to the snake
  snake.updateSnake();
  snake.showSnake();
  snake.keyPressed();

  if(snake.eatFood(food))
  {
    food.updateFood();
  }

  food.showFood();
  food.updateFood();
}
  /*Here we setup the food
  //fill(255, 0, 10);
  rect(food.x, food.y, scl, scl);

}


function setLocation()
//{
  //var columns = floor(width/scl);
  //var rows = floor(height/scl);

  //food = createVector(floor(random(columns)), floor(random(rows)));
  //food.mult(scl);
*/

function Food()
{
  this.showFood = function()
  {
    fill(255, 0, 10);
    rect(food.x, food.y, scl, scl);
  }

  this.updateFood = function()
  {
    var columns = floor(width/scl);
    var rows = floor(height/scl);

    food = createVector(floor(random(columns)), floor(random(rows)));
    food.mult(scl);
  }
}


function Snake()
{
  this.x = 0;
  this.y = 0;

  this.xspeed = 0;
  this.yspeed = 0;

  this.updateSnake = function()
  {
    this.x = this.x + this.xspeed * scl;
    this.y = this.y + this.yspeed * scl;

    this.x = constrain(this.x, 0, width - scl);
    this.y = constrain(this.y, 0, height - scl);
  }

  this.showSnake = function()
  {
    fill(255);
    rect(this.x, this.y, scl, scl);
  }

  this.direction = function(x, y)
  {
    this.xspeed = x;
    this.yspeed = y;
  }

  this.eatFood = function(pos)
  {
    var distance = dist(this.x, this.y, pos.x, pos.y);

    if(distance < 1)
    {
      return true;

      console.log("WITHIN RANGE");

    }else
    {
      return false;

      console.log("OUTSIDE RANGE");

    }
  }

  this.keyPressed = function()
  {
    if (keyCode === UP_ARROW)
    {
      snake.direction(0, -1);
    } else if (keyCode === DOWN_ARROW)
    {
      snake.direction(0, 1);
    } else if (keyCode === RIGHT_ARROW)
    {
      snake.direction(1, 0);
    } else if (keyCode === LEFT_ARROW)
    {
      snake.direction(-1, 0);
    }
  }
}

Answer 1

我看到你创建了食物变量，但是我看不到你实际初始化它的位置。食物是未定义的，但你将它传递给eatFood方法，这会给你一个错误。

尝试将其放入您的设置功能中。

food = new Food()

然后你需要给它一个初始的x和y值。也许使用Math.random（）

修改您可能需要重新考虑部分代码。

首先，将列和行设为全局变量或至少限定为Food类。

var snake; var scl = 10; var food; var columns = floor(width/scl); var rows = floor(height/scl);

您应该在创建食物后立即调用updateFood。所以把它放在构造函数中或在创建食物后立即调用它。只需确保它出现在this.updateFood方法之后。例如：

function Food() { this.updateFood = ... // blah blah code here ... this.updateFood(); }

为了避免在食物上写字，请确保将该矢量设置为食物的范围。比如一个职位。

this.updateFood = function() { this.pos = createVector(floor(random(columns)), floor(random(rows))); this.pos.mult(scl); }

最后，当蛇吃食物时，确保你通过食物然后抓住它的位置。（除非你决定给食物一个this.x和this.y字段）。

this.eatFood = function(food) { var distance = dist(this.x, this.y, food.pos.x, food.pos.y);

这样做的好处是，如果你决定，你可以在屏幕上同时拥有多个食品。

Answer 2

你永远不会初始化食物。您只声明变量。您需要在程序中的某个位置执行：food = new Food();。最好把它放在设置方法中。它也不起作用，因为食物功能没有this.x和this.y。

Answer 3

在draw()设置之前调用food函数。 food是你的pos变量，因此崩溃了。在调用

之前，请确保将食物初始化为某物

if(snake.eatFood(food)){
    food.updateFood();
}

JavaScript p5：TypeError：pos未定义

3 个答案: