Designing a TypeScript class that incorporates an interface

Question

Designing a TypeScript class that incorporates an interface

Struggling to grasp the correct syntax, I am looking to incorporate an interface into my project.

The desired interface for implementation is as follows:

interface Test {
  [name : string] : (source : string) => void;
}

My understanding is that this interface essentially consists of a object with strings as keys and functions as values.

Any guidance on this matter would be greatly appreciated.

Edit : Encountering multiple errors such as "incorrect implementation of interface", "index signature is missing", etc,

For a demonstration, refer to this playground example: Link

I did not write the implementation code for this interface, it comes from a preexisting sdk

typescript

Answer 1

Answer №1

To include the index signature in the class, follow this code snippet:

interface Example {
    [key: string]: (data: string) => void;

}

class ExampleClass implements Example {
    [key: string]: (data: string) => void; // Make sure to add this
    getFirstName(data: string) {
        console.log("example"); 
    }
}

Answer 2

To include the index signature in the class, follow this code snippet:

interface Example {
    [key: string]: (data: string) => void;

}

class ExampleClass implements Example {
    [key: string]: (data: string) => void; // Make sure to add this
    getFirstName(data: string) {
        console.log("example"); 
    }
}

Answer 3

Answer №2

It is not possible for a class to adhere to this particular interface.

This interface is more suitable for defining the structure of a "typed object."

You can define an object type with string keys and values that are functions taking a string argument and returning nothing.

For example:

let myObj: Test = {
    test: (source: string) => { console.log('function returning void'); }
};

Answer 4

It is not possible for a class to adhere to this particular interface.

This interface is more suitable for defining the structure of a "typed object."

You can define an object type with string keys and values that are functions taking a string argument and returning nothing.

For example:

let myObj: Test = {
    test: (source: string) => { console.log('function returning void'); }
};

Designing a TypeScript class that incorporates an interface

Answer №1

Answer №2

Similar questions

Prevent updating components when modifying state variables

Unlocking the ability to retrieve data generated by the context within getServerSideProps beyond its boundaries (for transitioning from Create React App to Next.js)

Can TypeScript be used to generate a union type that includes all the literal values from an input string array?

Webpack may suggest, "An extra loader might be needed" within a React.js project

Retrieving the value of an object using a key in TypeScript

Ng2-NoUISlider displaying consistent range values

Troubleshooting Typescript Compilation Error in React - Cannot assign type 'Element' to type 'FunctionComponent<{}>'

Angular 6: Issues with API Get Method not executing when an integer value is passed with an empty string

Using useRef with Typescript/Formik - a practical guide

Add a feature to a functional component that is enclosed with React.forwardRef

What is the best way to apply a CSS class to a ComponentRef that has been generated in Angular 5

Data from graphql is not being received in Next.js

The type '{ domain: string; parent: string; }' cannot be assigned to type 'string'. Error code: ts(2322)

The source files are expected to be contained within the 'rootDir' directory, which is not located at 'c:/Users/hasit/Desktop/typescript/src'

Incorporating HTTP status codes into error handling

Guide on converting a JSON object into a TypeScript Object

"Ionic Calendar 2 - The ultimate tool for organizing your

The attribute 'map' is not found on the data type 'Observable<[{}, {}]>'

Experience the dynamic live preview feature of Sanity integrated with NextJS 13

The issue in Angular2 viewmodel where the boolean value fails to update the *ngIf template