TypeScript Variable, Annotation and Inference

In this article, we will discuss variables in TypeScript, including variable declaration and initialization, type annotations, and type inference. We will provide examples to help you better understand how variables work in TypeScript.

¶Variable Declaration and Initialization

In TypeScript, variables can be declared using the let, const, or var keywords and is actually same as JavaScript. Mainly the code which works in JavaScript, would also works in TypeScript.

Here’s an example of declaring a variable using let:

let message: string;
message = "Hello TypeScript!";
console.log(message); // Hello TypeScript!

In this example, we declare a variable called message using the let keyword. We also specify the type of the variable as string. Then, we assign a value of “Hello TypeScript!” to the variable, and log the value to the console.

We can also declare and initialize a variable in a single statement, like this:

let greeting: string = "Hello World!";
console.log(greeting); // Hello World!

In this example, we declare a variable called greeting and assign a value of “Hello World!” to it in the same statement. The type of the variable is inferred from the assigned value.

¶Type Annotations

Type annotations are used to specify the type of a variable, function parameter, or function return type. They are useful for adding clarity to your code and catching type-related errors early.

Here’s an example of using type annotations to specify the type of a variable:

let age: number;
age = 30;
console.log(age);

In this example, we declare a variable called age and specify its type as number using a type annotation. Then, we assign a value of 30 to the variable, and log the value to the console.

Now, if we want to assign like without a number value, then it will give us the errors -

age = "10"; // ❌

Type annotations can also be used to specify the types of function parameters and return types. Here’s an example:

function multiply(a: number, b: number): number {
  return a * b;
}

let result = multiply(2, 3);
console.log(result);

In this example, we define a function called multiply that takes two parameters, both of type number. We also specify the return type of the function as number. Inside the function, we multiply the two parameters and return the result.

¶Type Inference

Type inference is a feature of TypeScript that allows the compiler to automatically determine the type of a variable based on its assigned value. This can help to reduce the amount of code you need to write, and make your code more concise and readable.

Here’s an example of using type inference to determine the type of a variable:

let username = "john.doe";
console.log(`Welcome, ${username}!`);

In this example, we declare a variable called username and assign a value of “john.doe” to it. We do not specify the type of the variable, so TypeScript infers that it is a string. We then log a welcome message to the console using string interpolation.

Type inference can also be used with function parameters and return types. Here’s an example:

function greet(name: string) {
  console.log(`Hello, ${name}!`);
}

greet("John");

In this example, we define a function called greet that takes a parameter of type string. We do not specify a return type for the function, so TypeScript infers that it returns void. Inside the function, we log a greeting message to the console using