Categories
TypeScript Answers

How to implement a TypeScript decorator?

Sometimes, we want to implement a TypeScript decorator.

In this article, we’ll look at how to implement a TypeScript decorator.

How to implement a TypeScript decorator?

To implement a TypeScript decorator, we should create a function that modifies an existing function and returns it.

For instance, we write

const Entity = (discriminator: string) => {
  return function (target) {
    // ...
  };
};

@Entity("cust")
export class MyCustomer {
  //...
}

to create the Entity function that returns a function.

Then we use the Entity decorator with the discriminator parameter set with the argument.

It returns a modified version of the MyCustomer class which is the function that’s being returned in Entity.

Conclusion

To implement a TypeScript decorator, we should create a function that modifies an existing function and returns it.

Categories
TypeScript Answers

How to extract the type of TypeScript interface property?

Sometimes, we want to extract the type of TypeScript interface property.

In this article, we’ll look at how to extract the type of TypeScript interface property.

How to extract the type of TypeScript interface property?

To extract the type of TypeScript interface property, we can use indexed access types.

For instance, we write

interface I1 {
  x: any;
}

interface I2 {
  y: {
    a: I1;
    b: I1;
    c: I1;
  };
  z: any;
}

let x: I2["y"];

to get the type of I2 interface’s y property with I2["y"].

And then we assign the returned type as the type of x.

Conclusion

To extract the type of TypeScript interface property, we can use indexed access types.

Categories
TypeScript Answers

How to add TypeScript types in object destructuring?

Sometimes, we want to add TypeScript types in object destructuring.

In this article, we’ll look at how to add TypeScript types in object destructuring.

How to add TypeScript types in object destructuring?

To add TypeScript types in object destructuring, we can add the type after the colon.

For instance, we write

interface User {
  name: string;
  age: number;
}

const obj: any = { name: "jane", age: 25 };
const { name, age }: User = obj;

to create the User interface.

And then we set it as the type of obj on the last line by putting User after the colon.

Then name and age will be assign the type of string and number respectively because of the type assignment.

Conclusion

To add TypeScript types in object destructuring, we can add the type after the colon.

Categories
TypeScript Answers

How to update TypeScript to latest version with npm?

Sometimes, we want to update TypeScript to latest version with npm.

In this article, we’ll look at how to update TypeScript to latest version with npm.

How to update TypeScript to latest version with npm?

To update TypeScript to latest version with npm, we install the typescript package with the latest version.

To do this, we run

npm install -g typescript@latest

We can also run

npm update

to update all packages including typescript.

Conclusion

To update TypeScript to latest version with npm, we install the typescript package with the latest version.

Categories
TypeScript Answers

How to perform string interpolation in TypeScript?

Sometimes, we want to perform string interpolation in TypeScript.

In this article, we’ll look at how to perform string interpolation in TypeScript.

How to perform string interpolation in TypeScript?

To perform string interpolation in TypeScript, we can create template literals like in JavaScript.

For instance, we write

const value = 100;
console.log(`The size is ${value}`);

to create the template literal with

`The size is ${value}`

We interpolate the value of the value variable in the string.

So we see 'The size is 100' logged.

Conclusion

To perform string interpolation in TypeScript, we can create template literals like in JavaScript.