Declare an Empty Array for a typed Variable in TypeScript

# Declare an Empty Array for a typed Variable in TypeScript

To declare an empty array for a typed variable, set the array's type to Type[].

Any elements you add to the array need to conform to the specified type, otherwise, an error is raised.

Copied!
type Animal = {
  name: string;
  age: number;
};

const arr: Animal[] = [];

const a1: Animal = { name: 'Alfred', age: 2 };

arr.push(a1);

// 👇️ [{name: 'Alfred', age: 2}]
console.log(arr);

We declared an arr variable and set it to an empty array of objects of type Animal[].

The same approach can be used to declare an empty array of primitives.

Copied!
const arr: string[] = [];
console.log(arr);

arr.push('bobby', 'hadz', 'com');

// 👇️ ['bobby', 'hadz', 'com']
console.log(arr);

The arr variable can only store values of type string.

We can only add elements of the specified type to the array, otherwise, an error is raised.

Copied!
type Animal = {
  name: string;
  age: number;
};

const arr: Animal[] = [];

// ⛔️ Error: Argument of type {test: string} is not
// assignable to parameter of type 'Animal'
arr.push({ test: 'hello' });

The object we tried to push into the array doesn't conform to the Animal type, so TypeScript errors out.

TypeScript also warns you if you forget to add a property that is required on the type.

Copied!
type Animal = {
  name: string;
  age: number;
};

const arr: Animal[] = [];

// ⛔️ Error: Property of type 'age' is missing
// but required in type Animal
arr.push({ name: 'Alfred' });

You can use the any type if you don't want to explicitly type the array.

Copied!
const arr: any[] = [];

arr.push('bobby');
arr.push(30);
arr.push({ country: 'Chile' });

// 👇️ [ 'bobby', 30, { country: 'Chile' } ]
console.log(arr);

The any type effectively turns off type checking and should be used sparingly.

If you need to filter an array of objects in TypeScript, check out the following article.

# Declare an Empty Array for a typed Variable using a type assertion

Alternatively, you can use a type assertion to declare an empty typed array.

Copied!
type Animal = {
  name: string;
  age: number;
};

const arr = [] as Animal[];

const a1: Animal = { name: 'Alfred', age: 2 };

arr.push(a1);

// 👇️ [{name: 'Alfred', age: 2}]
console.log(arr);

When using type assertions, we effectively tell TypeScript that we know better and the arr variable is definitely of type Animal[].

When using a type assertion, we would also get an error when we try to push a value that doesn't conform to the type into the array.

Copied!
type Animal = {
  name: string;
  age: number;
};

const arr = [] as Animal[];

// ⛔️ Error: Property of type 'age' is missing
// but required in type Animal
arr.push({ name: 'Alfred' });

// ⛔️ Error: Argument of type {test: string}
// is not assignable to parameter of type Animal
arr.push({ test: 'hello' });

The first call to the push() method causes an error because the age property is missing on the object.

The second call causes an error because the supplied object is not of type Animal.

Which approach you pick is a matter of personal preference. In this situation I'd go with the first approach as there is no real need for a type assertion.

I've also written an article on how to get the type of the array elements from an array type.

# Additional Resources

You can learn more about the related topics by checking out the following tutorials:

• Remove Element(s) from an Array in TypeScript
• How to add Elements to an Array in TypeScript
• Check if an Array contains a Value in TypeScript
• Check if a Value is an Array (of type) in TypeScript
• How to declare an Array of Objects in TypeScript
• How to declare a Two-dimensional Array in TypeScript
• Declare Array of Numbers, Strings or Booleans in TypeScript
• Property is missing in type 'X' but required in type 'Y'
• Remove Null and Undefined from a Type in TypeScript