29. How does TypeScript's Declaration Merging feature work? Provide a scenario where it is useful.

TypeScript's Declaration Merging feature allows multiple declarations of the same identifier to be merged within the same namespace. This means you can declare a type or interface multiple times, and TypeScript will combine these declarations into one, enabling you to add new properties or methods to existing interfaces or namespaces.

Example:

interface User {
  name: string;
}

interface User {
  age: number;
}

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

In this case, the User interface is declared twice, but TypeScript merges these declarations into one interface with both name and age properties. This is particularly useful when working with third-party libraries, where you may want to extend existing interfaces to add new methods or properties.

Example of use in third-party libraries:

declare module 'react' {
  interface ComponentProps {
    myCustomProp: string;
  }
}

declare module 'react' {
  interface ComponentProps {
    myOtherProp: number;
  }
}

In this example, TypeScript will merge both declarations into a single ComponentProps interface, allowing both myCustomProp and myOtherProp to be used in React components.