How can I set properties outside of the constructor in JS just like in Java?

Question

If I don't want to initialize all properties of a class when it is instantiated in Java it can be done like this:

class Example {

    Example(int property1){
        this.setProperty1(property1);
    }

    int property1;
    int property2;

    getProperty1(){
        return this.property1;
    }

    setProperty1(int property1){
        this.property1 = property1;
    }

    getProperty2(){
        return this.property2;
    }

    setProperty1(int property2){
        this.property2 = property2;
    }
}

In this case I don't want to initialize right away property2 when I instantiate the Example class.

My question is how can I achieve the same behavior using JS classes, because in my case the following is not working, I can't set values to the chaveDeAcesso property:

(BTW: I'm using ESLint with the Airbnb style-guide on vscode)

class NotaFiscal {

  constructor(indexNotaFiscal) {
    this.indexNotaFiscal = indexNotaFiscal;
  }

  chaveDeAcesso;

  get chaveDeAcesso() {
    return this.chaveDeAcesso;
  }

  set chaveDeAcesso(chaveAcesso) {
    this.chaveDeAcesso = chaveAcesso;
  }

}

Message show inside the class

`chaveDeAcsso` should have a different name than the getter and the setter. — VLAZ, Feb 25 '21 at 14:45
Do notice that `get` and `set` behavior is different from Java. — MinusFour, Feb 25 '21 at 14:51
Let's say that I don't want/need to use ```get chaveDeAcesso()``` and set ```set chaveDeAcesso(chaveAcesso)```, how can I still access the property ```chaveDeAcesso``` without initializing it in the constructor?! — Camilla Pantoja, Feb 25 '21 at 15:22
`obj.chaveDeAcesso` to get the value `chaveDeAcesso = "something"` to set it. — VLAZ, Feb 25 '21 at 15:27
Strictly speaking, you can simply omit the property entirely. Javascript won't complain when you try to access it, it'll just yield `undefined`, which is equivalent to "not initialising it". You can assign to the property at any later point in time, which will create it. — When using Typescript, its type checker would complain, and it would also give you an explicit syntax to *declare but not initialise*. Plain Javascript doesn't need that though. Assignment *is* declaration. — deceze, Feb 25 '21 at 15:29

Nick · Accepted Answer · 2021-02-25T15:40:46.337

0

The setter and getter of Javascript are different from thos of Java. A typical pattern is that you define the instance variable with underscore _chaveDeAcesso and after you allow access to that with setter and getter without the underscore like in the following code. These methods are on the prototype and are accessibile like that:

this.chaveDeAcesso=3; //call the setter when you write
let x = this.chaveDeAcesso; //cal the getter when you read

class NotaFiscal {

  _chaveDeAcesso;

  constructor(indexNotaFiscal) {
    this.indexNotaFiscal = indexNotaFiscal;
  }

  

  get chaveDeAcesso() {
    return this._chaveDeAcesso;
  }

  set chaveDeAcesso(chaveAcesso) {
    this._chaveDeAcesso = chaveAcesso;
  }

}

let x = new NotaFiscal(1);
console.log(x._chaveDeAcesso);
x.chaveDeAcesso=5;
console.log(x._chaveDeAcesso);

Furthermore note that the _chaveDeAcesso defined like that isn't private, and define it like that outside the constructor is a experimental feature (you have to use babel to transpile it in es6 for instance) and may be is thi the mistake cause. Ypu can define it in the constructor without initialize it (This is superfluous, even if you omit it it will still be undefined. Inserted only to make the code more readable.). Either the cases it will be undefined:

constructor(indexNotaFiscal) {
    this.indexNotaFiscal = indexNotaFiscal;
    this._chaveDeAcesso = undefined; //unnecessary instruction, is already undefined. 
  }

edited Feb 25 '21 at 15:40

answered Feb 25 '21 at 15:31

Nick

1,439
2
15
28

1

`this._chaveDeAcesso;` in the constructor does absolutely zilch. – deceze Feb 25 '21 at 15:35
@deceze make the code clearer, namely that you have these two properties. You are right, you can omit. I put it for readibility. I emphasize this in the answer – Nick Feb 25 '21 at 15:38
If you want to explicitly "define" it in the constructor, at least do `this._chaveDeAcesso = undefined`, which actually does something. Otherwise it's just confusing to the reader and any linter. – deceze Feb 25 '21 at 15:40
Is there a reason for eslint to mark this approach as incorrect? [This is the message shown by eslinter](https://i.imgur.com/FkaGj2l.png) – Camilla Pantoja Feb 25 '21 at 16:38
@Camilla Look at https://stackoverflow.com/questions/59713246/how-to-configure-eslint-for-es6-class-with-private-methods-correctly and https://stackoverflow.com/questions/57385125/eslint-does-not-recognize-private-field-declaration-using-nodejs-12 – Nick Feb 25 '21 at 16:43

How can I set properties outside of the constructor in JS just like in Java?

1 Answers1