Maison >interface Web >js tutoriel >Comment réduire un objet JavaScript aux propriétés d'interface dans TypeScript ?

Comment réduire un objet JavaScript aux propriétés d'interface dans TypeScript ?

Mary-Kate Olsen
Mary-Kate Olsenoriginal
2024-11-01 01:55:27799parcourir

How to Reduce a JavaScript Object to Interface Properties in TypeScript?

Réduction d'un objet JavaScript en propriétés d'interface

Dans TypeScript, une interface agit comme un modèle pour les structures de données. Cependant, lors de l'exécution, les interfaces sont vides, ce qui rend impossible la réduction directe d'un objet pour qu'il ne contienne que les propriétés qui y sont définies.

Implémentation

Cependant, il existe plusieurs solutions de contournement. méthodes :

Utiliser une classe

Définissez plutôt l'interface en tant que classe :

class MyInterface {
  test: string = undefined;
}

Ensuite, utilisez Lodash pour extraire les propriétés requises :

import _ from "lodash";

const before = { test: "hello", newTest: "world" };
let reduced = new MyInterface();
_.assign(reduced, _.pick(before, _.keys(reduced)));
console.log("reduced", reduced); // contains only "test" property

Opérateur d'assemblage

Alternativement, vous pouvez également utiliser l'opérateur d'assemblage :

let reduced = {...new MyInterface(), ...test};

Cela fusionne l'objet vide "MyInterface" avec l'objet "test", en écrasant toutes les propriétés en double.

Pourquoi utiliser cette méthode ?

Cette approche est utile lors de l'envoi de données aux services REST à l'aide de "toJson" d'Angular méthode. La propriété « newTest », bien qu'inaccessible lors de la compilation, serait transformée par « toJson », ce qui obligerait le service REST à rejeter le JSON en raison de propriétés non valides. En réduisant l'objet aux propriétés de l'interface, seules les données attendues sont envoyées, garantissant une bonne communication avec le service.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn