50 TypeScript Interview Questions and Answers for Experienced

9. How can you enforce strict null checks in TypeScript?

Answer: TypeScript provides a compiler flag called "strictNullChecks" that enforces strict null checks. When enabled, variables cannot have a value of "null" or "undefined" unless explicitly specified in their type. To enable strict null checks, modify the "tsconfig.json" file as follows:

{
    "compilerOptions": {
      "strictNullChecks": true
    }
  }

10. How do you extend a class in TypeScript?

Answer: In TypeScript, you can extend a class using the "extends" keyword. The derived class (subclass) inherits properties and methods from the base class (superclass). For example:

class Animal {
    makeSound() {
      console.log("Some generic sound");
    }
  }
class Dog extends Animal {
makeSound() {
console.log("Woof Woof!");
}
}

11. What are decorators in TypeScript?

Answer: Decorators are a feature of TypeScript that allows adding metadata and behavior to classes, methods, or properties at design time. They are denoted by the "@decorator" syntax and are executed when a class or method is defined. Decorators are commonly used for aspects such as logging, validation, authorization, and dependency injection. Decorators enable the creation of reusable cross-cutting concerns that can be applied to multiple parts of the codebase.

12. How can you create an abstract class in TypeScript?

Answer: In TypeScript, you can create an abstract class using the "abstract" keyword. An abstract class serves as a base class for other classes but cannot be instantiated directly. It may contain abstract methods that must be implemented in derived classes. For example:

  abstract class Shape {
    abstract area(): number;
  }
class Circle extends Shape {
radius: number;constructor(radius: number) {
  super();
  this.radius = radius;
}

area(): number {
  return Math.PI * this.radius * this.radius;
}

13. Explain the concept of "Type Assertion" in TypeScript.

Answer: Type assertion in TypeScript allows developers to explicitly tell the compiler about the type of a value, overriding its inferred type. It is useful when the developer knows more about the type of a value than what TypeScript's type inference can determine. Type assertions are done using either the "as" syntax or the "<>angle bracket" syntax. For example:

let value: unknown = "hello";
let length: number = (value as string).length;

14. How do you handle Asynchronous Operations in TypeScript?

Answer: TypeScript supports handling asynchronous operations using Promises, async/await, or Observables (from RxJS). Promises are used to represent a value that may not be available immediately, and async/await syntax provides a more concise way to work with Promises. For example:

async function fetchData(): Promise {
  const response = await fetch('https://api.example.com/data');
  const data = await response.json();
  return data;
}

15. What are "Type Guards" in TypeScript?

Answer: Type guards are a mechanism in TypeScript to narrow down the type of a variable within a conditional block. They are used to perform runtime type checks and enable TypeScript to infer a more specific type based on certain conditions. Type guards are commonly used with "typeof," "instanceof," and custom user-defined type predicates. For example:

function printMessage(message: string | number) {
  if (typeof message === 'string') {
    console.log('Message: ' + message);
  } else {
    console.log('Value: ' + message);
  }
}

16. How do you use Modules in TypeScript?

Answer: TypeScript supports modules to organize code into reusable and separate units. You can use the "export" keyword to expose functions, classes, or variables from a module, and the "import" keyword to use them in other modules. Modules can be either "CommonJS" or "ES6" style, depending on the target environment (Node.js or browsers). For example:

// math.ts module
export function add(a: number, b: number): number {
  return a + b;
}
// main.ts module
import { add } from './math';

console.log(add(2, 3)); // Output: 5

17. What is the use of the "readonly" modifier in TypeScript?

Answer: The "readonly" modifier in TypeScript is used to create read-only properties in a class or interface. Once a property is marked as "readonly," its value cannot be changed after the initial assignment. This provides a way to ensure that certain properties remain constant and are not accidentally modified elsewhere in the code. For example:

class Point {
  readonly x: number;
  readonly y: number;
constructor(x: number, y: number) {
this.x = x;
this.y = y;
}
}

18. How do you use Enums in TypeScript?

Answer: Enums in TypeScript are used to define a set of named constants with associated numeric values. They provide a way to define a meaningful name for a group of related constants, making the code more readable. For example:

enum Color {
  Red = 1,
  Green = 2,
  Blue = 3,
}
let color: Color = Color.Green;

19. How can you use Intersection Types in TypeScript?

Answer: Intersection types in TypeScript allow combining multiple types into a single type that has all the features of each type. Intersection types are denoted by the "&" operator. For example:

interface User {
  name: string;
}
interface Admin {
role: string;
}

type AdminUser = User & Admin;

let user: AdminUser = {
name: 'John',
role: 'Admin',
};

20. How can you use Union Types in TypeScript?

Answer: Union types in TypeScript allow a variable to have more than one type. Union types are denoted by the "|" operator. For example:

function printId(id: number | string) {
  console.log('ID: ' + id);
}
printId(123); // Output: ID: 123
printId('abc'); // Output: ID: abc

21. How do you handle Errors in TypeScript?

Answer: In TypeScript, you can handle errors using try-catch blocks similar to JavaScript. When an error occurs in the try block, it is caught in the catch block, allowing you to handle the error gracefully. For example:

function divide(a: number, b: number): number {
  try {
    if (b === 0) {
      throw new Error("Division by zero");
    }
    return a / b;
  } catch (error) {
    console.error("Error: " + error.message);
    return NaN;
  }
}
console.log(divide(10, 0)); // Output: Error: Division by zero, NaN

22. What is the "keyof" keyword in TypeScript?

Answer: The "keyof" keyword in TypeScript is a type operator used to create a union type of all the keys (property names) of a given type. It is often used in combination with indexed access types to access properties dynamically. For example:

interface Person {
  name: string;
  age: number;
}
type PersonKey = keyof Person; // Type is "name" | "age"

23. How can you create Type Aliases in TypeScript?

Answer: Type aliases in TypeScript allow creating custom names for types to improve code readability. They are especially useful for complex types or unions. Type aliases are created using the "type" keyword. For example:

type Point = { x: number; y: number };
type Result = number | string;

24. Explain the "Mapped Types" in TypeScript.

Answer: Mapped types in TypeScript allow transforming the properties of an existing type into a new type. They use the "keyof" keyword and the "in" keyword to iterate over the keys of the original type and apply a transformation. For example:

type Person = {
  name: string;
  age: number;
};
type PersonOptional = { [key in keyof Person]?: Person[key] };

const person: PersonOptional = { name: "John" };
console.log(person); // Output: { name: "John" }

25. How do you use "inference" in TypeScript?

Answer: Inference in TypeScript is the ability of the compiler to automatically determine the type of a variable based on its value. TypeScript uses the context and the initial value assigned to a variable to infer its type. For example:

let message = "Hello TypeScript"; // TypeScript infers the type as string
let count = 42; // TypeScript infers the type as number
let isValid = true; // TypeScript infers the type as boolean

26. What is "Declaration Merging" in TypeScript?

Answer: Declaration merging in TypeScript allows extending existing types and interfaces. When multiple declarations of the same name are encountered, TypeScript merges them into a single declaration. This is commonly used with interfaces and namespaces. For example:

interface User {
  name: string;
}
interface User {
age: number;
}

const user: User = { name: "John", age: 30 };

27. How can you use Type Guards with "instanceof" in TypeScript?

Answer: The "instanceof" operator in TypeScript is used to check whether an object is an instance of a specific class. It is often used as a type guard to narrow down the type of an object. For example:

class Circle {
  radius: number;
  constructor(radius: number) {
    this.radius = radius;
  }
}
class Rectangle {
width: number;
height: number;
constructor(width: number, height: number) {
this.width = width;
this.height = height;
}
}

function getShapeInfo(shape: Circle | Rectangle): string {
if (shape instanceof Circle) {
return "Circle with radius " + shape.radius;
} else {
return "Rectangle with width " + shape.width + " and height " + shape.height;
}
}

28. What are Index Signatures in TypeScript?

Answer: Index signatures in TypeScript allow defining objects with dynamic keys whose types are not known at compile time. They use square brackets "[]" to define the key type, and the value type is specified after a colon ":". For example:

interface Dictionary {
  [key: string]: number;
}
const scores: Dictionary = {
math: 90,
science: 85,
};

29. How can you use Intersection Types with Functions in TypeScript?

Answer: Intersection types can be used with functions in TypeScript to create a single function type that has the characteristics of multiple functions. This allows you to combine multiple function signatures into a single callable signature. For example:

type GreetFunction = (name: string) => void;
type LogFunction = (message: string) => void;
type GreetAndLogFunction = GreetFunction & LogFunction;
const greetAndLog: GreetAndLogFunction = (name: string) => {
console.log("Hello, " + name);
console.log("Log: Greeting message logged.");
};

30. How do you use "namespace" in TypeScript?

Answer: Namespaces in TypeScript are used to organize code into logical groups and avoid naming conflicts. They provide a way to structure the code and encapsulate functionality within a named scope. Namespaces can contain classes, interfaces, functions, and other TypeScript constructs. They are especially useful for organizing code in large-scale applications to maintain code modularity and readability. For example:

namespace MathUtils {
  export function add(a: number, b: number): number {
    return a + b;
  }
export function subtract(a: number, b: number): number {
return a - b;
}
}

const sum = MathUtils.add(10, 5); // Output: 15

31. How do you use "namespace" in TypeScript?

Answer: Namespaces in TypeScript are used to organize code into logical groups and avoid naming conflicts. They provide a way to structure the code and encapsulate functionality within a named scope. Namespaces can contain classes, interfaces, functions, and other TypeScript constructs. They are especially useful for organizing code in large-scale applications to maintain code modularity and readability. For example:

namespace MathUtils {
  export function add(a: number, b: number): number {
    return a + b;
  }
export function subtract(a: number, b: number): number {
return a - b;
}
}

const sum = MathUtils.add(10, 5); // Output: 15

32. What are Type Guards in TypeScript and how are they different from Type Assertion?

Answer: Type Guards in TypeScript are used to narrow down the type of a variable within a conditional block. They are used with the "typeof," "instanceof," and custom user-defined type predicates to perform runtime type checks. Type guards improve the type inference and help TypeScript determine the correct type of a variable within a specific code path. On the other hand, Type Assertion is used to explicitly tell the compiler about the type of a value, overriding its inferred type. Type Assertion is done using the "as" keyword or the "<>angle bracket" syntax. Type Assertion is used when the developer knows more about the type of a value than what TypeScript's type inference can determine. In summary, Type Guards are used for dynamic type checking during runtime to narrow down the type of a variable, while Type Assertion is used for static type checking during development to explicitly specify the type of a variable.

33. How can you use "never" type in TypeScript?

Answer: The "never" type in TypeScript represents values that will never occur. It is used to indicate that a function will not return or that a variable cannot have a value. For example:

function throwError(message: string): never {
  throw new Error(message);
}
function infiniteLoop(): never {
while (true) {
// Infinite loop
}
}

34. How do you use "async" and "await" in TypeScript?

Answer: "async" and "await" are used to handle asynchronous operations in TypeScript. The "async" keyword is used before a function declaration to indicate that the function contains asynchronous code and will return a Promise. The "await" keyword is used inside an async function to wait for a Promise to resolve before proceeding with the execution. For example:

async function fetchData() {
  const response = await fetch('https://api.example.com/data');
  const data = await response.json();
  return data;
}

35. How do you use "Partial" and "Required" utility types in TypeScript?

Answer: "Partial" and "Required" are utility types in TypeScript that allow modifying existing types. The "Partial" utility type converts all properties of a type "T" into optional properties, while the "Required" utility type converts all optional properties of a type "T" into required properties. For example:

interface User {
  name: string;
  age?: number;
}

type PartialUser = Partial; // { name?: string; age?: number; }
type RequiredUser = Required; // { name: string; age: number; }

36. How do you create a Singleton pattern in TypeScript?

Answer: In TypeScript, you can create a Singleton pattern using a combination of a private constructor and a static method to get the instance. The private constructor ensures that only one instance of the class can be created, and the static method provides a way to access that instance. For example:

class Singleton {
  private static instance: Singleton;
  private constructor() {
    // Private constructor to prevent external instantiation
  }
static getInstance(): Singleton {
if (!Singleton.instance) {
Singleton.instance = new Singleton();
}
return Singleton.instance;
}
}

const instance1 = Singleton.getInstance();
const instance2 = Singleton.getInstance();

console.log(instance1 === instance2); // Output: true

37. How do you handle default values in TypeScript function parameters?

Answer: In TypeScript, you can handle default values in function parameters using the assignment operator. By providing a default value in the parameter list, you can make the corresponding argument optional, and if no value is provided during the function call, the default value will be used. For example:

function greet(name: string = "Guest") {
  console.log("Hello, " + name);
}
greet(); // Output: Hello, Guest
greet("John"); // Output: Hello, John

38. How can you use "strictNullChecks" in TypeScript?

Answer: "strictNullChecks" is a TypeScript compiler option that enforces strict null checking. When enabled, variables cannot have a value of "null" or "undefined" unless explicitly specified in their type. This helps catch potential null or undefined errors during development and makes the code more robust. To enable strict null checks, modify the "tsconfig.json" file as follows:

{
  "compilerOptions": {
    "strictNullChecks": true
  }
}

39. What are "Type Predicates" in TypeScript?

Answer: Type Predicates are user-defined type guards in TypeScript. They are used to create custom functions that return a type predicate and are helpful in narrowing down the type of a variable within a conditional block. Type predicates use the "parameter is Type" syntax, where "parameter" is the name of the function parameter, and "Type" is the type you want to narrow down to. For example:

function isString(value: any): value is string {
  return typeof value === "string";
}
function processValue(value: any) {
if (isString(value)) {
console.log("String value: " + value);
} else {
console.log("Non-string value");
}
}

40. How can you use "keyof" with mapped types in TypeScript?

Answer: In TypeScript, you can use "keyof" with mapped types to create a new type that includes only the keys of another type. The "keyof" operator generates a union of all the keys of the provided type, which can then be used to access or manipulate the properties of the original type. For example:

interface Person {
  name: string;
  age: number;
}
type PersonKeys = keyof Person; // Type is "name" | "age"

41. How do you use "readonly" with arrays in TypeScript?

Answer: In TypeScript, you can use "readonly" with arrays to create immutable arrays, meaning that the elements of the array cannot be modified after initialization. You can apply the "readonly" modifier to the entire array or individual elements of the array. For example:

const names: readonly string[] = ["John", "Jane", "Alice"];
const ages: ReadonlyArray = [25, 30, 22];
names[0] = "Mike"; // Error: Index signature in type 'readonly string[]' only permits reading
ages.push(40); // Error: Property 'push' does not exist on type 'readonly number[]'

interface Person {
  name: string;
  age: number;
  address: string;
}

type PersonNameAndAge = Pick; // { name: string; age: number; }
type PersonWithoutAddress = Omit; // { name: string; age: number; }

interface Lengthwise {
  length: number;
}
function logLength(arg: T) {
console.log("Length: " + arg.length);
}

logLength("hello"); // Output: Length: 5
logLength([1, 2, 3]); // Output: Length: 3
logLength(42); // Error: Argument of type 'number' is not assignable to parameter of type 'Lengthwise'

class Counter {
  count: number;
constructor() {
this.count = 0;
}

increment(): this {
this.count++;
return this;
}

decrement(): this {
this.count--;
return this;
}
}

const myCounter = new Counter();
myCounter.increment().increment().decrement();
console.log(myCounter.count); // Output: 1

let person: [string, number];
person = ["John", 30];
person = ["Alice", "25"]; // Error: Type 'string' is not assignable to type 'number'

function printType(value: unknown) {
  if (typeof value === "string") {
    console.log("Type: string");
  } else if (typeof value === "number") {
    console.log("Type: number");
  } else {
    console.log("Type: unknown");
  }
}
printType("hello"); // Output: Type: string
printType(42); // Output: Type: number
printType(true); // Output: Type: unknown

function getProperty(obj: T, key: K) {
  return obj[key];
}
const person = { name: "John", age: 30 };

const nameValue = getProperty(person, "name"); // Type is string
const ageValue = getProperty(person, "age"); // Type is number
const invalidValue = getProperty(person, "address"); // Error: Argument of type '"address"' is not assignable to parameter of type '"name" | "age"'

type ExtractReturnType = T extends (...args: any[]) => infer R ? R : never;
function add(a: number, b: number): number {
return a + b;
}

type AddReturnType = ExtractReturnType; // Type is number

type Person = {
  name: string;
  age: number;
};
type PersonDictionary = Record;

const people: PersonDictionary = {
john: { name: "John", age: 30 },
alice: { name: "Alice", age: 25 },
};