TypeScript Excess Property Checks: Styrkelse af din objekttypesikkerhed

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

const newUser: User = {
  name: 'Alice',
  age: 30,
  email: 'alice@example.com' // Fejl: Objekt-literal må kun specificere kendte egenskaber, og 'email' findes ikke i typen 'User'.
};

            

              
                Copy
              
            
          

            
interface Product {
  id: number;
  name: string;
}

function displayProduct(product: Product): void {
  console.log(`Product ID: ${product.id}, Name: ${product.name}`);
}

displayProduct({
  id: 101,
  name: 'Laptop',
  price: 1200 // Fejl: Argument af typen '{ id: number; name: string; price: number; }' kan ikke tildeles til parameter af typen 'Product'.
             // Objekt-literal må kun specificere kendte egenskaber, og 'price' findes ikke i typen 'Product'.
});

            

              
                Copy
              
            
          

            
interface Config {
  timeout: number;
}

function setupConfig(config: Config) {
  console.log(`Timeout set to: ${config.timeout}`);
}

const userProvidedConfig = {
  timeout: 5000,
  retries: 3 // Denne 'retries'-egenskab er en overskydende egenskab ifølge 'Config'
};

setupConfig(userProvidedConfig); // Ingen fejl!

// Selvom userProvidedConfig har en ekstra egenskab, springes kontrollen over
// fordi det ikke er en objekt-literal, der videregives direkte.
// TypeScript kontrollerer typen af selve userProvidedConfig.
// Hvis userProvidedConfig var erklæret med typen Config, ville en fejl opstå tidligere.
// Men hvis den er erklæret som 'any' eller en bredere type, udsættes fejlen.

// En mere præcis måde at vise omgåelsen på:
let anotherConfig;

if (Math.random() > 0.5) {
  anotherConfig = {
    timeout: 1000,
    host: 'localhost' // Overskydende egenskab
  };
} else {
  anotherConfig = {
    timeout: 2000,
    port: 8080 // Overskydende egenskab
  };
}

setupConfig(anotherConfig as Config); // Ingen fejl på grund af type assertion og omgåelse

// Nøglen er, at 'anotherConfig' ikke er en objekt-literal på tidspunktet for tildeling til setupConfig.
// Hvis vi havde en mellemliggende variabel med typen 'Config', ville den oprindelige tildeling mislykkes.

// Eksempel på mellemliggende variabel:
let intermediateConfig: Config;

intermediateConfig = {
  timeout: 3000,
  logging: true // Fejl: Objekt-literal må kun specificere kendte egenskaber, og 'logging' findes ikke i typen 'Config'.
};

            

              
                Copy
              
            
          

            
interface Settings {
  theme: 'dark' | 'light';
}

const mySettings = {
  theme: 'dark',
  fontSize: 14 // Overskydende egenskab
} as Settings;

// Ingen fejl her på grund af type assertion.
// Vi fortæller TypeScript: "Stol på mig, dette objekt overholder Settings."
console.log(mySettings.theme);
// console.log(mySettings.fontSize); // Dette ville forårsage en runtime-fejl, hvis fontSize ikke rent faktisk var der.

            

              
                Copy
              
            
          

            
interface FlexibleObject {
  id: number;
  [key: string]: any; // Tillader enhver streng-nøgle med enhver værdi
}

const flexibleItem: FlexibleObject = {
  id: 1,
  name: 'Widget',
  version: '1.0.0'
};

// Ingen fejl, fordi 'name' og 'version' er tilladt af index signaturen.
console.log(flexibleItem.name);

            

              
                Copy
              
            
          

            
interface BaseConfig {
  host: string;
}

interface ExtendedConfig extends BaseConfig {
  port: number;
}

const defaultConfig: BaseConfig = {
  host: 'localhost'
};

const userConfig = {
  port: 8080,
  timeout: 5000 // Overskydende egenskab i forhold til BaseConfig, men forventet af den flettede type
};

// Spreder ind i en ny objekt-literal, der overholder ExtendedConfig
const finalConfig: ExtendedConfig = {
  ...defaultConfig,
  ...userConfig
};

// Dette er generelt i orden, fordi 'finalConfig' er erklæret som 'ExtendedConfig'
// og egenskaberne matcher. Kontrollen er på typen af 'finalConfig'.

// Lad os overveje et scenarie, hvor det *ville* mislykkes:

interface SmallConfig {
  key: string;
}

const data1 = { key: 'abc', value: 123 }; // 'value' er ekstra her
const data2 = { key: 'xyz', status: 'active' }; // 'status' er ekstra her

// Forsøger at tildele til en type, der ikke rummer ekstra egenskaber

// const combined: SmallConfig = {
//   ...data1, // Fejl: Objekt-literal må kun specificere kendte egenskaber, og 'value' findes ikke i typen 'SmallConfig'.
//   ...data2  // Fejl: Objekt-literal må kun specificere kendte egenskaber, og 'status' findes ikke i typen 'SmallConfig'.
// };

// Fejlen opstår, fordi den objekt-literal, der dannes af spread-syntaksen
// indeholder egenskaber ('value', 'status'), der ikke findes i 'SmallConfig'.

// Hvis vi opretter en mellemliggende variabel med en bredere type:

const temp: any = {
  ...data1,
  ...data2
};

// Derefter tildeles til SmallConfig, omgås excess property check ved den oprindelige literal-oprettelse,
// men typekontrollen ved tildeling kan stadig forekomme, hvis temps type udledes mere strengt.
// Men hvis temp er 'any', sker der ingen kontrol før tildelingen til 'combined'.

// Lad os forfine forståelsen af spread med excess property checks:
// Kontrollen sker, når den objekt-literal, der er oprettet af spread-syntaksen, tildeles
// til en variabel eller videregives til en funktion, der forventer en mere specifik type.

interface SpecificShape { 
  id: number;
}

const objA = { id: 1, extra1: 'hello' };
const objB = { id: 2, extra2: 'world' };

// Dette vil mislykkes, hvis SpecificShape ikke tillader 'extra1' eller 'extra2':
// const merged: SpecificShape = {
//   ...objA,
//   ...objB
// };

// Grunden til, at det mislykkes, er, at spread-syntaksen effektivt skaber en ny objekt-literal.
// Hvis objA og objB havde overlappende nøgler, ville den sidste vinde. Compileren
// ser denne resulterende literal og kontrollerer den mod 'SpecificShape'.

// For at få det til at virke, har du muligvis brug for et mellemliggende trin eller en mere tilladelig type:

const tempObj = {
  ...objA,
  ...objB
};

// Nu, hvis tempObj har egenskaber, der ikke er i SpecificShape, vil tildelingen mislykkes:
// const mergedCorrected: SpecificShape = tempObj; // Fejl: Objekt-literal må kun specificere kendte egenskaber...

// Nøglen er, at compileren analyserer formen på den objekt-literal, der dannes.
// Hvis den literal indeholder egenskaber, der ikke er defineret i måltypen, er det en fejl.

// Det typiske anvendelsestilfælde for spread-syntaks med excess property checks:

interface UserProfile {
  userId: string;
  username: string;
}

interface AdminProfile extends UserProfile {
  adminLevel: number;
}

const baseUserData: UserProfile = {
  userId: 'user-123',
  username: 'coder'
};

const adminData = {
  adminLevel: 5,
  lastLogin: '2023-10-27'
};

// Det er her, excess property check er relevant:
// const adminProfile: AdminProfile = {
//   ...baseUserData,
//   ...adminData // Fejl: Objekt-literal må kun specificere kendte egenskaber, og 'lastLogin' findes ikke i typen 'AdminProfile'.
// };

// Den objekt-literal, der er oprettet af spread, har 'lastLogin', som ikke er i 'AdminProfile'.
// For at rette dette, bør 'adminData' ideelt set overholde AdminProfile, eller den overskydende egenskab bør håndteres.

// Korrigeret tilgang:
const validAdminData = {
  adminLevel: 5
};

const adminProfileCorrect: AdminProfile = {
  ...baseUserData,
  ...validAdminData
};

console.log(adminProfileCorrect.userId);
console.log(adminProfileCorrect.adminLevel);

            

              
                Copy
              
            
          

            
interface UserProfile {
  id: number;
  name: string;
}

interface UserWithMetadata extends UserProfile {
  metadata: {
    [key: string]: any;
  };
}

// Eller mere almindeligt med en typealias og rest-syntaks:
type UserProfileWithMetadata = UserProfile & {
  [key: string]: any;
};

const user1: UserProfileWithMetadata = {
  id: 1,
  name: 'Bob',
  email: 'bob@example.com',
  isAdmin: true
};

// Ingen fejl, da 'email' og 'isAdmin' fanges af index signaturen i UserProfileWithMetadata.
console.log(user1.email);
console.log(user1.isAdmin);

// En anden måde at bruge rest-parametre i en typedefinition:
interface ConfigWithRest {
  apiUrl: string;
  timeout?: number;
  // Fang alle andre egenskaber i 'extraConfig'
  [key: string]: any;
}

const appConfig: ConfigWithRest = {
  apiUrl: 'https://api.example.com',
  timeout: 5000,
  featureFlags: {
    newUI: true,
    betaFeatures: false
  }
};

console.log(appConfig.featureFlags);

            

              
                Copy
              
            
          

            
interface Employee {
  employeeId: string;
  department: string;
}

function processEmployeeData(data: Employee & { [key: string]: any }) {
  const { employeeId, department, ...otherDetails } = data;

  console.log(`Employee ID: ${employeeId}`);
  console.log(`Department: ${department}`);
  console.log('Other details:', otherDetails);
  // otherDetails vil indeholde alle egenskaber, der ikke er eksplicit destruktureret,
  // som 'salary', 'startDate', osv.
}

const employeeInfo = {
  employeeId: 'emp-789',
  department: 'Engineering',
  salary: 90000,
  startDate: '2022-01-15'
};

processEmployeeData(employeeInfo);

// Selvom employeeInfo havde en ekstra egenskab oprindeligt, er excess property check
// omgået, hvis funktionssignaturen accepterer det (f.eks. ved hjælp af en index signature).
// Hvis processEmployeeData var strengt typet som 'Employee', og employeeInfo havde 'salary',
// ville en fejl opstå, HVIS employeeInfo var en objekt-literal, der blev videregivet direkte.
// Men her er employeeInfo en variabel, og funktionens type håndterer ekstra egenskaber.

            

              
                Copy
              
            
          

            
interface UserProfile {
  id: number;
  name: string;
  email?: string; // Valgfri e-mail
}

const userWithEmail: UserProfile = {
  id: 2,
  name: 'Charlie',
  email: 'charlie@example.com'
};

const userWithoutEmail: UserProfile = {
  id: 3,
  name: 'David'
};

// Hvis vi forsøger at tilføje en egenskab, der ikke er i UserProfile:
// const userWithExtra: UserProfile = {
//   id: 4,
//   name: 'Eve',
//   phoneNumber: '555-1234'
// }; // Fejl: Objekt-literal må kun specificere kendte egenskaber, og 'phoneNumber' findes ikke i typen 'UserProfile'.

            

              
                Copy
              
            
          

            
interface ProductConfig {
  id: string;
  version: string;
}

// Forestil dig, at dette kommer fra en ekstern kilde eller et mindre strengt modul
const externalConfig = {
  id: 'prod-abc',
  version: '1.2',
  debugMode: true // Overskydende egenskab
};

// Hvis du ved, at 'externalConfig' altid vil have 'id' og 'version', og du vil behandle det som ProductConfig:
const productConfig = externalConfig as ProductConfig;

// Denne assertion omgår excess property check på selve `externalConfig`.
// Men hvis du skulle videregive en objekt-literal direkte:

// const productConfigLiteral: ProductConfig = {
//   id: 'prod-xyz',
//   version: '2.0',
//   debugMode: false
// }; // Fejl: Objekt-literal må kun specificere kendte egenskaber, og 'debugMode' findes ikke i typen 'ProductConfig'.

            

              
                Copy
              
            
          

            
interface Shape {
  kind: 'circle' | 'square';
}

interface Circle extends Shape {
  kind: 'circle';
  radius: number;
}

interface Square extends Shape {
  kind: 'square';
  sideLength: number;
}

function calculateArea(shape: Shape) {
  if (shape.kind === 'circle') {
    // TypeScript ved, at 'shape' er en Circle her
    console.log(Math.PI * shape.radius ** 2);
  } else if (shape.kind === 'square') {
    // TypeScript ved, at 'shape' er en Square her
    console.log(shape.sideLength ** 2);
  }
}

const circleData = {
  kind: 'circle' as const, // Bruger 'as const' til inferens af literal type
  radius: 10,
  color: 'red' // Overskydende egenskab
};

// Når det videregives til calculateArea, forventer funktionssignaturen 'Shape'.
// Funktionen selv vil korrekt tilgå 'kind'.
// Hvis calculateArea forventede 'Circle' direkte og modtog circleData
// som en objekt-literal, ville 'color' være et problem.

// Lad os illustrere excess property check med en funktion, der forventer en specifik undertype:

function processCircle(circle: Circle) {
  console.log(`Processing circle with radius: ${circle.radius}`);
}

// processCircle(circleData); // Fejl: Argument af typen '{ kind: "circle"; radius: number; color: string; }' kan ikke tildeles til parameter af typen 'Circle'.
                         // Objekt-literal må kun specificere kendte egenskaber, og 'color' findes ikke i typen 'Circle'.

// For at rette dette kan du destrukturere eller bruge en mere tilladelig type til circleData:

const { color, ...circleDataWithoutColor } = circleData;
processCircle(circleDataWithoutColor);

// Eller definer circleData til at inkludere en bredere type:

const circleDataWithExtras: Circle & { [key: string]: any } = {
  kind: 'circle',
  radius: 15,
  color: 'blue'
};
processCircle(circleDataWithExtras); // Nu virker det.

            

              
                Copy