Typescript 5.0 is here
Tags: typescript
Published: 2023-01-27 22:20:46

Typescript 5.0 is now in beta and comes with some cool new things.

**Enums got slightly better**
Let's check a sample code

```typescript
enum Rol {
  USER,
  GUEST,
  ADMIN
}

function changeUserRol(rol:Rol) {

}

changeUserRol(4)
```
This code would be no problem to Typescript 4.9, however, we crearly see that it's wrong since there is no 4 position on the enum, thankfully Typescript 5 can now detect this and mark it with an error


![Example image of Typescript detecting a incorrect enum value](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/c576y8t62p0e742aza95.png)


Let's be honest, enums aren't amazing yet, but this could be the first step

**const Generics**
Let's look at this sample code

```typescript
function settings<T>(settings: T[]) {
  function setSetting(setting: T, value: string) {}
  return {
    setSetting,
  };
}

```

Nothing too fancy here, just a function that takes a generic, use an array of that generic to type a parameter called settings, and return a function that expect that generic type on it's setting param.
Let's call the function now and pass an array of settings

```typescript
const currentSettings = settings([
  "font-size",
  "font-family",
  "background-color",
]);

```
now I have access to the function that gives me the chance to upload a specific setting

```typescript
currentSettings.setSetting("random-setting", "othervalue");
```
There's something wrong here, we all see that "random-setting" is not part of the settings array that I used before. However Typescript does not detect it as an error, since using the type infer concluded that "setting" is type string, so any string should be valid


![Example image of Typescript using infer without const](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7nghoallk5rh7uoawncr.png)

Thanks to Typescript 5.0 we now have a way to tell Typescript to use the literal values, we just need to add "const" before the generic, our code would look like this


```typescript
function settings<const T>(settings: T[]) {
  function setSetting(setting: T, value: string) {}
  return {
    setSetting,
  };
}

const currentSettings = settings([
  "font-size",
  "font-family",
  "background-color",
]);


currentSettings.setSetting("random-setting", "othervalue");
```
Now Typescript understand that what we are doing is wrong


![Example image of Typescript using infer with const](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qhju1kv1q69himhx6ufv.png)

Thank you Typescript!

**Decorators**

Decorators were available in Typescript with an experimental flag, but will now be officially part of it.

Decorators are a way to add extra functionality to your classes without having to change the original source code

Let's look at this code:

```typescript
class User {
  createPost() {
    console.log("Created post");
  }
  createComment() {
    console.log("Created comment");
  }
}

```
I have a class called User with methods to create posts and comments, if I want both of them to check if the user is authenticated I would need to repeat the logic in both methods, decorators would make this a lot better, let's create one

```typescript

function isAuth(
  originalMethod: (...args: any[]) => any,
  _context: ClassMemberDecoratorContext
) {
  return function newMethod() {
    if (!auth) {
      return console.log("You need auth");
    }
    originalMethod();
  };
}

```

a decorator is just a function that receive the originalMethod and the context as arguments, and return the modified method with the added logic, in this case we will only let the original method run if auth is true.

Let's add the decorator to the methods now:

```typescript
class User {
  @isAuth
  createPost() {
    console.log("Created post");
  }
  @isAuth
  createComment() {
    console.log("Created comment");
  }
}

```

And that easy we have protected methods!

Typescript is every day better and devs every day happier with it, what a pleasure to be a dev on 2023