Signature d'index de mélange Typescript avec des propriétés connues

Question

Disons que l'interface a des propriétés connues avec leurs types, et peut en avoir d'autres avec des clés inconnues et d' autres types . quelque chose comme:

interface Foo {
  lenght: number;
  [key: string]: string;
}

const foo : Foo = {
  lenght: 1,
  txt: "TXT",
};

Erreur TS: "La propriété 'longueur' de type 'nombre' ne peut pas être affectée au type d'index de chaîne 'chaîne'."

Comment une telle interface doit-elle être saisie?

Answer 1

[key: string]: string;cela empêche l' Foointerface d'avoir aucune propriété de chaîne. (Dans votre numéro d'exemple).

Ce que vous pouvez faire est de séparer les propriétés connues et inconnues en deux interfaces et de définir votre type de cible en tant que type d'union comme ci-dessous:

interface Foo {      
  lenght: number;
}

interface Bar {
    [key: string]: string ;
}

type FooBar = Foo | Bar;

const foo : FooBar = {
  lenght: 1, // its ok defined in foo
  txt: "TXT", // string is ok
  baz : 3 // error because its not string
};

Lien Playground

Answer 2

Découvrez cet extrait, il explique bien le point

interface ArrStr {
  [key: string]: string | number; // Must accommodate all members

  [index: number]: string; // Can be a subset of string indexer

  // Just an example member
  length: number;
}

Vous pouvez consulter cet article pour plus de détails (j'ai choisi l'extrait à partir de là)

https://basarat.gitbook.io/typescript/type-system/index-signatures

Pour cet élément

Avoir à la fois des indexeurs de chaîne et de nombre
Ce n'est pas un cas d'utilisation courant, mais le compilateur TypeScript le prend néanmoins en charge. Cependant, il a la restriction que l'indexeur de chaînes est plus strict que l'indexeur de nombres. Ceci est intentionnel, par exemple pour permettre la saisie de trucs comme: