menu

Questions & Answers

What is the difference, if any, between field value and property in TypeScript/Angular?

In this example, I have two cases of a service that exposes an observable, test$. One through a getter, the other as a public field.

Is there any practical difference?

I have seen numerous examples of declarative programming using the field way. Is using a getter not considered declarative?

component:

@Component()
export const TestComp {
    private test$ = this.testService.test$; 
    constructor(private testService: TestService){}
}

Case 1: Service with field value:

@Injectable()
export const TestService {
    public test$ = of('test');
}

Case 2: Service with property/getter:

@Injectable()
export const TestService {

    private _test$ = of('test');
    public get test$() {
        return this._test$;
    }
}
Comments:
2023-01-24 11:42:02
does the last one compile correctly (i can see name duplication)
2023-01-24 11:42:02
No, think of it as two cases. Choose one. I can edit to clarify. Thank you
2023-01-24 11:42:02
I meant that test$ is duplicated in the second variant as this.test$ can point to either of those field or getter. Its not the name of TestService an issue here.
2023-01-24 11:42:02
now its better.
2023-01-24 11:42:02
Oh, yes, fixed it. Thank you :)
2023-01-24 11:42:02
"I have seen numerous examples of declarative programming using the field way." I'm confused by this. Declarative programming will be trying to avoid the implementation details and focuses on declaring intent over details. Why should the details matter in declarative approach?
2023-01-24 11:42:02
Good question, @VLAZ! I've just never seen anyone use a getter so I assumed it was not the declarative way to do it?
2023-01-24 11:42:02
Fields were probably used because of the issue you have presented here - you have to have _test and get test (boilerplate code, who wants that?). For the consumer, it will be the same as as having readonly public field.
2023-01-24 11:42:02
@Antoniossss, yes, maybe. It is easier to test with property/getter in my experience. If there is no difference, I'd prefer to use getters test wise
2023-01-24 11:42:02
but in tests (consumer) it will not matter, how is that different to you?
2023-01-24 11:42:02
Could be just down to not needing a getter in this case. Again, declarative shouldn't really rely on specific implementation. That's why it exists, to abstract away those details. Focusing on the details of why a certain declarative approach chose to do something seems backwards.
2023-01-24 11:42:02
@Antoniossss The case when I mock the service. Let's say this.testService.test$ actually returns a httpcall-observable, and I'd like to mock it. With a getter I could, in the test, use something like spyOnProperty(testService, 'test$', 'get').and.returnValue('of('mockedData')). I can't do that (to my knowledge) with fieldvalue. I have to use createSpyObj('testService, {method: null}, {test$: of('mockedData'})
Answers(1) :

The following are the advantages I can think of for using getters/setters

  1. Adding appropriate access specifiers and validation logic before retrieving the property of the object.

  2. Avoiding Anemic domain model. This is to make sure classes that describes domain has its own logic and validations instead of services handling all of the business logic.

A bit more reading on Anemic domain model https://en.wikipedia.org/wiki/Anemic_domain_model