Тип данных функция typescript

Тип данных функция typescript

Каждая функция имеет тип, как и обычные переменные. Тип функции фактически представляет комбинацию типов параметров и типа возвращаемого значения. В общем виде определение типа функции выглядит следующим образом:

(параметр1: тип, параметр2: тип. параметрN: тип) => тип_результата;

В скобках идет перечисление через запятую параметров и их типов. После списка параметров через оператор => указывается тип возвращаемого функцией результата.

Например, возьмем следующую функцию:

Эта функция не имеет параметров и ничего не возвращает. Если функция ничего не возвращает, то фактически тип ее возвращаемого значения — void . Таким образом, функция hello имеет тип

Используя тип функции, мы можем определить переменные, константы и параметры этого типа. Например:

function hello ()< console.log("Hello TypeScript"); >; let message: ()=>void = hello; message();

В данном случае переменная message представляет любую функцию, которая не принимает параметров и ничего не возвращает.

Другой пример — функция, которая принимает параметры и возвращает некоторый результат:

function sum (x: number, y: number): number < return x + y; >;

Она имеет тип (x:number, y:number) => number; , то есть принимает два параметра number и возвращает значение типа number.

Также мы можем определять значения этого типа функции:

let op: (x:number, y:number) => number;

То есть переменная op представляет любую функцию, которая принимает два числа и которая возвращает число. Например:

function sum (x: number, y: number): number < return x + y; >; function subtract (a: number, b: number): number < return a - b; >; let op: (x:number, y:number) => number; op = sum; console.log(op(2, 4)); // 6 op = subtract; console.log(op(6, 4)); // 2

Здесь вначале переменная op указывает на функцию sum. И соответственно вызов op(2, 4) фактически будет представлять вызов sum(2, 4) . А затем op указывает на функцию subtract.

Функции как параметры других функций

Тип функции можно использовать как тип переменной, но он также может применяться для определения типа параметра другой функции:

function sum (x: number, y: number): number < return x + y; >; function multiply (a: number, b: number): number < return a * b; >; function mathOp(x: number, y: number, op: (a: number, b: number) => number): number < return op(x, y); >console.log(mathOp(10, 20, sum)); // 30 console.log(mathOp(10, 20, multiply)); // 200

Здесь в функции mathOp() третий параметр представляет функцию, которая принимает два параметра типа number и возвращает значение типа number. Соответственно при вызове функции mathOp() мы можем передать в нее, например, определенные здесь функции sum() или multiply() , которые соответствуют типу (a: number, b: number) => number

Читайте также:  Язык html позволяет создавать базы данных

Если определенный тип функции предстоит очень часто использовать, то для него оптимальнее определить псевдоним и обращаться к типу по этому псевдониму:

type Operation = (a: number, b: number) => number; function mathOp(x: number, y: number, op: Operation): number < return op(x, y); >let sum: Operation = function(x: number, y: number): number < return x + y; >; console.log(mathOp(10, 20, sum)); // 30

В данном случае тип (a: number, b: number) => number проецируется на псевдоним Operation , который может использоваться для определения переменных и параметров.

Стрелочные функции

Для определения функций в TypeScript можно использовать стрелочные функции или arrow functions. Стрелочные функции представляют выражения типа (параметры) => тело функции . Например:

let sum = (x: number, y: number) => x + y; let result = sum(15, 35); // 50 console.log(result);

Тип параметров можно опускать:

let sum = (x, y) => x + y; let result = sum(15, 35); // 50 console.log(result);

Если стрелочная функция не требует параметров, то используются пустые круглые скобки. Если передается только один параметр, то скобки можно опустить:

let square = x => x * x; let hello = () => "hello world" console.log(square(5)); // 25 console.log(hello()); // hello world

Если тело функции представляет множество выражений, а не просто одно выражение, как в примере выше, тогда можно опять же заключить все выражения в фигурные скобки:

let sum = (x: number, y: number) => < x *= 2; return x + y; >; let result = sum(15, 35); // 65 console.log(result);

Стрелочные функции можно передавать в функцию вместо параметра, который представляет собой функцию:

function mathOp(x: number, y: number, operation: (a: number, b: number) => number): number < let result = operation(x, y); return result; >console.log(mathOp(10, 20, (x,y)=>x+y)); // 30 console.log(mathOp(10, 20, (x, y) => x * y)); // 200

Источник

Читайте также:  Course view php id 266

Подробно про функции и типы в TypeScript

В этом руководстве вы узнаете о функциях TypeScript и о том, как использовать аннотации типов для обеспечения проверки типов для функций.

Введение в функции TypeScript

Функции TypeScript являются строительными блоками читаемого, поддерживаемого и многократно используемого кода.

Как и в JavaScript, используется ключевое слово function для объявления функции в TypeScript:

function name(parameter: type, parameter:type. ): returnType < // do something >

В отличие от JavaScript, TypeScript позволяет использовать аннотации типов в параметрах и возвращаемых значениях функции.

Давайте посмотрим на следующий пример функции add() :

function add(a: number, b: number): number

В этом примере функция add() принимает два параметра с типом number .

Когда вы вызываете функцию add() , компилятор TypeScript проверяет каждый переданный функции аргумент, чтобы убедиться, что это числа.

В примере с функцией add() в нее можно передавать только числа, а не значения других типов.

Следующий код приведет к ошибке, поскольку он передает две строки вместо двух чисел в функцию add() :

error TS2345: Argument of type '"10"' is not assignable to parameter of type 'number'

Типы параметров функции также доступны в теле функции для проверки типов.

: number после круглых скобок указывает тип возвращаемого значения. В этом случае функция add() возвращает значение типа number .

Когда функция имеет возвращаемый тип, компилятор TypeScript проверяет каждую инструкцию return на соответствие возвращаемому типу, чтобы убедиться, что возвращаемое значение совместимо с ним.

Если функция не возвращает значение, вы можете использовать тип void в качестве возвращаемого типа. Ключевое слово void указывает, что функция не возвращает никакого значения. Например:

function echo(message: string): void

void запрещает коду внутри функции возвращать значение и запрещает вызывающему коду присваивать результат функции переменной.

Если вы не аннотируете возвращаемый тип, TypeScript попытается вывести соответствующий тип. Например:

function add(a: number, b: number)

В этом примере компилятор TypeScript пытается вывести возвращаемый тип функции add() в тип number , что и ожидалось.

Читайте также:  Section или div html

Однако если функция имеет разные ветви, которые возвращают разные типы, компилятор TypeScript может определить тип union или тип any .

Поэтому важно как можно больше добавлять аннотаций типов к функции.

  • Используйте аннотации типа для параметров функции и типа возвращаемого значения, чтобы сохранить встроенный код вызова и обеспечить проверку типа в теле функции.

Тип функции в TypeScript

Тип функции состоит из двух частей: параметры и возвращаемый тип. При объявлении типа функции вам необходимо указать обе части со следующим синтаксисом:

(parameter: type, parameter:type. ) => type

В следующем примере показано, как объявить переменную с типом функции, которая принимает два числа и возвращает число:

let add:(x: number, y: number) => number;
  • Тип функции принимает два аргумента: x и y с типом number .
  • Тип возвращаемого значения — number , который следует за толстой стрелкой( => ), появившейся между параметрами и типом возвращаемого значения.

Обратите внимание, что имена параметров( x и y ) предназначены только для удобства чтения. Пока типы параметров совпадают, это допустимый тип для функции.

После аннотирования переменной с типом функции вы можете назначить функцию с тем же типом переменной.

Компилятор TypeScript сопоставит количество параметров с их типами и типом возвращаемого значения.

В следующем примере показано, как назначить функцию переменной add :

add = function(x: number, y: number) < return x + y; >;

Кроме того, вы можете объявить переменную и присвоить ей функцию следующим образом:

let add:(a: number, b: number) => number = function(x: number, y: number) < return x + y; >;

Если вы назначите другие функции, тип которых не соответствует переменной add , TypeScript выдаст ошибку:

add = function(x: string, y: string): number < return x.concat(y).length; >;

В этом примере мы переназначили функцию, тип которой не соответствует, функциональной переменной add .

Вывод типов функций

Компилятор TypeScript может определить тип функции, когда у вас есть тип на одной стороне уравнения. Эта форма вывода типа называется контекстной типизацией. Например:

Вывод типа функции typescript

В этом примере функция add примет тип (x: number, y:number) => number .

Используя вывод типов, вы можете значительно сократить объем кода с аннотациями.

Источник

Оцените статью