Функция не распознает

Что я пытаюсь сделать:

Я пытаюсь кодировать Flappy Bird с библиотекой p5.js.

Проблема: Функция не распознает функцию, которую я определил.

function Game() {

  this.pipes = generatePipes();
  setInterval(this.gameLoop, 1000 / 60);

  generatePipes = () => {
    const firstPipe = new Pipe(null, space);
    const secondPipeHeight = winHeight - firstPipe.height - space;
    const secondPipe = new Pipe(secondPipeHeight, space);
    return [firstPipe, secondPipe]
  }
  gameLoop = () => {
    this.update();
    this.draw();
  }
  update = () => {
    if (frameCount % 30 == 0) {
      this.pipes = this.generatePipes();
      this.pipes.push(...pipes);
    }
    this.pipes.forEach(pipe => pipe.x = pipe.x - 1);

  }

  draw = () => {
    this.pipes.forEach(pipe => pipe.draw());
  }
}

class Pipe {
  constructor(height, space) {
    this.x = 100;
    this.y = height ? winHeight - height : 0; // borunun y eksenine göre konumunu belirler
    this.width = pipeWidth;
    this.height = height || minPipeHeight + Math.floor(Math.random() * (winHeight - space - minPipeHeight * 2));
  }
  draw() {
    fill(124);
    noStroke();
    rect(this.x, this.y, this.width, this.height);
  }
}

ошибка:

Uncaught TypeError: this.generatePipes is not a function

У вас есть функциональное выражение с анонимной стрелочной функцией, а не объявление функции. так что не поднимается наверх. Глобальная переменная generatePipes по-прежнему равна нулю, когда вы вызываете функцию. Поэтому либо переместите generatePipes в прототип и используйте экземпляр игры, либо определите generatePipes перед его вызовом.

— 10.05.2019 11:19

javascript function canvas ecmascript-6

10.05.2019 11:17

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

Перейти к ответу Данный вопрос помечен как решенный

Ответы 3

То, как вы это написали: вы назначили функцию переменной generatePipes, что означает, что вы можете получить к ней доступ только после создания экземпляра переменной.

У вас есть два варианта: создать экземпляр переменной generatePipes перед ее использованием или объявить ее как подфункцию.

function Game() {

  generatePipes = () => {
    ...
    return x;
  }

  this.pipes = generatePipes();
}

ИЛИ

function Game() {

  this.pipes = generatePipes();

  function generatePipes() {
    ...
    return x;
  }
}

10.05.2019 11:29

Ответ принят как подходящий

function Game() {

  generatePipes = () => {
    const firstPipe = new Pipe(null, space);
    const secondPipeHeight = winHeight - firstPipe.height - space;
    const secondPipe = new Pipe(secondPipeHeight, space);
    return [firstPipe, secondPipe]
  }

  gameLoop = () => {
    this.update();
    this.draw();
  }

  this.pipes = generatePipes();
  setInterval(this.gameLoop, 1000 / 60);

  update = () => {
    if (frameCount % 30 == 0) {
    this.pipes = this.generatePipes();
    this.pipes.push(...pipes);
  }
  this.pipes.forEach(pipe => pipe.x = pipe.x - 1);

  }

  draw = () => {
    this.pipes.forEach(pipe => pipe.draw());
  }
}

Этот обновленный код должен работать. В вашем коде, поскольку вы вызвали generatePipes() перед выражением вашей функции, это не сработает. Функциональные выражения загружаются только тогда, когда интерпретатор достигает той строки кода, где вы впервые определили свое функциональное выражение.

10.05.2019 11:35

Просто назначьте свои функции this:

this.generatePipes = () => {...}
this.gameLoop = () => {...}
this.update = () => {...}
this.draw = () => {...}

10.05.2019 11:40

Другие вопросы по теме

Сортировка массива JavaScript с динамическим столбцом

Как сделать длину значений и индекс равными при применении функции к мультииндексному фрейму данных?

Как вызвать эту функцию, которая требует параметра self

Суммирование столбцов по общему суффиксу в SAS

Сохранение имен элементов списка после подмножества в R

Как суммировать список переменных в пользовательской функции dplyr?

Ожидаемое число, но возвращаемая строка

Перечислить количество data.frames для вывода функции R

Как вызвать функцию внутри другой функции?

Использовать функцию доступа в сквозном запросе SQL

Функция не распознает

Ответы 3

Другие вопросы по теме

Похожие вопросы