Question

请帮助解决问题。

我制作剧本：

Board = function(width, height, background){ 
    this.width = width; 
    this.height = height;   
    this.background = background;   

    this.Create();
}

Board.prototype.Create = function(){
    var board = $('<div class="board" id="board"></div>').css({
        width: this.width + 'px',
        height: this.height + 'px',
        background: this.background
    });

    $('#game').append(board);
}


Tank = function(id){ 
  this.x_coord = helper.randomIntFromZero(481);
  this.y_coord = helper.randomIntFromZero(481);
  this.id = id; 
  this.arrow; 
  this.direction;
  this.DIRECTION = ['up', 'right', 'bottom', 'left'];

  this.Create();
}

Tank.prototype.Create = function(){
  this.direction = this.DIRECTION[helper.randomIntFromZero(4)];

  var tank = $('<div class="tank" id="' + this.id + '"></div>').css({
    left: this.x_coord + 'px',
    top: this.y_coord + 'px'
  });

  $('#board').append(tank);
}

Tank.prototype.checkArrowDirection = function(){
  switch (this.direction) {
   case 'up':
      this.arrow = '▲';
      break
   case 'right':
      this.arrow = '►';
      break
   case 'bottom':
      this.arrow = '▼';
      break
   case 'left':
      this.arrow = '◄';
      break         
   default:
      console.log('error arrow direction');
      break
  }
}

Tank.prototype.checkBorderCollision = function(){
  switch (this.direction) {
   case 'up':
      this.y_coord -= 10;
      if(this.y_coord <= 0) this.y_coord = 0; 
      break
   case 'right':
      this.x_coord += 10;
      if(this.x_coord >= 480) this.x_coord = 480;
      break
   case 'bottom':
      this.y_coord += 10;
      if(this.y_coord >= 480) this.y_coord = 480;
      break
   case 'left':
      this.x_coord -= 10;
      if(this.x_coord <= 0) this.x_coord = 0;
      break         
   default:
      console.log('error direction definition');
      break
  }
}

Tank.prototype.checkChangeDirection = function(){
  if(helper.randomIntFromZero(100) > 75){
    this.direction = this.DIRECTION[helper.randomIntFromZero(4)];
  }
}

Tank.prototype.Offset = function(){
  $('#' + this.id).css({
    left: this.x_coord + 'px',
    top: this.y_coord + 'px'
  }).html(this.arrow);
}

Tank.prototype.Move = function(){
  this.checkChangeDirection();
  this.checkBorderCollision();
  this.checkArrowDirection();
  this.Offset();
}


function Helper(){
    this.randomIntFromInterval = function(minInclusive, maxExclusive){
        return Math.floor(Math.random() * (maxExclusive - minInclusive + 1)) + minInclusive;
    };

    this.randomIntFromZero = function(maxExclusive){
        return Math.floor(Math.random() * (maxExclusive));
    };  
};


$(document).ready(function(){
    var board = new Board(500, 500, 'orange'),
            tanks = [];

    helper = new Helper();          

    var i = 0;
    while (i < 6) {
      tanks[i] = new Tank(i);
      i++;
    }

    setInterval(function(){
        var i = 0;
        while (i < 6) {
          tanks[i].Move();
          i++;
        }       
    }, 500);
});

但是构造函数Tank没有工作。控制台显示以下错误消息：

未捕获的ReferenceError：未定义DIRECTION

我尝试使用以下定义：

Tank.prototype.DIRECTION = function(){
  return ['up', 'right', 'bottom', 'left'];
}

但它也没有用。

Answer 1

这是因为你在构造函数中声明了DIRECTION，所以它在构造函数之外是不可见的。

将声明DIRECTION = ['up', 'right', 'bottom', 'left'];移到文件顶部，在任何函数之外，它将起作用。

此代码是问题

Tank.prototype.Create = function(){
  self.direction = DIRECTION[helper.randomIntFromZero(4)];

或者，如评论中所述，如果您想将DIRECTIONS存储为对象属性，则应使用this.DIRECTIONS或Tank.DIRECTIONS（如果它是静态字段）。

如何通过原型定义常量？

1 个答案: