Fonctions TypeScript : définition, invocation et passage de paramètres

introduction

TypeScript est un sur-ensemble de JavaScript typé statiquement avec de meilleures capacités d'indication de code et de vérification des erreurs. Dans TypeScript, la fonction est également un concept important.Cet article présentera les méthodes de définition, d'appel et de passage de paramètres des fonctions TypeScript.

Définir les fonctions TypeScript

  • Dans TypeScript, les fonctions sont définies de la même manière que dans JavaScript, et les fonctions TypeScript peuvent créer 有名字的函数et 匿名函数.

  • Lors de la définition de TypeScript, vous devez spécifier les types de paramètres et les types de valeur de retour de la fonction. Par exemple, définissez une fonction simple qui prend deux arguments numériques et renvoie leur somme :

    function add(num1: number, num2: number): number {
          
          
        return num1 + num2;
    }
    
  • Dans cette fonction, nous spécifions les types des deux paramètres ( num1: numberet num2: number), et le type de retour de la fonction ( : number).

Appeler des fonctions TypeScript

  • L'appel d'une fonction TypeScript est identique à une fonction JavaScript, vous pouvez directement utiliser le nom et les paramètres de la fonction. Par exemple, on peut appeler addla fonction :

    const result = add(1, 2); // result 将是 3
    
  • Dans cet exemple, deux arguments numériques 1 et 2 sont passés, et la fonction les ajoute et renvoie le résultat 3.

type de fonction

  • Un type de fonction se compose de deux parties : 参数类型et 返回值类型.

  • Les deux parties sont nécessaires lors de l'écriture d'un type de fonction complet.

  • Écrivez les types de paramètres sous forme de liste de paramètres, en spécifiant un nom et un type pour chaque paramètre. (Le nom est juste pour la lisibilité).

  • Type de fonction complète :

    let myAdd: (baseValue: number, increment: number) => number = function(x: number, y: number): number {
          
          
        return x + y;
    };
    

type déduit

  • Lorsqu'un type est spécifié d'un côté d'une instruction d'affectation mais pas de l'autre côté, le compilateur TypeScript reconnaît automatiquement le type.

    // myAdd has the full function type
    let myAdd = function(x: number, y: number): number {
          
           return x + y; };
    
    // The parameters `x` and `y` have the type number
    let myAdd: (baseValue: number, increment: number) => number =
        function(x, y) {
          
           return x + y; };
    

Passage de paramètre

  • Dans TypeScript , il existe de nombreuses façons de transmettre des paramètres de fonction, notamment 可选参数, et .默认参数剩余参数函数重载

paramètres facultatifs

  • Un paramètre facultatif signifie que le paramètre ne peut pas être passé lors de l'appel de la fonction. Dans TypeScript, un ?point un paramètre comme facultatif. Par exemple, définissez une fonction qui calcule l'aire d'un rectangle :

    function calculateRectangleArea(width: number, height?: number): number {
          
          
        if (height) {
          
          
            return width * height;
        } else {
          
          
            return width * width;
        }
    }
    
  • Dans cette fonction, le deuxième paramètre heightest marqué comme paramètre facultatif, c'est-à-dire que le paramètre peut être transmis ou non lors de l'appel de la fonction. S'il est passé height, calcule l'aire du rectangle et renvoie le résultat ; sinon, calcule l'aire du carré widthcomme côté et renvoie le résultat.

paramètres par défaut

  • Le paramètre par défaut signifie que si le paramètre n'est pas passé lors de l'appel de la fonction, la valeur par défaut spécifiée sera utilisée. Dans TypeScript, utilisez le signe égal =pour spécifier une valeur par défaut pour un paramètre. Par exemple, définissez une fonction qui affiche un message :

    function showMessage(message: string = 'Hello'): void {
          
          
        console.log(message);
    }
    
  • Dans cette fonction, nous spécifions la valeur par défaut messagedu 'Hello', si le paramètre n'est pas passé lors de l'appel de la fonction, la valeur par défaut sera utilisée. Par exemple:

    showMessage(); // 输出 'Hello' showMessage('World'); // 输出 'World'
    

paramètres restants

  • Les paramètres restants signifient que n'importe quel nombre de paramètres peut être passé lors de l'appel de la fonction et les placer dans un tableau. Dans TypeScript, trois points sont utilisés ...pour marquer un paramètre comme paramètre restant. Par exemple, définissez une fonction qui calcule la somme de plusieurs nombres :

    function sum(...numbers: number[]): number {
          
          
        let total = 0;
        for (const num of numbers) {
          
          
            total += num;
        }
        return total;
    }
    
  • Dans cette fonction, nous ...numbersrecevons et calculons leur somme.

ce

  • Comme nous le savons tous, en JavaScript, le pointage de this est une chose particulièrement importante mais difficile, en TypeScript, il faut encore passer du temps à apprendre le pointage de this. Mais dans TypoScript, une chose très heureuse est que lors de la compilation, TypeScript indiquera aux développeurs où cela est mal utilisé, et les développeurs n'ont pas besoin de se creuser la tête pour lire le code.

  • En JavaScript, thisla valeur de la fonction est spécifiée lorsque la fonction est appelée. Il s'agit d'une fonctionnalité puissante et flexible, mais les développeurs doivent passer du temps à déterminer quel est le contexte de l'appel de la fonction, en particulier lors du renvoi d'une fonction ou de l'utilisation de la fonction fonctionner comme lors du passage des paramètres, il sera difficile.

  • Si vous ne comprenez pas cette partie du contenu, vous pouvez vous référer à ce point de JavaScript, car la fonction de this en JavaScript et TypeScript est la même.

surcharge de fonctions

  • La surcharge de fonctions signifie que différentes implémentations de fonctions sont utilisées en fonction du type et du nombre de paramètres passés. Dans TypeScript, les déclarations de surcharge de fonction peuvent être utilisées pour définir plusieurs implémentations de fonction. Par exemple, définissez une fonction de traitement de texte :

    function processText(text: string): string;
    function processText(numbers: number[]): number[];
    function processText(value: string | number[]): string | number[] {
          
          
        if (typeof value === 'string') {
          
          
            return value.toUpperCase();
        } else {
          
          
            return value.map(num => num * 2);
        }
    }
    
  • Dans cette fonction, nous définissons deux implémentations de fonction. Lorsque le paramètre passé est un type de chaîne, convertissez-le en majuscule et retournez ; lorsque le paramètre passé est un type de tableau numérique, multipliez tous les nombres qu'il contient par 2 et retournez.

Résumer

Cet article présente les méthodes de définition, d'appel et de passage de paramètres des fonctions TypeScript. En apprenant ces connaissances, vous pourrez mieux comprendre le concept de fonctions dans TypeScript et utiliser TypeScript pour développer des programmes plus fiables et maintenables.

Je suppose que tu aimes

Origine blog.csdn.net/McapricornZ/article/details/131258025
conseillé
Classement