Maison >interface Web >js tutoriel >Cours de dactylographie gratuit en classe

Cours de dactylographie gratuit en classe

DDD
DDDoriginal
2025-01-06 06:34:40824parcourir

Dans le cours précédent, nous avons configuré notre environnement de développement et approfondi les types primitifs de Typescript.

Dans le cours d'aujourd'hui, nous apprendrons à travailler avec des objets et des tableaux dans Typescript.


Introduction

Dans ce cours, nous découvrirons les objets et les tableaux en Typescript. Explorons différentes manières de créer des objets et des tableaux dans nos projets avec Typescript.

Objets littéraux

L'un des moyens les plus simples de créer un objet consiste à utiliser des littéraux d'objet. Cette approche est particulièrement utile lorsque vous avez déjà une connaissance préalable des propriétés de l'objet, car vous ne pouvez pas ajouter de nouvelles propriétés ultérieurement.

const objeto = {
  chaveA: 'value',
  chaveB: 'value',
};

objeto.chaveC = 'value';

Curso gratuito de Typescript  Aula

Signature de l'index

Une façon de créer des objets dynamiques consiste à utiliser Index Signature. Cette approche est particulièrement utile lorsque l'on ne sait pas à l'avance quelles seront les propriétés de l'objet.

const objeto: { [key: string]: string } = {
  chaveA: 'value A',
  chaveB: 'value B',
};

objeto.chaveC = 'value C';

console.log(objeto);

Curso gratuito de Typescript  Aula

Enregistrer

Une autre façon de créer des objets dynamiques dans Typescript consiste à utiliser Record. L'enregistrement est l'un des types d'utilitaires de la boîte à outils Typescript. Explorons plus tard les types d'utilitaires. Pour l'instant, ce que vous devez savoir, c'est que lors de l'utilisation de Record, nous devons spécifier le type de la clé et la valeur de l'objet entre <>.

const objeto: Record<string, string> = {
  chaveA: 'value A',
  chaveB: 'value B',
};

Curso gratuito de Typescript  Aula

Littéraux de tableau

Le moyen le plus simple de créer un tableau consiste à utiliser un tableau littéral, qui est une liste d'éléments séparés par des virgules et placés entre crochets.

const arrayDeNumeros: number[] = [1, 2, 3];
const arrayDeString: string[] = ['Josh', 'Patrick', 'Lamar'];
const arrayDeStringENumeros: (string | number)[] = [1, 'Alice', 55];

console.log(arrayDeString);
console.log(arrayDeNumeros);
console.log(arrayDeStringENumeros);

Curso gratuito de Typescript  Aula

Constructeur de tableau

Vous pouvez également utiliser le constructeur Array pour créer un nouveau tableau.

const arrayDeNumeros: Array<number> = [1, 2, 3];
const arrayDeString: Array<string> = ['Josh', 'Patrick', 'Lamar'];
const arrayDeStringENumeros: Array<string | number> = [1, 'Alice', 55];

console.log(arrayDeString);
console.log(arrayDeNumeros);
console.log(arrayDeStringENumeros);

Curso gratuito de Typescript  Aula


Vous pouvez accéder au code du cours en accédant au lien ci-dessous :
https://github.com/d3vlopes/curso-typescript/tree/aula-002

Cours suivant

Dans le prochain cours, nous explorerons les fonctions de Typescript. Apprenons à définir les types de paramètres, les types de retour et plus encore !

Laissez un commentaire et partagez cet article avec votre réseau pour soutenir et aider davantage de personnes à apprendre Typescript.

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