Creating a TypeScript class with methods to export as an object

Question

Creating a TypeScript class with methods to export as an object

Just dipping my toes into Typescript and I've encountered a bit of a challenge. I have a generic class that looks like this:

export class Sample {
    a: number;
    b: number;
    doSomething(): any {
        // return something
    }
}

My issue arises when I try to create a default constant object. I'm getting stuck because I haven't defined the 'doSomething' method. Shouldn't 'defaultSample' automatically inherit the base functionality of 'doSomething', or am I overlooking something?

export const defaultSample: Sample {
    a: 1,
    b: 2
}

javascript typescript

Answer 1

Answer №1

Hey TypeScript enthusiasts, it's worth noting that TypeScript types are not retained when you run your code. However, you can achieve the desired functionality by structuring your classes in the following way:

export class Sample {
    a: number;
    b: number;
    doSomething(): any {
        // return something
    }
}
class defaultSample extends Sample {
 a = 1;
 b = 2;
}

const x = new defaultSample()

Alternatively, you can include a constructor in your Sample class like so:

class Sample {
    constructor(a, b) {
      this.a = a;
      this.b = b;
    }
    a;
    b;
    doSomething() {
        // return something
    }
}

export const defaultSample = new Sample(1, 2)

Answer 2

Hey TypeScript enthusiasts, it's worth noting that TypeScript types are not retained when you run your code. However, you can achieve the desired functionality by structuring your classes in the following way:

export class Sample {
    a: number;
    b: number;
    doSomething(): any {
        // return something
    }
}
class defaultSample extends Sample {
 a = 1;
 b = 2;
}

const x = new defaultSample()

Alternatively, you can include a constructor in your Sample class like so:

class Sample {
    constructor(a, b) {
      this.a = a;
      this.b = b;
    }
    a;
    b;
    doSomething() {
        // return something
    }
}

export const defaultSample = new Sample(1, 2)

Answer 3

Answer №2

Explaining the issue here, you are defining the type of defaultSample, which is causing the error message to appear.

There are a couple of ways to solve this problem. One option is to instantiate a new object of the Sample class and assign it to defaultSample.

export class Sample {
    a: number;
    b: number;
    doSomething(): any {
        // do something
    }
}

const defaultSample = new Sample();
defaultSample.a = 1;

Alternatively, you can include a constructor in the class to set the values of a and b.

The other option, if you prefer to use inheritance, is to create a new class that extends the Sample class.

export class Sample {
    a: number;
    b: number;
    doSomething(): any {
        // do something
    }
}

class DefaultSample extends Sample {
    a = 1;
    b = 2;
}

const myDefaultSample = new DefaultSample();

Answer 4

Explaining the issue here, you are defining the type of defaultSample, which is causing the error message to appear.

There are a couple of ways to solve this problem. One option is to instantiate a new object of the Sample class and assign it to defaultSample.

export class Sample {
    a: number;
    b: number;
    doSomething(): any {
        // do something
    }
}

const defaultSample = new Sample();
defaultSample.a = 1;

Alternatively, you can include a constructor in the class to set the values of a and b.

The other option, if you prefer to use inheritance, is to create a new class that extends the Sample class.

export class Sample {
    a: number;
    b: number;
    doSomething(): any {
        // do something
    }
}

class DefaultSample extends Sample {
    a = 1;
    b = 2;
}

const myDefaultSample = new DefaultSample();

Creating a TypeScript class with methods to export as an object

Answer №1

Answer №2

Similar questions

Issue with $sce.trustAsResourceUrl(url) function in angularJS

Jest is unable to handle ESM local imports during resolution

What are the implications of AngularJS's filter on performance?

Utilizing the "as" keyword for type assertion in a freshly created react application using create-react-app leads to the error message `Parsing error: Unexpected token, expected ";"`

Unable to assign the value of 'innerHTML' to a null property during an AJAX request

Is it the browser's responsibility to convert ES6 to ES5 internally?

Activate the search feature in select2 to allow multiple selections

Troubleshooting a custom pipe issue in Ionic v4 with Angular

Encountering a '[BABEL] Cannot find module' error message after setting up a new PC

Unable to reset input in a functional component using React JS

Guide to organizing an HTML table column with a header click using PHP and MySQL

Error: No schema found for the specified "User" model

Passing Node.js MySQL query results to the next function within an async.waterfall workflow

What are the benefits of using Bower.js when npm is already functioning well?

Refining Flask-Generated Table Content with jQuery Filters

Parameterized function call on click event

Is it possible to invoke this JavaScript function like this?

JavaScript: AWS Amplify: Retrieving the User ID (Sub ID) Following User Registration. Post Registration, Not to Be Confused with Sign In

Retrieve information using AngularJS only when it is not yet defined

What is the process for creating a selector that links to an element that has been dynamically generated?