Questions d'entretien technique - Partie Typescript

Voici à quoi ça ressemble :

function returnGenericElement<T>(element: T): T {
 return element;
}

Et, une dernière chose à ajouter avant de terminer cette question.
N'oubliez pas que les génériques sont une fonctionnalité de Typescript. Cela signifie que les génériques seront effacés lorsque nous les compilerons en Javascript.

De

const stringData2 = returnGenericElement("Hello world");


const numberData2 = returnGenericElement(5);

à

function returnLength<T>(element: T[]): number {
 return element.length;
}

Question 2 : Quelles sont les différences entre les interfaces et les types ?

La réponse courte est :

1. La fusion de déclarations fonctionne avec les interfaces mais pas avec les types.
2. Vous ne pouvez pas utiliser d'outils dans une classe avec des types d'union.
3. Vous ne pouvez pas utiliser d'extensions avec une interface utilisant des types d'union.

Concernant le premier point, Qu'est-ce que j'entends par fusion de déclarations ?

Laissez-moi vous montrer :
J'ai défini deux fois la même interface en l'utilisant dans une classe. La classe incorporera alors les propriétés déclarées dans les deux définitions.

const stringLength = returnLength(["Hello", "world"]);

Cela ne se produit pas avec les types. Si nous essayons de définir un type plus d'une fois, TypeScript générera une erreur.

class Addition<U> {
 add: (x: U, y: U) => U;
}

Concernant les points suivants, différencions les types d'union et d'intersection :

Les types d'union nous permettent de spécifier qu'une valeur peut être de plusieurs types. Ceci est utile lorsqu'une variable peut contenir plusieurs types.

Les types d'intersection nous permettent de combiner des types en un seul. Il est défini à l'aide de l'opérateur &.

const operation = new Addition<number>();


operation.add = (x, y) => x + y; => We implement the function here


console.log(operation.add(5, 6)); // 11

Type de syndicat :

function returnGenericElement<T>(element: T): T {
 return element;
}

Type d'intersection :

function returnElement(element: string): string {
 return element;
}


const stringData = returnElement("Hello world");

Si nous essayons d'utiliser le mot-clé Implements avec un type d'union, tel que Animal, TypeScript générera une erreur. En effet, les implémentations attendent une seule interface ou un seul type, plutôt qu'un type d'union.

const numberData = returnElement(5);

Typescript nous permet d'utiliser des « outils » avec :

a. Types d'intersections

function returnNumber(element: number): number {
 return element;
}

b. Interfaces

function returnElement2(element: any): any {
 return element;
}

function returnGenericElement<T>(element: T): T {
 return element;
}

c. Type unique.

const stringData2 = returnGenericElement("Hello world");


const numberData2 = returnGenericElement(5);

Le même problème se produit lorsque nous essayons d'utiliser des extensions avec un type d'union. TypeScript générera une erreur car une interface ne peut pas étendre un type d'union. Voici un exemple

function returnLength<T>(element: T[]): number {
 return element.length;
}

Vous ne pouvez pas étendre un type d'union car il représente plusieurs types possibles et il n'est pas clair quelles propriétés de type doivent être héritées.

MAIS vous pouvez étendre un type ou une interface.

const stringLength = returnLength(["Hello", "world"]);

Vous pouvez également étendre un seul type.

class Addition<U> {
 add: (x: U, y: U) => U;
}

Question 3 : Quelles sont les différences entre any, null, inconnu et jamais ?

Réponse courte :

Tout => Il s'agit d'une variable de type supérieur (également appelée type universel ou supertype universel). Lorsque nous utilisons any dans une variable, la variable peut contenir n’importe quel type. Il est généralement utilisé lorsque le type spécifique d'une variable est inconnu ou susceptible de changer. Cependant, leur utilisation n’est pas considérée comme une bonne pratique ; il est recommandé d'utiliser plutôt des génériques.

const operation = new Addition<number>();


operation.add = (x, y) => x + y; => We implement the function here


console.log(operation.add(5, 6)); // 11

Bien que any autorise des opérations telles que l'appel de méthodes, le compilateur TypeScript ne détectera pas les erreurs à ce stade. Par exemple :

function returnGenericElement<T>(element: T): T {
 return element;
}

Vous pouvez attribuer n'importe quelle valeur à n'importe quelle variable :

function returnGenericElement(element) {
 return element;
}

De plus, vous pouvez attribuer une variable n'importe quelle à une autre variable avec un type défini :

interface CatInterface {
 name: string;
 age: number;
}


interface CatInterface {
 color: string;
}


const cat: CatInterface = {
 name: "Tom",
 age: 5,
 color: "Black",
};

Inconnu => Ce type, comme n’importe quel autre, peut contenir n’importe quelle valeur et est également considéré comme le type supérieur. Nous l'utilisons lorsque nous ne connaissons pas le type de variable, mais il sera attribué plus tard et restera le même pendant l'exécution. L'inconnu est un type moins permissif que n'importe quel autre.

type dog = {
 name: string;
 age: number;
};


type dog = { // Duplicate identifier 'dog'.ts(2300)
 color: string;
};


const dog1: dog = {
 name: "Tom",
 age: 5,
 color: "Black", //Object literal may only specify known properties, and 'color' does not exist in type 'dog'.ts(2353)
};

L'appel direct de méthodes sur un inconnu entraînera une erreur de compilation :

type cat = {
 name: string;
 age: number;
};


type dog = {
 name: string;
 age: number;
 breed: string;
};

Avant de l'utiliser, nous devons effectuer des vérifications telles que :

type animal = cat | dog;

Comme n'importe quel autre, nous pourrions attribuer n'importe quel type à la variable.

type intersectionAnimal = cat & dog;

Cependant, nous ne pouvons pas attribuer le type inconnu à un autre type, mais tout ou inconnu.

function returnElement(element: string): string {
 return element;
}


const stringData = returnElement("Hello world");

Cela nous montrera une erreur

Nul => La variable peut contenir l’un ou l’autre type. Cela signifie que la variable n'a pas de valeur.

const numberData = returnElement(5);

Tenter d'attribuer un autre type à une variable nulle entraînera une erreur :

function returnNumber(element: number): number {
 return element;
}

Jamais => Nous utilisons ce type pour spécifier qu'une fonction n'a pas de valeur de retour.

function returnElement2(element: any): any {
 return element;
}

La fin...

On termine avec Typescript,

Pour aujourd'hui (?

J'espère que cela a été utile à quelqu'un.

Si vous avez des questions techniques lors de l'entretien que vous aimeriez que je vous explique, n'hésitez pas à me le faire savoir dans les commentaires. ??

Passez une bonne semaine ?

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!