Variables and type annotations

One of the key features of TypeScript is its ability to enforce type annotations. Type annotations allow developers to specify the type of a variable, function parameter, or function return value. This helps make the code clear, explicit, and easy to understand and maintain. TypeScript uses a structural type system, which means that types are based on their members. In this topic, you will learn about variables and type annotations in Typescript.

Variables and type annotations

In TypeScript, variables can be declared using the let , var or const keywords, similar to JavaScript. However, TypeScript provides an additional benefit of type annotations, where you can explicitly specify the variable type.

Type annotations in TypeScript are denoted using a colon (:) followed by the desired type. For example, to declare a variable of type number, you can write:

let age: number = 25;
let isDeleted: boolean = true;
const name: string = "John";

In this example, the variable age is explicitly declared as a number, the variable isDeleted is of the boolean type, and the variable name is declared as a string. TypeScript will enforce that only values of the specified types can be assigned to these variables. If you try to assign a value of a different type, TypeScript will throw a compilation error.

Here's an example that demonstrates type annotations with functions in TypeScript:

function addNumbers(a: number, b: number): number {
  return a + b;
};

const result: number = addNumbers(5, 10);
console.log(result); // Output: 15

In this example, we have a function called addNumbers that takes two parameters, a and b, both of which are annotated with the type number. The return type of the function is also annotated as number. This means that the function expects two numeric arguments and will return a numeric value. Within the function body, we simply add the two numbers together and return the result. After defining the function, we declare a variable called result and explicitly annotate it as a number.

Also, this is how you would write the above function as an arrow function:

let addNumbers = (a: number, b: number): number => {
  return a + b;
};

Here's another one that shows type annotations with objects:

let person : { 
    age: number; 
    name: string; 
}; 

person = { 
  age: 25, 
  name : "John"
}

Here, we declare an object person with two properties age and name and the data types number and string respectively. If you try to assign a numeric value to a name property, TypeScript will raise a compilation error.

Built-in types

TypeScript provides several built-in types that can be used for type annotations, including:

• number: represents numeric values, such as integers and floating-point numbers.
• string: represents textual data enclosed in single or double quotes.
• boolean: represents a logical value, either true or false.
• object: represents any JavaScript object type.
• array: represents an array of values of a specific type.
• any: represents a dynamic type that can hold values of any type.
• void: represents the absence of a value.

In addition to the built-in types, TypeScript allows you to define custom types using interfaces, classes, and type aliases, which you will learn about in later topics. This enables you to create complex data structures and define the shape and behavior of your own types.

Type inference

Type annotations are optional in TypeScript, as the language also provides type inference. Type inference allows TypeScript to automatically infer the type of a variable based on its initial value. For example:

let age = 25; // TypeScript infers the type as number
let isDeleted = true; // TypeScript infers the type as boolean
const name = "John"; // TypeScript infers the type as string

However, it is generally considered good practice to include type annotations, as they make the code more self-documenting and help catch potential errors early on. Type annotations provide clarity and explicitness to the code, making it easier to understand and maintain, especially in larger codebases.

Conclusion

By using variables and type annotations, TypeScript enables developers to write safer and more reliable code by providing compile-time checks for type correctness. This helps prevent runtime errors and improves the overall quality of JavaScript applications.