JavaScript выдает ошибку при вызове функции

Question

Я написал класс поля, вот два его метода:

freeCell(){
    return [0, 0];
}

addSnake(){
    self.snakes.push(new Snake(self.snakesStartLength, self.freeCell(), self));
}

Но JavaScript выдает ошибку:

Uncaught TypeError: self.freeCell is not a function
    at Field.addSnake (classes.js:32)
    at HTMLDocument.<anonymous> (main.js:3)
    at fire (jquery-1.8.3.js:974)
    at Object.fireWith [as resolveWith] (jquery-1.8.3.js:1084)
    at Function.ready (jquery-1.8.3.js:406)
    at HTMLDocument.DOMContentLoaded (jquery-1.8.3.js:83)

Почему он не считает freeCell за функцию?

Если нужно, то вот весь код класса:

class Field{
    constructor(n, m=n, snakesStartLength = 3, backgroundColors=['#7bd17b', '#56c456']) {
        self.n = n;
        self.m = m;
        self.apples = [];
        self.snakes = [];
        self.snakesStartLength = snakesStartLength;

        let screenHeight = document.documentElement.clientHeight;
        let screenWidth = document.documentElement.clientWidth;
        self.size = (Math.min(screenHeight, screenWidth) - 30) / n * n;
        self.cellSize = self.size / n;

        self.canvas = document.getElementById("canvas");
        self.ctx = self.canvas.getContext("2d");

        self.backgroundColors = backgroundColors;

        $(self.canvas).css('height', self.size);
        $(self.canvas).css('width', self.size);
        $(self.canvas).prop('height', self.size);
        $(self.canvas).prop('width', self.size);
        $(self.canvas).css('left', (screenWidth - self.size) / 2);
        $(self.canvas).css('top', (screenHeight - self.size) / 2);
    }

    freeCell(){
        return [0, 0];
    }

    addSnake(){
        self.snakes.push(new Snake(self.snakesStartLength, self.freeCell(), self));
    }

    drawField(){
        for (let i = 0; i < self.n; i++){
            for (let j = 0; j < self.m; j++){
                self.ctx.fillStyle = self.backgroundColors[(i + j) % 2];
                self.ctx.fillRect(i * self.cellSize, j * self.cellSize, self.cellSize + 1, self.cellSize + 1);
            }
        }
    }

    drawSnakes(){
        for (let snake in self.snakes){
            snake.draw();
        }
    }

    draw(){
        self.drawField();
        self.drawSnakes();
    }
}

Answer 1

class Field {
  constructor(n, m = n, snakesStartLength = 3, backgroundColors = ['#7bd17b', '#56c456']) {
  
    console.log(self == window);
    
    self.n = n;
    self.m = m;
    self.apples = [];
    self.snakes = [];
    self.snakesStartLength = snakesStartLength;

    let screenHeight = document.documentElement.clientHeight;
    let screenWidth = document.documentElement.clientWidth;
    self.size = (Math.min(screenHeight, screenWidth) - 30) / n * n;
    self.cellSize = self.size / n;

    self.canvas = document.getElementById("canvas");
    self.ctx = self.canvas.getContext("2d");

    self.backgroundColors = backgroundColors;

    $(self.canvas).css('height', self.size);
    $(self.canvas).css('width', self.size);
    $(self.canvas).prop('height', self.size);
    $(self.canvas).prop('width', self.size);
    $(self.canvas).css('left', (screenWidth - self.size) / 2);
    $(self.canvas).css('top', (screenHeight - self.size) / 2);
  }

  freeCell() {
    return [0, 0];
  }

  addSnake() {
    self.snakes.push(new Snake(self.snakesStartLength, self.freeCell(), self));
  }

  drawField() {
    for (let i = 0; i < self.n; i++) {
      for (let j = 0; j < self.m; j++) {
        self.ctx.fillStyle = self.backgroundColors[(i + j) % 2];
        self.ctx.fillRect(i * self.cellSize, j * self.cellSize, self.cellSize + 1, self.cellSize + 1);
      }
    }
  }

  drawSnakes() {
    for (let snake in self.snakes) {
      snake.draw();
    }
  }

  draw() {
    self.drawField();
    self.drawSnakes();
  }
}

let field = new Field(3);

#canvas {
  width: 200px;
  height: 100px;
  border: 1px solid black;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<canvas id="canvas"></canvas>

БЛОГ НА HUSL

JavaScript выдает ошибку при вызове функции

Ответы (1 шт):