Home > Blockchain >  Javascript setter resulting to no effect
Javascript setter resulting to no effect

Time:03-02

I am working on a project and my setters just refuse to work whatsoever. I have tried multiple solutions like making it private (but that doesn't work since I need to access it), renaming the value under setters to something different and trying to call them with or without parenthesis.

class Car {
        constructor(id, image, vPosition, wins, hPosition, finishedRace) { //there is a chance I may need to remove the last 3 parms (wins,hpos and finished race)
            this.id = id;
            this.image = image;
            this.vPosition = vPosition;
            this.hPosition = hPosition;
            this.finishedRace = finishedRace;
            this.wins = wins;
        }
        get getvPosition() {
            return this.vPosition;
        }
        /**
         * @param {any} vPos
         */
        set setvPosition(vPos)  {
            this.vPosition1 = vPos;
        }
        
        get getHPosition() 
        {
            return this.hPosition;
        }

        set setHPosition(hPos) 
        {
            this.hPosition = hPos;
        } 
        move(Car)   {
        Car.setHPosition(10);
    }

this is my car class where I am creating the constructor and getter setters. with other methods

const cars = [
        new Car("Classic", "images/car1.png", 150,0,0,0),
        new Car("Bug", "images/car2.png", 350,0,0,0),
        new Car("Hatchback", "images/car3.png", 550,0,0,0),
        new Car("Sedan", "images/car4.png", 750,0,0,0)
    ];

Above array of object Car which is just outside of Car class.

take a look on that move method in Car class. I am using it later in the code like this:

cars[2].move;
let str = cars[2].getHPosition;
console.log(str);

Which should call setter on cars[2] and make it set its HPosition to 10 Instead it returns 0 as if the setter was never called. I know there must be some silly mistake here but I am so annoyed by it

CodePudding user response:

I think in this case I would remove the dependency on getters/setters altogether, and just have simple class methods that you call normally. That way move can call setHPosition without any issues.

class Car {

  constructor(id, image, vPosition, wins, hPosition, finishedRace) {
    this.id = id;
    this.image = image;
    this.vPosition = vPosition;
    this.hPosition = hPosition;
    this.finishedRace = finishedRace;
    this.wins = wins;
  }

  getvPosition() {
    return this.vPosition;
  }

  setvPosition(vPos) {
    this.vPosition1 = vPos;
  }

  getHPosition() {
    return this.hPosition;
  }

  setHPosition(hPos) {
    this.hPosition = hPos;
  }

  move(val) {
    this.setHPosition(val);
  }

}

const cars = [
  new Car("Classic", "images/car1.png", 150, 0, 0, 0),
  new Car("Bug", "images/car2.png", 350, 0, 0, 0),
  new Car("Hatchback", "images/car3.png", 550, 0, 0, 0),
  new Car("Sedan", "images/car4.png", 750, 0, 0, 0)
];

cars[2].move(10);
console.log(cars[2].getHPosition());

CodePudding user response:

Your move function takes a Car parameter and moves that car rather than the current class instance this. So you should change the move function to take a distance value and then call this.setHPosition = this.getHPosition distance, assuming you want to move the car by a displacement from its current position rather than to a fixed position. i.e.:

move(distance) {
    this.setHPosition = this.getHPosition   distance; // or just use this.hPosition directly: this.hPosition  = distance
}

Note that getters and setters are functions that are accessed like properties, so you don't use the parentheses, but simply assign to the property for a setter, or read the property for a getter. Its syntactic sugar, but if you use it, you gotta use it right! It's probably better not to prefix the setters/getters with 'get' and 'set' since that makes them look like functions and could be confusing.

  • Related