Category: TypeScript

Sometimes, we want to dynamically assign properties to an object in TypeScript.

In this article, we’ll look at how to dynamically assign properties to an object in TypeScript.

How to dynamically assign properties to an object in TypeScript?

To dynamically assign properties to an object in TypeScript, we can define an interface that lets us accept any properties.

For instance, we write

interface MyType {
  typesafeProp1? : number,
  requiredProp1: string,
  [key: string]: any
}

let obj: MyType;
obj = {
  requiredProp1: "foo"
};
obj = {} 
obj.typesafeProp1 = "bar" 

obj.prop = "value";
obj.prop2 = 88;

to define the MyType interface.

The interface stipulates that that the MyType object can have the typesafeProp1 property and it’s a string.

It’s also requires the requiredProp1 property.

Also, we can add properties with keys other than the typesafeProp1 and requiredProp1 with [key: string]: any.

Therefore, obj = {} will give us a compile time error.

And obj.typesafeProp1 = "bar" will also give us an error since 'bar' isn’t a number.

Conclusion

To dynamically assign properties to an object in TypeScript, we can define an interface that lets us accept any properties.

Sometimes, we want to remove an array item in TypeScript.

In this article, we’ll look at how to remove an array item in TypeScript.

How to remove an array item in TypeScript?

To remove an array item in TypeScript, we can use the array splice method as we do with JavaScript.

For instance, we write:

myArray.splice(index, 1);

to remove the myArray entry at index with splice.

Conclusion

To remove an array item in TypeScript, we can use the array splice method as we do with JavaScript.

Sometimes, we want to add strongly-typed functions as parameters possible in TypeScript.

In this article, we’ll look at how to add strongly-typed functions as parameters possible in TypeScript.

How to add strongly-typed functions as parameters possible in TypeScript?

To add strongly-typed functions as parameters possible in TypeScript, we write define a type to be a function with the type for each parameter and the return type of the function.

For instance, we write

type FunctionName = (n: inputType) => any;

class ClassName {
  save(callback: FunctionName): void {
    callback(data);
  }
}

to create the FunctonName type which is set to type with signature n of type inputType and returns any type data.

And then we set the save method in ClassName to FunctionName to use it.

Conclusion

To add strongly-typed functions as parameters possible in TypeScript, we write define a type to be a function with the type for each parameter and the return type of the function.

Sometimes, we want to use get and set in TypeScript.

In this article, we’ll look at how to use get and set in TypeScript.

How to use get and set in TypeScript?

To use get and set in TypeScript, we can put it in a class.

For instance, we write:

class Foo {
  private _bar: boolean = false;
  get bar(): boolean {
    return this._bar;
  }
  set bar(value: boolean) {
    this._bar = value;
  }
}

to add a bar instance variable with get and set.

In get bar, we return the value of this._bar.

And we add set bar to set the value of this._bar to `value.

get is used for creating getter instance variables.

And set is used creatring setter instance variables.

We can then set bar with

const myFoo = new foo();
myFoo.bar = false;

and get bar with myFoo.bar.

Conclusion

To use get and set in TypeScript, we can put it in a class.

Sometimes, we want to convert a string to number in TypeScript.

In this article, we’ll look at how to convert a string to number in TypeScript.

How to convert a string to number in TypeScript?

To convert a string to number in TypeScript, we can use the + operator, parseInt or parseFloat functions.

For instance, we write:

const x = "32";
const y: number = +x;

to convert x to a floating point number with +

Or we write

const x = "32";
const y: number = parseInt(x);

to convert x to an integer with parseInt

const x = "32";
const y: number = parseFloat(x);

to convert x to a floating point number with parseFloat

Conclusion

To convert a string to number in TypeScript, we can use the + operator, parseInt or parseFloat functions.