Werken met TypeScript en Promises

TypeScript verbetert JavaScript-ontwikkeling door statische typen toe te voegen. Bij het werken met asynchrone code worden promises gebruikt om bewerkingen af ​​te handelen die in de toekomst worden voltooid. TypeScript biedt tools om promises te beheren met typesafety en duidelijkheid. Deze gids onderzoekt hoe u met promises in TypeScript kunt werken, van basisgebruik tot geavanceerde scenario's.

Beloften begrijpen

Een promise is een object dat de uiteindelijke voltooiing of mislukking van een asynchrone bewerking vertegenwoordigt. Het biedt methoden om het resultaat of de fout van de bewerking te verwerken. In TypeScript kunnen promises worden getypt om ervoor te zorgen dat ze worden opgelost met het verwachte gegevenstype.

Basisgebruik van beloften

Promises maken en gebruiken in TypeScript is eenvoudig. Hier is een voorbeeld van een promise die wordt opgelost met een string:

function fetchData(): Promise {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("Data fetched successfully!");
    }, 1000);
  });
}

fetchData().then((data) => {
  console.log(data); // Outputs: Data fetched successfully!
}).catch((error) => {
  console.error("Error:", error);
});

In dit voorbeeld retourneert fetchData een promise die wordt opgelost met een string. De then-methode verwerkt de opgeloste waarde, terwijl catch alle fouten verwerkt.

Promises afhandelen met Async/Await

TypeScript ondersteunt de async/await-syntaxis, die een beter leesbare manier biedt om met promises te werken. Hier leest u hoe u async/await met promises gebruikt:

async function fetchDataAsync(): Promise {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("Data fetched successfully!");
    }, 1000);
  });
}

async function processData() {
  try {
    const data = await fetchDataAsync();
    console.log(data); // Outputs: Data fetched successfully!
  } catch (error) {
    console.error("Error:", error);
  }
}

processData();

In dit voorbeeld is de functie fetchDataAsync gedeclareerd als async, waardoor het het trefwoord await kan gebruiken om te wachten tot de promise is opgelost. Fouten worden opgevangen met een try/catch-blok.

Beloften typen met generieke typen

Met TypeScript kunt u het type gegevens specificeren waarmee een promise wordt opgelost met behulp van generieke typen. Dit zorgt ervoor dat de typen correct worden beheerd in de code. Hier is een voorbeeld van een getypte promise:

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

function fetchUser(): Promise {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve({ id: 1, name: "John Doe" });
    }, 1000);
  });
}

fetchUser().then((user) => {
  console.log(user.id, user.name); // Outputs: 1 John Doe
}).catch((error) => {
  console.error("Error:", error);
});

In dit voorbeeld retourneert fetchUser een promise die wordt opgelost met een User-object. Het type wordt gespecificeerd met behulp van generics, wat typesafety garandeert.

Promises gebruiken in TypeScript met API-aanroepen

Promises worden vaak gebruikt met API-aanroepen om asynchrone gegevensophaling te verwerken. Het typesysteem van TypeScript helpt bij het beheren van reacties van API's:

async function getUserData(userId: number): Promise {
  const response = await fetch(`https://api.example.com/users/${userId}`);
  if (!response.ok) {
    throw new Error("Network response was not ok.");
  }
  const data: User = await response.json();
  return data;
}

getUserData(1).then((user) => {
  console.log(user);
}).catch((error) => {
  console.error("Error:", error);
});

Dit voorbeeld laat zien hoe u fetch kunt gebruiken om een ​​API-aanroep te doen en de respons te verwerken met promises en async/await. De respons wordt getypt als User, wat typesafety garandeert.

Conclusie

Werken met promises in TypeScript biedt verbeterde typeveiligheid en duidelijkheid voor asynchrone bewerkingen. Door het typesysteem van TypeScript, async/await-syntaxis en generics te gebruiken, kunnen ontwikkelaars promises effectief beheren en betrouwbaardere applicaties bouwen.