0

I have a UserRoles type in typscript

type = 'student' | 'editor' | 'moderator' | 'admin'
or
type UserRoles = 'student' | 'editor' | 'moderator' | 'admin'

how can I create an array based on these types? something like

const roles = Array.from(UserRoles)

Thanks in advance :)

Yung Silva
  • 1,324
  • 4
  • 20
  • 40

2 Answers2

3

UserRoles only refers to a type, you can not use it as a value. But you can explictly create a readonly array for the roles and extract the type from it. For example,

const roles = ['student', 'editor', 'moderator', 'admin'] as const;

// type will be  'student' | 'editor' | 'moderator' | 'admin'
type UserRoles = typeof roles[number]

let uRole: UserRoles;
// valid
uRole = 'student';

// compile-time error
uRole = 'hello'

typescript playground

subashMahapatra
  • 6,339
  • 1
  • 20
  • 26
  • after setting user Roles to type enum, I can't use it as I used before .. [https://image.prntscr.com/image/dS2lBofuSWG0PfW9w4YS6A.png](https://image.prntscr.com/image/dS2lBofuSWG0PfW9w4YS6A.png) – Yung Silva Jun 28 '20 at 17:27
  • `enums` and union types are two different things. If you want to modify your code base you can fix the error by assigning the role value like this `role: Roles.student`. If you don't want to modify your code base use the solution that i have provided, it will not break any existing code. – subashMahapatra Jun 28 '20 at 17:43
  • Here is another example [ts playground](https://www.typescriptlang.org/play?#code/FAUwdgrgtgBASgewDYgM4wN7BjmqAuEAJuPjALwwDkBxpVANNrqskQJYgBOF1rSHbo2Y4QHfAh6UqY9hK7DcMKAhJcAhvN5UVazZMW51RKOzDbjpsFWABfYMBRkuyEAC54r1AG5gAej8YADd1JHYiYBcUXkQUVAA6WhIwfH9AgGN1czAEMnVUVHYAc3N8AAsQPHwuMyLg0IhKmkJk-CoYCRgokEjXD1i0bST6XzSYAFpJqemZ2bn5mYcAmAARBDQqFJgAIy4QdQBrGBAAD3YCWph01R7rsAIur14AbWa6FMY+Nk4FBmpZeSfHQ3DSAv5USxmKgAXVG+AAngAHSoAVVQ3AG6EoCORCAAZo84s9IFBttxoQ47g8IOiuAMPGiMU9pMMPkA) – subashMahapatra Jun 28 '20 at 17:43
0

One good practice in your case is using Enums. Besides numbers, you can also have string enums (which is what you need).

enum UserRoles {
    Student = 'student',
    Editor = 'editor',
    Moderator = 'moderator',
    Admin = 'admin'
}

If you do it this way, you can consider the Enum an object and get an array of its values with

const values = Object.values(UserRoles);
Cristian Sarghe
  • 782
  • 6
  • 15
  • after setting user Roles to type enum, I can't use it as I used before .. [https://image.prntscr.com/image/dS2lBofuSWG0PfW9w4YS6A.png](https://image.prntscr.com/image/dS2lBofuSWG0PfW9w4YS6A.png) – Yung Silva Jun 28 '20 at 17:27
  • @YungSilva This is something requested, but I doubt it has been implemented (https://github.com/microsoft/TypeScript/issues/17690). The common usage of enums is assigning Type.Value to the variable instead of a string literal. In your case, given the screenshots, you could do `{ ... ; role: Roles.student; ... }`. Notice that you need to `export` the enum if you want to use it in a different file. – Cristian Sarghe Jun 28 '20 at 17:37