Typescript - How to create an empty typed array|object |Interface|string with examples

Typescript - How to create an empty typed array|object |Interface|string with examples

In this brief tutorial, you will learn how to create an empty typed array in TypeScript, focusing on various methods to generate a string-typed empty array.

Firstly, let’s define an Employee Interface in the TypeScript file:

interface Employee {
  name: string;
  id: number;
  salary: number;
}

Creating an Empty Typed Array Interface or Class Example

As the Employee object contains different data types, we explore multiple approaches to create an empty typed array.

  • Using generics type declaration

    We can declare the array variable with a generic array of Employees by initializing it with an empty array:

    let employees: Array<Employee> = [];

    This effectively creates a variable storing an empty typed array.

  • Using type assertion

    Type assertion involves assigning an object of one type to a variable to prevent errors at compile time, without affecting runtime performance.

    This can be done using two syntaxes: as syntax and angle-bracket syntax.

    The following is an example for creating an empty typed array with as syntax.

    let empArray1 = [] as Employee[];

    The above syntax can also be written with angle-bracket syntax as follows.

    let empArray = <Employee[]>[];

    Both syntaxes are equally valid and performant.

  • Using Array constructor

    Array constructors provide a generic way to create an empty array using the new operator:

    let empArray = new Array<Employee>();
let empArray: Array<Employee> = new Array<Employee>();

    Although this method enhances readability, it may impact performance due to memory reference creation.

Creating an Empty Typed String Array with examples

Typed string arrays can be created using different syntaxes:

let emptyStringArray: string[] = [];
let emptyStringArray1 = new Array<string>();
let emptyStringArray2: Array<string> = new Array<string>();

Steps:

  • The first line is with inline empty array initialization
  • The second line is a Create using a new keyword
  • The third line is an Array with a new object

Creating and Initializing Typed Empty Objects in an Array

Let’s consider creating a non-empty array with empty or default object values.

We’ll use the User interface for illustration:

interface User {
  name: string;
  id: number;
  password: string;
}

An array can be initialized with empty user objects using the Partial utility in TypeScript, allowing optional fields:

Partial in typescript allows you to construct an object with optional fields Partial<User> return User with optional id, name, and password

users: Partial<User>[] = [{}, {}, {}];

Alternatively, you can manually set values for each object:

users1: User[] = [{ id: null, name: null, password: null }{ id: null, name: null, password: null }]

This provides flexibility in initializing arrays with default object values.

You can check another post on Fix for Object is possibly null

Conclusion

In summary, you’ve learned various methods to create typed empty arrays and initialize arrays with empty objects.

Stay tuned for more informative posts by subscribing!