Typescript: undefined static variable issue

Question

I can't understand why the next issue happens. Code with the same structure works fine in any other object-oriented languages like C# or Java. I am writing Node.Js app using Typescript.

So I have a class ServiceLocator with two static variables:

//ServiceLocator.ts
export class ServiceLocator {
    public static dataRepository: IDataRepository = new DataRepository();
    public static authService: IAuthService = new AuthService();
}

Class from the second one variable using the first one static variable. This how it looks:

//AuthService.ts
const dataRepository: IDataRepository = ServiceLocator.dataRepository;
export class AuthService implements IAuthService {
...
}

But once I am trying to get authService link like this:

//AuthController.ts
const authService: IAuthService = ServiceLocator.authService;
export class AuthController {

    public async signIn(request: Request, response: Response) {
        ..
    }
..
}

I got an error:

 TypeError: Cannot read property 'dataRepository' of undefined

What am I do wrong?

Did you import the ServiceLocator in AuthController.ts?

Rannie Aguilar Peralta
– Rannie Aguilar Peralta

2019-05-01 04:58:03 +00:00
Commented May 1, 2019 at 4:58 — Rannie Aguilar Peralta
– Rannie Aguilar Peralta, Commented May 1, 2019 at 4:58

Sean Vieira · Accepted Answer · 2019-05-01 03:40:03Z

1

You have a circular reference here. In order to construct the AuthService module you need a fully constructed ServiceLocator class. However, JavaScript needs a fully constructed AuthService module in order to construct the ServiceLocator class. Switching the order of instantiation would simply result in an error from ServiceModule <cint> (to coin a Java-ism) along the lines of "Uncaught TypeError: undefined is not a constructor".

The solution is to simply make the dependency lazy:

//AuthService.ts
const dataRepositoryReference: IDataRepository = import('./ServiceLocator')
  .then(({ ServiceLocator }) => ServiceLocator.dataRepository);
export class AuthService implements IAuthService {
  public async findUserByUsername(username: UserName) {
    const dataRepository = await dataRepositoryReference;
    // ... snip ...
  }
}

answered May 1, 2019 at 3:40

Sean Vieira

161k34 gold badges321 silver badges297 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

kkost Over a year ago

Thanks, this solution works fine but then I need to create repository reference in each method. This will provide a lot of code duplication as far as I have a few such references. Do you have any ideas on how to avoid this?

kkost Over a year ago

This is how I trying to do that without method integration. But obviously, it looks not pretty good for me. What do you think? codeshare.io/5zk7r4

Sean Vieira Over a year ago

Using a side effect to set the binding asynchronously is a recipe for random null pointer exceptions (when findByUsername gets executed before .then({ xValue }) => xBinding = xValue)). You can make it a little better by keeping the promise around and using it as a latch (but that's almost as fragile without a lint rule).

Collectives™ on Stack Overflow

Typescript: undefined static variable issue

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related