Access to static properties via this.constructor in typescript

Question

I want to write es6 class:

class SomeClass {
    static prop = 123

    method() {
    }
}

How to get access to static prop from <

Answer 1

Microsoft programmer talking this but there is not a good way to type constructor. You can use this tip first.

class SomeClass {
    /**
     * @see https://github.com/Microsoft/TypeScript/issues/3841#issuecomment-337560146
     */
    ['constructor']: typeof SomeClass

    static prop = 123

    method() {
        this.constructor.prop // number
    }
}

Answer 2

but in typescript this.constructor.prop causes error "TS2339: Property 'prop' does not exist on type 'Function'".

Typescript does not infer the type of constructor to be anything beyond Function (after all ... the constructor might be a sub class).

So use an assertion:

class SomeClass {
    static prop = 123;
    method() {
        (this.constructor as typeof SomeClass).prop;
    }
}

More on assertions

Answer 3

Accessing static properties through this.constructor (as opposed to just doing SomeClass.prop like normally you would) is only ever useful when you don't know the name of the class and have to use this instead. typeof this doesn't work, so here's my workaround:

class SomeClass {

  static prop = 123;

  method() {

    const that = this;

    type Type = {
      constructor: Type;
      prop: number; //only need to define the static props you're going to need
    } & typeof that;

    (this as Type).constructor.prop;
  }

}

Or, when using it outside the class:

class SomeClass {
  static prop = 123;
  method() {
    console.log(
      getPropFromAnyClass(this)
    );
  }
}

function getPropFromAnyClass<T>(target: T) {
  type Type = {
    constructor: Type;
    prop: number; //only need to define the static props you're going to need
  } & T;

  return (target as Type).constructor.prop;
}

Answer 4

Usually the simple way is:

class SomeClass {
    static prop = 123

    method() {
        console.log(SomeClass.prop)  //> 123
    }
}

Note that if you use this, subclasses of SomeClass will access the SomeClass.prop directly rather than SomeSubClass.prop. Use basarat's method if you want subclasses to access their own static properties of the same name.

Answer 5

It's a bit dirty, but this code works for me in the Typescript Playground:

class SomeClass {
    static prop = 123;

    constructor() {
        console.log(this.constructor["prop"]);
    }

}

var a = new SomeClass();

Answer 6

I guess that you want in the future extends this class. So it is better to do this:

class SomeClass<T extends typeof SomeClass = typeof SomeClass> {
    static prop = 123

    method() {
        (this.constructor as T).prop;
    }
}