Is it possible to define a constant enum within a TypeScript class?

Question

Is it possible to define a constant enum within a TypeScript class?

I am looking for a way to statically set an enum on my TypeScript class and be able to reference it both internally and externally by exporting the class. As I am new to TypeScript, I am unsure of the correct syntax for this. Below is some pseudo-code (which extends a Backbone Model) that outlines what I am trying to achieve...

class UnitModel extends Backbone.Model {
    static enum UNIT_STATUS {
        NOT_STARTED,
        STARTED,
        COMPLETED
    }

    defaults(): UnitInterface {
        return {
            status: UNIT_STATUS.NOT_STARTED
        };
    }


    isComplete(){
        return this.get("status") === UNIT_STATUS.COMPLETED;
    }

    complete(){
        this.set("status", UNIT_STATUS.COMPLETED);
    }
}

export = UnitModel;

I want to access the enum inside this class as well as outside the class, such as shown below:

import UnitModel = require('path/to/UnitModel');
alert(UnitModel.UNIT_STATUS.NOT_START);//I expect to see 0 since enums start at 0

javascript class backbone.js enums typescript

Answer 1

Answer №1

To achieve this goal, it is important to declare the property outside of the class and then set it as a static attribute.

enum TASK_STATUS {
    NOT_INITIALIZED,
    IN_PROGRESS,
    DONE,
}

class TaskModel extends Backbone.Model {

    static TASK_STATUS = TASK_STATUS;

    isTaskComplete(){
        return this.get("status") === TASK_STATUS.DONE;
    }
}

export = TaskModel;

Answer 2

To achieve this goal, it is important to declare the property outside of the class and then set it as a static attribute.

enum TASK_STATUS {
    NOT_INITIALIZED,
    IN_PROGRESS,
    DONE,
}

class TaskModel extends Backbone.Model {

    static TASK_STATUS = TASK_STATUS;

    isTaskComplete(){
        return this.get("status") === TASK_STATUS.DONE;
    }
}

export = TaskModel;

Answer 3

Answer №2

If you're looking to declare a namespace along with your class, one way to do it is by placing the enum inside the namespace itself. Here's an example of how you can achieve this:

class ItemModel extends Backbone.Model {
    defaults(): ItemInterface {
        return {
            status: ITEM_STATUS.PENDING
        };
    }

    isApproved(){
        return this.get("status") === ITEM_STATUS.APPROVED;
    }

    approve(){
        this.set("status", ITEM_STATUS.APPROVED);
    }
}

namespace ItemModel {
    export enum ITEM_STATUS {
        PENDING,
        APPROVED,
        REJECTED
    }
}

export = ItemModel;

After that, you can simply access your enum using ItemModel.ITEM_STATUS.

Answer 4

If you're looking to declare a namespace along with your class, one way to do it is by placing the enum inside the namespace itself. Here's an example of how you can achieve this:

class ItemModel extends Backbone.Model {
    defaults(): ItemInterface {
        return {
            status: ITEM_STATUS.PENDING
        };
    }

    isApproved(){
        return this.get("status") === ITEM_STATUS.APPROVED;
    }

    approve(){
        this.set("status", ITEM_STATUS.APPROVED);
    }
}

namespace ItemModel {
    export enum ITEM_STATUS {
        PENDING,
        APPROVED,
        REJECTED
    }
}

export = ItemModel;

After that, you can simply access your enum using ItemModel.ITEM_STATUS.

Is it possible to define a constant enum within a TypeScript class?

Answer №1

Answer №2

Similar questions

The intersection observer fails to detect any new elements or entries that are appended to the page after it has

What is the best method for toggling a class to indicate the active tab in VueJS?

Routes inoperative as intended

Retrieve the additional navigation information using Angular's `getCurrentNavigation()

Experiencing challenges in integrating fundamental Javascript elements on a chat page

JavaScript Filtering Technique

Tips for avoiding recursive error function calls in Angular 5

My simple application is experiencing a problem where ComponentDidMount is not being invoked

Ion-List seamlessly integrates with both ion-tabs and ion-nav components, creating a cohesive and dynamic user interface

Istanbul provides me with a thorough analysis, yet it always seems to conclude with an error

Dynamically assigning anchor tags to call JavaScript functions

Storing user information in Angular after login and implementing JWT authentication

Ways to verify the presence of users in the Database

Content within a Row of a Data Table

analyzing strings by comparing their characters to another string

The width values in the array are constantly shifting upon refreshing

Transform string enum type into a union type comprising enum values

My attempts to utilize the local storage key have been unsuccessful in storing my todo list. I am uncertain where the issue lies within my code

Issue with Bootstrap carousel: image protrudes past boundaries of parent container

Show categories that consist solely of images