typescript1.7 - vad är skillnaden mellan dessa två TypeScript-koder?

vad är skillnaden mellan dessa 2 TypeScript-koder? (Jag använder TypeScript 1.7.5)

interface SquareConfig {
  color?: string;
  width?: number;
}

function createSquare(config: SquareConfig): {color: string; area: number} {
  var newSquare = {color: "white", area: 100};
  if (config.color) {
    newSquare.color = config.color;
  }
  if (config.width) {
    newSquare.area = config.width * config.width;
  }
  return newSquare;
}

var obj = {color1: "black"};
var mySquare = createSquare(obj);

när är kompilering inte ett fel men nedanstående kod ger produktionsfel.

interface SquareConfig {
  color?: string;
  width?: number;
}

function createSquare(config: SquareConfig): {color: string; area: number} {
  var newSquare = {color: "white", area: 100};
  if (config.color) {
    newSquare.color = config.color;
  }
  if (config.width) {
    newSquare.area = config.width * config.width;
  }
  return newSquare;
}

var mySquare = createSquare({color1: "black"});

fel :

test.ts(18,30): fel TS2345: Argument av typen '{ color1: string; }' kan inte tilldelas parametern av typen 'SquareConfig'. Objektliteral kan endast ange kända egenskaper, och 'color1' finns inte i typen 'SquareConfig'.

Svar #1

Båda dina exempel har samma (upplevda) fel, vilket är att du har angett en egenskap som inte är känd för SquareConfig, vilket ofta betyder att du har stavat ett egenskapsnamn fel.

I ditt fall har du specificerat color1 där du förmodligen avsåg att använda color.

Den här koden skulle ha kompilerat med äldre versioner av TypeScript innan denna ytterligare funktion för att kontrollera ospecificerade egenskaper lades till.

Fixar...

Alternativ ett, ange den korrekta egenskapen:

var mySquare = createSquare({color: "black"});

Alternativ två, du avser medvetet att inkludera någon annan egenskap, använd en typ-assertion för att tala om för kompilatorn att du vet bättre än den (så länge du är säker på att du faktiskt vet bättre än den!):

var mySquare = createSquare(<SquareConfig>{color1: "black"});

Uppdatering baserad på kommentar

Kompilatorn är striktare ju färre "separeringsgrader" du har... till exempel:

// Error
var obj: SquareConfig = {color1: "black"};

// OK
var obj = {color1: "black"};
var obj2: SquareConfig = obj;

Låt oss titta på det första exemplet, vi säger "Jag avser att skapa en SquareConfig". Kompilatorn säger, "tja, det finns inga obligatoriska objekt eftersom allt är valfritt, men du skapar objektet med en egenskap som jag inte känner igen - så jag kommer att varna dig".

Det andra exemplet är något annorlunda. Vi säger "Jag avser att använda ett objekt som jag har som en SquareConfig". Kompilatorn säger, "saknas några obligatoriska egenskaper i det objekt du avser att använda... och har varje egenskap rätt typ för att vara en strukturell match för en SquareConfig - ja."

Om det andra scenariot varnade dig för egenskaper som inte finns på målstrukturen, skulle du inte kunna dra nytta av den super-polymorfism som ett strukturellt typ-system erbjuder.

Relaterade artiklar