Overview
TypeScript's type system is a powerful tool that allows developers to define and enforce types in their code, making it more robust, readable, and maintainable. Understanding and effectively using TypeScript's type system can significantly improve the quality of your projects by catching errors at compile time, facilitating code documentation, and enhancing developer productivity through better tooling support.
Key Concepts
- Basic Types: Understanding primitive types (string, number, boolean, etc.) and their uses.
- Advanced Types: Familiarity with unions, generics, intersections, and conditional types.
- Type Inference and Compatibility: How TypeScript infers types, and the principles of structural typing and type compatibility.
Common Interview Questions
Basic Level
- What are the basic types in TypeScript and how do you use them?
- How do you define and use interfaces in TypeScript?
Intermediate Level
- Explain the difference between an interface and a type alias in TypeScript.
Advanced Level
- How can generics be used to create reusable and type-safe functions or components in TypeScript?
Detailed Answers
1. What are the basic types in TypeScript and how do you use them?
Answer: TypeScript provides several basic types including number
, string
, boolean
, null
, undefined
, symbol
, and bigint
. These types are used to describe the kind of data that variables can hold. Using these types, developers can annotate variables, function parameters, and return types, which allows TypeScript to catch type-related errors during compilation.
Key Points:
- Basic types enforce the kind of data a variable can hold.
- They help catch errors during compilation.
- They make the code more readable and easier to maintain.
Example:
let id: number = 5;
let userName: string = "Alice";
let isAdmin: boolean = true;
function logMessage(message: string): void {
console.log(message);
}
2. How do you define and use interfaces in TypeScript?
Answer: Interfaces in TypeScript are used to define the shape of an object. They can include properties and method signatures. Interfaces are a powerful way to enforce a particular structure for objects, function parameters, and class implementations.
Key Points:
- Interfaces define a contract for the data shape.
- They can be extended and implemented by classes.
- Interfaces support optional properties and readonly properties.
Example:
interface User {
id: number;
name: string;
email?: string; // Optional property
}
function createUser(user: User): void {
console.log(`User created: ${user.name}`);
}
const newUser: User = { id: 1, name: "Bob" };
createUser(newUser);
3. Explain the difference between an interface and a type alias in TypeScript.
Answer: Both interfaces and type aliases define the shape of an object or a function signature. However, interfaces are more extensible and can be implemented by classes. Type aliases are more flexible and can be used to alias not just object shapes but also primitives, unions, and tuples.
Key Points:
- Interfaces are extendable and can be merged, but type aliases cannot.
- Type aliases can represent a wider range of types, including primitives and unions.
- Classes can implement interfaces but cannot implement type aliases.
Example:
interface Animal {
name: string;
}
interface Dog extends Animal {
bark(): void;
}
type Pet = Dog | { name: string; meow(): void; };
4. How can generics be used to create reusable and type-safe functions or components in TypeScript?
Answer: Generics in TypeScript allow you to create components or functions that can work over a variety of types rather than a single one. This adds flexibility while maintaining type safety. Generics are defined using angle brackets (<T>
) and allow you to capture the types passed in as parameters.
Key Points:
- Generics increase the reusability of code.
- They help maintain type safety without losing the flexibility of using any type.
- Generics can be used in functions, interfaces, and classes.
Example:
function getArray<T>(items: T[]): T[] {
return new Array<T>().concat(items);
}
let numberArray = getArray<number>([1, 2, 3]);
let stringArray = getArray<string>(["hello", "world"]);
This guide covers the basic to advanced understanding of TypeScript's type system, emphasizing practical examples and key concepts essential for technical interviews.