Основы TypeScript: типы, интерфейсы, generics

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

1. Типы в TypeScript

Основные типы

Пример

let age: number = 30;
let name: string = "John";
let isActive: boolean = true;

2. Массивы:

   • Используйте type[] или Array<type>.

   Пример

   typescript

   let numbers: number[] = [1, 2, 3];
   let strings: Array<string> = ["a", "b", "c"];
   

3. Кортежи (Tuple):

   • Фиксированное количество элементов разного типа.

   Пример

   typescript

   let tuple: [string, number] = ["Alice", 25];
   

4. Тип any:

   • Может содержать значения любого типа. Рекомендуется использовать осторожно.

   Пример

   typescript

   let variable: any = "Hello";
   variable = 42;
   

5. Тип unknown:

   • Более безопасная альтернатива any, требует проверки типа перед использованием.

   Пример

   typescript

   let value: unknown = "Hello";
   if (typeof value === "string") {
     console.log(value.toUpperCase());
   }
   

2. Интерфейсы

Что такое интерфейсы?

Объявление интерфейсов

Пример

const user: User = { id: 1, name: "Alice", };

<h3 id="интерфейсы-для-функций">Интерфейсы для функций</h3>
Интерфейсы также могут описывать функции.
<h4 id="пример">Пример</h4>
```typescript
interface AddFunction {
  (a: number, b: number): number;
}

const add: AddFunction = (x, y) => x + y;

Наследование интерфейсов

Пример

interface Employee extends Person { employeeId: number; }

const employee: Employee = { name: "John", employeeId: 123, };

---

<h2 id="3-generics-обобщения">3. Generics (Обобщения)</h2>

<h3 id="что-такое-generics">Что такое generics?</h3>
Generics позволяют создавать компоненты, которые работают с разными типами данных, сохраняя строгую типизацию.

<h3 id="пример-с-функцией">Пример с функцией</h3>
```typescript
function identity<T>(value: T): T {
  return value;
}

console.log(identity<number>(42)); // 42
console.log(identity<string>("Hello")); // Hello

Generics в интерфейсах

Пример

<h3 id="ограничения-типов-type-constraints">Ограничения типов (Type Constraints)</h3>
Generics можно ограничивать определённым типом.
<h4 id="пример">Пример</h4>
```typescript
function getLength<T extends { length: number }>(value: T): number {
  return value.length;
}

console.log(getLength("Hello")); // 5
console.log(getLength([1, 2, 3])); // 3