TypeScript Simple Types

Welcome to The Coding College! At The Coding College, we aim to provide clear and actionable programming tutorials that empower developers. In this guide, we’ll explore TypeScript’s Simple Types, the foundation of its powerful type system.

What Are Simple Types in TypeScript?

Simple types in TypeScript are the basic data types used to define variables, parameters, and return values. They form the backbone of TypeScript’s static typing system, helping you write cleaner, more reliable code by catching errors during development.

Benefits of Using Simple Types

  1. Error Prevention
    By defining variable types, TypeScript helps catch type-related errors at compile time instead of runtime.
  2. Improved Code Readability
    Explicit types make your code more understandable, especially for teams or large projects.
  3. Better Tooling and Autocompletion
    IDEs like Visual Studio Code leverage TypeScript types to provide intelligent suggestions and error detection.

List of Simple Types in TypeScript

1. String

Represents textual data.

let username: string = "The Coding College";
console.log(username); // Output: The Coding College

2. Number

Represents numeric values, including integers and floating-point numbers.

let age: number = 25;
let price: number = 99.99;
console.log(age, price); // Output: 25 99.99

3. Boolean

Represents true or false values.

let isLearningFun: boolean = true;
console.log(isLearningFun); // Output: true

4. Null and Undefined

Represents values that are explicitly set to null or undefined variables.

let nothing: null = null;
let notAssigned: undefined = undefined;
console.log(nothing, notAssigned); // Output: null undefined

5. Any

Allows variables to hold values of any type. Use sparingly as it bypasses TypeScript’s strict type checking.

let randomValue: any = "Hello";
randomValue = 42; // No error
console.log(randomValue); // Output: 42

6. Void

Used for functions that don’t return a value.

function logMessage(message: string): void {
    console.log(message);
}
logMessage("Welcome to The Coding College!"); // Output: Welcome to The Coding College!

7. Never

Represents values that never occur, typically for functions that throw errors or have infinite loops.

function throwError(errorMessage: string): never {
    throw new Error(errorMessage);
}

TypeScript Syntax for Simple Types

Declaring Variables with Types

TypeScript allows you to declare variables with explicit types:

let variableName: type = value;

Examples:

let name: string = "TypeScript";
let age: number = 30;
let isLearning: boolean = true;

Type Inference

If you don’t specify a type, TypeScript will infer it based on the assigned value:

let inferredString = "Hello!"; // Inferred as 'string'
let inferredNumber = 42;      // Inferred as 'number'

Using Simple Types in Functions

Example 1: Function Parameters and Return Types

Define the types of function parameters and return values:

function greet(name: string): string {
    return `Hello, ${name}!`;
}
console.log(greet("The Coding College")); // Output: Hello, The Coding College!

Example 2: Typing Multiple Parameters

function add(a: number, b: number): number {
    return a + b;
}
console.log(add(5, 7)); // Output: 12

Common Errors with Simple Types

1. Type Mismatch

Assigning a value of the wrong type to a variable:

let age: number = "25"; // Error: Type 'string' is not assignable to type 'number'

2. Undefined Variables

Accessing a variable before it’s defined:

console.log(name); // Error: Cannot find name 'name'.

Real-World Applications of Simple Types

  • User Data Management
    Define user information with precise types to avoid data errors: 
interface User {
    name: string;
    age: number;
    isActive: boolean;
}
let user: User = { name: "John", age: 25, isActive: true };
  • API Responses
    Ensure your application handles API responses with correct data types: 
let apiResponse: string = "Success";

Conclusion

Mastering simple types in TypeScript is the first step toward writing reliable and maintainable code. By leveraging these basic types, you can reduce bugs, improve readability, and make the most of TypeScript’s powerful tooling.

For more programming tips, tutorials, and resources, visit The Coding College. Stay tuned for more advanced topics as we continue our journey into TypeScript!

Leave a Comment