W3Schools Tryit Editor

// Interface Merging Example
// This demonstrates how TypeScript merges multiple interface declarations with the same name

// In TypeScript, we could define two interfaces with the same name:
// interface Person {
//   name: string;
//   age: number;
// }
//
// interface Person {
//   address: string;
//   email: string;
// }

// The result after merging would be a combined interface with all properties

// Create an object that satisfies what would be the merged interface
const person = {
  name: "John",
  age: 30,
  address: "123 Main St",
  email: "john@example.com"
};

console.log("Person object with merged interface properties:");
console.log(person);

// We can access all properties from both "interfaces"
console.log("\nAccessing individual properties:");
console.log(`Name: ${person.name}`);
console.log(`Age: ${person.age}`);
console.log(`Address: ${person.address}`);
console.log(`Email: ${person.email}`);

// In JavaScript, there's no concept of interfaces or merging
// This is purely a TypeScript compile-time feature

console.log("\nIn TypeScript, the merged interface would look like:");
console.log("interface Person {");
console.log("  name: string;");
console.log("  age: number;");
console.log("  address: string;");
console.log("  email: string;");
console.log("}");

Person object with merged interface properties:
{
  name: 'John',
  age: 30,
  address: '123 Main St',
  email: 'john@example.com'
}

Accessing individual properties:
Name: John
Age: 30
Address: 123 Main St
Email: john@example.com

In TypeScript, the merged interface would look like:
interface Person {
  name: string;
  age: number;
  address: string;
  email: string;
}