Typescript: Дженерики (Функции)
Представим, что дженерики пропали из языка. Тогда мы столкнемся с дублированием кода. Придется описывать один и тот же алгоритм для разных типов данных много раз.
Возьмем для примера функцию last(), возвращающую последний элемент массива. Ниже ее обобщенная версия:
function last<T>(coll: T[]): T {
return coll.at(-1);
}Дженерики также могут использоваться в стрелочных функциях:
const last = <T>(coll: T[]): T => coll.at(-1);Теперь попробуем реализовать такое же поведение на обычных функциях. Для этого нам придется создать по одной функции для каждого типа. Причем имя функции должно быть уникальным:
function lastForNumberType(coll: number[]): number {
return coll.at(-1);
}
function lastForStringType(coll: string[]): string {
return coll.at(-1);
}
// Тут определения для всех остальных типовА что если у нас несколько типов? Тогда нужно подсчитать, сколько функций нужно определить — умножить количество всех возможных типов на количество параметров типа.
Реализация с помощью перегруженной функции упрощает задачу. При работе с ними нам не придется создавать новые имена:
function last(coll: number[]): number;
function last(coll: string[]): string;
// Тут определения для всех остальных типов
function last(coll: any[]): any {
return coll.at(-1);
}В случае TypeScript даже логика не будет дублироваться, но это особенность именно TypeScript. В других статически типизированных языках придется дублировать и логику тоже.
Какой бы вариант реализации мы ни выбрали, соблюдаются две вещи:
- Передаваемые внутрь значения никак не используются, они только перекладываются из одного места в другое
- Логика работы всегда остается одной и той же, условные конструкции по типу данных отсутствуют
В Computer Science есть один важный термин — параметрический полиморфизм. Это свойство функции, позволяющее обрабатывать значения разных типов одним способом, используя один алгоритм. Это значит, что дженерики — это реализация параметрического полиморфизма в TypeScript.
Параметрический полиморфизм играет важную роль в статически типизированных языках, потому что там приходится явно указывать типы у функций. Он есть почти во всех высокоуровневых статически типизированных языках. В Java и C# это тоже называется дженериками. В C++ используется термин «шаблоны», но смысл от этого не меняется, хотя шаблоны в С++ — это больше, чем параметрический полиморфизм.
В противовес статически типизированным языкам есть JavaScript, Python, Ruby, PHP и другие языки с динамической типизацией. В них дженерики не нужны. В подобных языках любой обобщенный алгоритм автоматически работает для всех типов данных.
Задание
Реализуйте описание обобщенного типа MyArray, который представляет аналог массива из JavaScript. Пример использования объекта этого типа:
const coll: MyArray<number> = ...;
coll.push(1); // 1
coll.push(10); // 2
coll.push(99); // 3
const newColl = coll.filter((value) => value % 2 == 0);
console.log(newColl.items); // [10]Тип включает в себя два метода: push() и filter(). push() принимает значение того же типа, что и элементы коллекции — в отличие от метода Array, примем соглашение, что параметр только один. filter() принимает колбек с такими же параметрами, как у одноименного метода Array: value, index и array. Данные внутри должны храниться в свойстве items.
А вот возвращаемые значения совпадают не полностью. push(), как и в Array, возвращает новую длину коллекции. filter() же возвращает не массив, а новую коллекцию типа MyArray<T> — поэтому в примере выше у результата фильтрации есть свойство items.
Полезное
Typescript: Дженерики (Функции)
Представим, что дженерики пропали из языка. Тогда мы столкнемся с дублированием кода. Придется описывать один и тот же алгоритм для разных типов данных много раз.
Возьмем для примера функцию last(), возвращающую последний элемент массива. Ниже ее обобщенная версия:
function last<T>(coll: T[]): T {
return coll.at(-1);
}Дженерики также могут использоваться в стрелочных функциях:
const last = <T>(coll: T[]): T => coll.at(-1);Теперь попробуем реализовать такое же поведение на обычных функциях. Для этого нам придется создать по одной функции для каждого типа. Причем имя функции должно быть уникальным:
function lastForNumberType(coll: number[]): number {
return coll.at(-1);
}
function lastForStringType(coll: string[]): string {
return coll.at(-1);
}
// Тут определения для всех остальных типовА что если у нас несколько типов? Тогда нужно подсчитать, сколько функций нужно определить — умножить количество всех возможных типов на количество параметров типа.
Реализация с помощью перегруженной функции упрощает задачу. При работе с ними нам не придется создавать новые имена:
function last(coll: number[]): number;
function last(coll: string[]): string;
// Тут определения для всех остальных типов
function last(coll: any[]): any {
return coll.at(-1);
}В случае TypeScript даже логика не будет дублироваться, но это особенность именно TypeScript. В других статически типизированных языках придется дублировать и логику тоже.
Какой бы вариант реализации мы ни выбрали, соблюдаются две вещи:
- Передаваемые внутрь значения никак не используются, они только перекладываются из одного места в другое
- Логика работы всегда остается одной и той же, условные конструкции по типу данных отсутствуют
В Computer Science есть один важный термин — параметрический полиморфизм. Это свойство функции, позволяющее обрабатывать значения разных типов одним способом, используя один алгоритм. Это значит, что дженерики — это реализация параметрического полиморфизма в TypeScript.
Параметрический полиморфизм играет важную роль в статически типизированных языках, потому что там приходится явно указывать типы у функций. Он есть почти во всех высокоуровневых статически типизированных языках. В Java и C# это тоже называется дженериками. В C++ используется термин «шаблоны», но смысл от этого не меняется, хотя шаблоны в С++ — это больше, чем параметрический полиморфизм.
В противовес статически типизированным языкам есть JavaScript, Python, Ruby, PHP и другие языки с динамической типизацией. В них дженерики не нужны. В подобных языках любой обобщенный алгоритм автоматически работает для всех типов данных.
Задание
Реализуйте описание обобщенного типа MyArray, который представляет аналог массива из JavaScript. Пример использования объекта этого типа:
const coll: MyArray<number> = ...;
coll.push(1); // 1
coll.push(10); // 2
coll.push(99); // 3
const newColl = coll.filter((value) => value % 2 == 0);
console.log(newColl.items); // [10]Тип включает в себя два метода: push() и filter(). push() принимает значение того же типа, что и элементы коллекции — в отличие от метода Array, примем соглашение, что параметр только один. filter() принимает колбек с такими же параметрами, как у одноименного метода Array: value, index и array. Данные внутри должны храниться в свойстве items.
А вот возвращаемые значения совпадают не полностью. push(), как и в Array, возвращает новую длину коллекции. filter() же возвращает не массив, а новую коллекцию типа MyArray<T> — поэтому в примере выше у результата фильтрации есть свойство items.
Полезное
Ваше упражнение проверяется по этим тестам
import { expect, expectTypeOf, test } from "vitest";
import type MyArray from "./index";
test("MyArray", () => {
const coll: MyArray<number> = {
items: [],
push(value) {
return this.items.push(value);
},
filter(callback) {
const newItems = this.items.filter(callback);
return { ...this, items: newItems };
},
};
expect(coll.push(1)).toBe(1);
expect(coll.push(2)).toBe(2);
expect(coll.push(5)).toBe(3);
expectTypeOf(coll.push).parameters.toEqualTypeOf<[number]>();
expectTypeOf(coll.push).returns.toEqualTypeOf<number>();
expectTypeOf(coll.filter).parameters.toEqualTypeOf<
[(value: number, index: number, array: Array<number>) => boolean]
>();
expectTypeOf(coll.filter).returns.toEqualTypeOf<MyArray<number>>();
const coll1: MyArray<string> = {
items: [],
push(value) {
return this.items.push(value);
},
filter(callback) {
const newItems = this.items.filter(callback);
return { ...this, items: newItems };
},
};
expectTypeOf(coll1.push).parameters.toEqualTypeOf<[string]>();
expectTypeOf(coll1.filter).returns.toEqualTypeOf<MyArray<string>>();
});Решение учителя откроется через:
20:00
