8

I have decorated a method with a typescript decorator adding a member to the method:

export class MyClass {
    @AddMyMember()
    public myMethod(param1:string) {
        // ...
    }
}

So that I should be able to use it this way:

const myClassInstance = new MyClass();
myClassInstance.myMethod.myMember(); // error of course here, as myMember has not been declared yet...

But I cannot find a way to declare myMember efficiently:

export declare interface MyClass {
// Something great here maybe?....
}
2

1 Answer 1

7
+25

The merging problem

There is no way to declare a member of a class with a different type, declaration merging can only add members not change the types of existing members.

Something we can do is use an intersection type. If two members of an intersection type have the same name and different types the member on the intersection will be an intersection of the two original types.

class _MyClass {
    public constructor (t: string) {

    }
    public myMethod(param1:string) {
    }

    static staticF(){}
}

type ReplaceInstanceType<T extends new(...a: any[])=> any, TNew> = {
    new (... a: (T extends new (...p: infer P) => unknown ? P: [])) : TNew
} & Pick<T, keyof T>

export type MyClass = _MyClass & {
    myMethod: {
        myMember(): void
    }
}


export const MyClass: ReplaceInstanceType<typeof _MyClass, MyClass> = _MyClass as any;

let a = new MyClass("") // can new up
a.myMethod("") // can call myMethod
a.myMethod.myMember(); // can call  myMember
MyClass.staticF

The decorator problem

The second part of your problem is that a decorator can't mutate the type of the member it is applied to (this is by design). You could use a HOC to create the class instead, and pass in a list of member names (compile checked using keyof) to have the extra members added :

type ReplaceInstanceType<T extends new(...a: any[])=> any, TNew> = {
    new (... a: (T extends new (...p: infer P) => unknown ? P: [])) : TNew
} & Pick<T, keyof T>

function addMemebers<T extends new(...a: any[])=> any, K extends keyof InstanceType<T>>(members: K[], cls: T) : ReplaceInstanceType<T, InstanceType<T> & Record<K, {myMember(): void}>>{
    return null as any; // replace with implementation
}
export const MyClass = addMemebers(["myMethod"], class {
    public constructor (t: string) {

    }
    public myMethod(param1:string) {
    }

    static staticF(){}
})


let a = new MyClass("") // can new up
a.myMethod("") // can call myMethod
a.myMethod.myMember(); // can call  myMember
MyClass.staticF
2
  • Your answer is awesome and cristal clear, thanks. About the decorator, I already had implemented it, I just needed the type declaration. There is a trick to modify a member on which a decorator is applied: Your decorator could return { configurable: true, get(this:MyClass) { ... } } where MyClass assertion is the host (could use generic types also). As soon as you got the host instance, you can then change everything you want on you member from your decorator :-) Nov 17, 2018 at 21:39
  • @CharlesHETIER I might not have been very clear in the answer, you can modify the runtime JS class, you can't change the static Typescript type. Nov 17, 2018 at 21:59

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.