W3Schools Tryit Editor

"use strict";
// Basic Mapped Types Example
// In TypeScript, we'd define interfaces and use mapped types
// This is a JavaScript demonstration of the concept

/**
 * @typedef {Object} Person
 * @property {string} name
 * @property {number} age
 * @property {string} email
 */

// Define a Person object
/** @type {Person} */
const person = {
  name: "John",
  age: 30,
  email: "john@example.com"
};

// Simulating a PartialPerson mapped type by creating an object with only some properties
/** @type {Partial<Person>} */
const partialPerson = {
  name: "John",
  // age and email are optional
};
console.log("Partial Person Object (only has name):");
console.log(partialPerson);

// Create a function to make an object's properties "readonly" 
// (this is just for demonstration, JavaScript doesn't have true readonly properties like TypeScript)
/**
 * @param {Person} obj
 * @returns {Person} // Return same object; freezing provides runtime immutability and preserves static shape inference
 */
function makeReadonly(obj) {
  // Freeze the object to simulate readonly behavior at runtime
  return Object.freeze(obj);
}

// Create a "readonly" version of the person object
/** @type {Person} */
const readonlyPerson = makeReadonly({
  name: "Alice",
  age: 30,
  email: "alice@example.com"
});

console.log("\nReadonly Person Object:");
console.log(readonlyPerson);

// Try to modify a property (in TypeScript this would be a compile-time error)
try {
  readonlyPerson.age = 31; // This will fail in strict mode
  console.log("Modified age:", readonlyPerson.age);
} catch (error) {
  console.log("Error: Cannot modify readonly property 'age'");
}