Я продолжаю получать ошибку «uncaught range» в моем коде, и я не могу понять, почему

Question

Мой инструктор попросил меня создать класс, который представляет транспортные средства, и два подкласса, которые представляют «скорую помощь» и «автобус». Мой HTML-файл предназначен для создания экземпляров каждого подкласса и позволяет мне управлять ими с помощью методов. пока я пишу это, я продолжаю получать ошибку 'uncaught range' в моей консоли.

class Vehicle {
  constructor(color, direction, currentSpeed, topSpeed) {
      this.color = color; //string
      this.direction = direction; //integer 0-359 (representing a compass)
      this.currentSpeed = currentSpeed; //integer
      this.topSpeed = topSpeed; // integer
      this.engineStarted = true; //boolean
     }

//Methods:
  turnOn() {
    this.engineStarted = true;
  }
  info(){
    if(this.engineStarted){
      const info = `${this.color}, ${this.direction}, ${this.currentSpeed}, ${this.topSpeed}`;
      return info;
      } else {
      const status = "Engine has not been started! Vehicle is idle and inactive. Please activate.";
      return status;
      }
    }
  statusOn(){
    if(this.engineStarted){
      const statusOn = "Engine Started, Vehicle Operational.";
      return statusOn;
    } else {
      const status = "Engine has not been started! Vehicle is idle and inactive. Please activate.";
      return status;
    }
  }
  turnOff() {
    this.engineStarted = false;
  }
  info() {
    const status = "The Engine is now disengaged and vehicle is inactive."
    return status;
  }
  accelerate(){
    if(this.engineStarted = false){
      const status = "Engine has not been started! Vehicle is idle and inactive. Please activate";
      return status;
    }
    if (this.currentSpeed < 100) {
      this.currentSpeed += 10;
      console.log("Accelerate speed is now: " + this.currentSpeed);
    } else {
      console.log("Top Speed Reached");
    } 
  }
  brake(){
    if(this.engineStarted = true){
      const status = "Engine has not been started! Vehicle is idle and inactive. Please activate";
      return status;
    }
    if (this.currentSpeed > 10) {
      this.currentSpeed -= 10;
      console.log("Brake speed is now: " + this.currentSpeed);
    } else {
      this.currentSpeed = 0;
      console.log("Speed is now: " + this.currentSpeed);
    }
  }
  turnLeft(){
    if (this.engineStarted = true) {
      const status = "Engine has not been started! Vehicle is idle and inactive. Please activate";
      return status;
    }
    this.direction - 90;
    if (this.direction < 0) {
      this.direction + 90;
    }
  }
  turnRight(){
    if (this.engineStarted = true) {
      const status = "Engine has not been started! Vehicle is idle and inactive. Please activate";
      return status;
    }
    this.direction + 90;
    if (this.direction > 359) {
      this.direction - 90;
    }
  }
}

class Bus extends Vehicle {
  constructor(color, direction, currentSpeed, topSpeed, numberOfSeats) {
    super(color, direction, currentSpeed, topSpeed);
    this.numberOfSeats = numberOfSeats;
  }
  info() {
    if (this.engineStarted) {
      const info = `${this.color}, ${this.direction}, ${this.currentSpeed}, ${this.topSpeed}, ${this.numberOfSeats} seats`;
      return info;
      } else {
      const status = "Engine has not been started! Vehicle is idle and inactive. Please activate";
      return status;
      }
    }

    set numberOfSeats(newSeats) {
      if (newSeats < 50) {
        this.numberOfSeats = newSeats;
      } else {
        alert("Exceeded Seat Number");
      }
    }
  }

class Ambulance extends Vehicle {
  constructor(color, direction, currentSpeed, topSpeed, sirens) {
    super(color, direction, currentSpeed, topSpeed, sirens);
    this.sirens = sirens;
    
  }
    info() {
      if (this.engineStarted) {
        const info = `${this.color}. ${this.direction}, ${this.currentSpeed}, ${this.topSpeed}, Toggle ${this.sirens}`;
        return info;
      } else {
        const status = "Engine has not been started! Vehicle is idle and inactive. Please activate";
        return status;
      }
    }

    toggleSirens(){
    this.sirens = true;
    }
    set sirens(toggleSiren) {
      if (this.sirens){
        const info = "Sirens Activated";
        return info;
      } else {
        const status = "Sirens Inactive";
        return status;
      }
    }
}

<DOCTYPE html/>
<html>
  <head>
    <title>Vehicles</title>
  </head>
  <body>
    <script src="Johnson_ES6_Classes.js"></script>
    <script>
      let bus = new Bus("Yellow", 90, 45, 50, 45);
      let ambulance = new Ambulance("White", 180, 60, 65);

      alert(bus.info());
      alert(ambulance.info());
    </script>
  </body>
</html>

Bus.set numberOfSeats [as numberOfSeats] (Johnson_ES6_Classes.js: 116) Uncaught RangeError: Превышен максимальный размер стека вызовов

Answer 1

Как @ jfriend00 сказал, что у вас есть бесконечный цикл в вашем сеттере. Я думаю, что это может быть другое решение.

class Bus extends Vehicle {
  constructor(color, direction, currentSpeed, topSpeed, numberOfSeats) {
    super(color, direction, currentSpeed, topSpeed);
    this.setseats(numberOfSeats);
  }
  info() {
    if (this.engineStarted) {
      const info = `${this.color}, ${this.direction}, ${this.currentSpeed}, ${this.topSpeed}, ${this.numberOfSeats} seats`;
      return info;
      } else {
      const status = "Engine has not been started! Vehicle is idle and inactive. Please activate";
      return status;
      }
    }

    setseats(newSeats){
        if (newSeats < 50) {
        this.numberOfSeats = newSeats;
      } else {
        alert("Exceeded Seat Number");
      }
    }

   } 

Answer 2

Ваш установщик здесь:

set numberOfSeats(newSeats) {
  if (newSeats < 50) {
    this.numberOfSeats = newSeats;
  } else {
    alert("Exceeded Seat Number");
  }
}

вызывает бесконечную рекурсию, которая переполняет стек. Когда вы пытаетесь установить this.numberOfSeats = newSeats, который снова вызывает сеттер, который снова вызывает сеттер, бесконечно, пока стек не переполнится.

Если вы собираетесь делать сеттер, то вам нужно создать другое именованное свойствохранить значение, которое не имеет установщика. Одной из возможностей является использование _numberOfSeats в качестве имени свойства.

set numberOfSeats(newSeats) {
  if (newSeats < 50) {
    this._numberOfSeats = newSeats;
  } else {
    alert("Exceeded Seat Number");
  }
}

get numberOfSeats() {
    return this._numberOfSeats;
}

---

Но вы на самом деле не объясняете, почему вы используете установщик для этого свойства, поэтомуи другие подходящие решения.