Standardized static class function

Question

Standardized static class function

What is the correct method to reference a static property in extended classes using JavaScript?

Consider the following javascript code:

class Animal {}
Animal.makeNoise = (language) => this.sounds[language];

class Dog extends Animal {}
Dog.sounds = {
  english: 'woof-woof',
  portuguese: 'au-au'
}

I attempted the following approach:

abstract class Animal {
  static sounds: { [key in string]: false | string[] | string }
  static makeNoise
    = <S extends typeof Dog.sounds, L extends keyof S>(language: L): S[L]
      => this.sounds[language];
}
class Dog extends Animal {
  static sounds: {
    english: 'woof-woof',
    portuguese: 'au-au'
  }
}
Dog.makeNoise('english') // => "woof-woof"

However, I am struggling to find a way to access the this.sounds of each extended class. Is there a proper solution to achieve this?

typescript

Answer 1

Answer №1

To ensure that the static method can function across all subclasses, you can utilize the this parameter to capture the specific type of sound within each subclass. By doing so, you gain access to the precise sound type based on the extracted type information:

abstract class Animal {
    static sounds: Record<string, false | string[] | string>
    static makeSound<TSounds extends typeof Animal['sounds'], L extends keyof TSounds>(this: { sounds: TSounds }, language: L): TSounds[L] {
        return this.sounds[language];
    }
}
class Dog extends Animal {
    static sounds: {
        english: 'woof-woof',
        portuguese: 'au-au'
    }
}
Dog.makeNoise('english') // => "woof-woof"

Answer 2

To ensure that the static method can function across all subclasses, you can utilize the this parameter to capture the specific type of sound within each subclass. By doing so, you gain access to the precise sound type based on the extracted type information:

abstract class Animal {
    static sounds: Record<string, false | string[] | string>
    static makeSound<TSounds extends typeof Animal['sounds'], L extends keyof TSounds>(this: { sounds: TSounds }, language: L): TSounds[L] {
        return this.sounds[language];
    }
}
class Dog extends Animal {
    static sounds: {
        english: 'woof-woof',
        portuguese: 'au-au'
    }
}
Dog.makeNoise('english') // => "woof-woof"

Standardized static class function

Answer №1

Similar questions

Revamp the button's visual presentation when it is in an active state

What is the most effective way to handle DOM events in Angular 8?

Unusual Behavior of *ngIf and jQuery in Angular 5: A curious case

Can a React function component be typed with TypeScript without the need for arrow functions?

Accessing class fields from within an annotation in Typescript

Encountering the 'CreateVerificationTokenError' issue when trying to log in through EmailProvider using Prisma and Next-Auth

How can I properly include DefinitelyTyped TypeScript definition files in a .NET Core project?

What is the best way to allocate string types from an enum using Typescript?

Half the time, the Paypal button fails to load on Angular

Automate your builds with Github actions for both tags and branches!

Using Object.defineProperty in a constructor has no effect

Is it possible to verify type property names using a union type?

What is the best way to search for an Enum based on its value?

Issue TS2322 presents itself when attempting to assign a value of type 'string, number, or Date' to a variable of type 'Date' after upgrading to Angular 16

What is the best way to send an array of locationIds to the getLocationData service?

What is the best way to add a hyperlink to a cell in an Angular Grid column

Tips for utilizing parameters within SQL Server

Execute --runTestsByPath on two or more distinct paths

A combination of MVC6, tsd, and typings has proven to be

I need to compile a comprehensive inventory of all the publicly accessible attributes belonging to a Class/Interface