Типизация TS
Tags: typescript, javascript, webdev, beginners
Published: 2023-04-23 12:06:26



**Явное присваивание**
Типы в TypeScript объявляются следующим синтаксисом:
`переменная: тип = значение`
Мы можем присвоить любой тип, который есть в JavaScript:

```
const foo: string = '12rock';
const bar: number = 123;
const fee: boolean = true;
```
**Неявное присваивание**
Однако, TypeScript сам умеет определять типы. Если мы объявим переменную и сразу присвоим ей значение, то TypeScript все поймет и запись с двоеточием можно будет опустить:

```
const foo = '12rock'; //TS сам поймет что здесь храняться только строки
const bar = 123; // TS поймет что числа
const fee = true; // TS поймет что булевы значения
```
**Объединение**
Типы можно объединять, сам процесс так и называется объединение. Записывается он так:
`переменная: тип1 | тип2 = значение;`
На данный код внизу компилятор не выдаст ошибку:

```
let foo: number | string = 123;
foo = '123';
```
**Встроенные типы и неявная типизация**
_Вопрос_: Но как типизировать переменную, которая например содержит дату? Что нам с ней делать?!

_Ответ_: Для таких случаев в TypeScript уже существуют встроенные типы из JavaScript.

Мы можем объявить дату вот так:
`const date: Date = new Date;`
Встроенных типов очень много, поэтому TypeScript может определять тип без явного указания.
Как это работает? Просто инициализируйте переменную, при инициализации TypeScript сам подберет нужный тип.
`const date = new Date;`
**Типизация функций**
Нам нужно типизировать входные и данные и данные которые нам функция отдает (выходные): 
`function имя(параметр: тип, параметр: тип, ...): тип выходного значения {}`
Рассмотрим пример, где функция принимает два аргумента и отдает нам их сумму:

```
function getSum(a: number, b: number): number {
return a + b;
}
```

**Дженерики**
Дженерик - Array<number> - указываем Array и в треугольных скобках то, из чего может состоять данный класс или объект.

**Массив из разных типов**
Тип данных Tuple, где мы можем указать из какого множества типов он состоит, например: const contact: [string, number] = ['Michael', 46570294]

**Тип _never_ **
Используется в тех случаях когда функция может никогда не закончится (странный тип, пригодиться наверное не часто, но нужно про него знать)

**Type**
Также можно создавать свои типы через ключевое слово `type`, пример: 

`
type Login = string;
const login: Login = 'qwerty'
`
также можно указывать через бинарный оператор "|" ИЛИ какими типами может быть переменная: 

`
type Login = number | string;
`

**Типы `null` и `undefined`**
Обычно записывается в проектах так:
`type Name = string | null | undefined`

**Interfaces**
Поля в интерфейсах могут быть только читаемые (`readonly id: number`), неизменяемые. Также свойства могут быть необязательными (`color?: string`). Пример:

```
interface Rect {
 readonly id: string
 color?: string
 size: {
   width: number
   height: number
 }
}
```
применение типа:

```
const rect1: Rect = {
 id: '1234',
 size: {
  width: 30,
  height: 20
 },
color: '#fff'
}

```

Интерфейсы часто называют с первой большой буквой "I", чтобы было понятно что это интерфейс. Интерфейсы могут наследоваться:

```
interface RectWithArea extends Rect {
  getArea: () => number
}

const rect5: RectWithArea = {
  id: '123',
  size: {
    width: 20,
    height: 20
  },
  getArea(): number {
    return this.size.width * this.size.height
  }
}
```




> _большая часть информации взятая [отсюда](https://vc.ru/dev/423888-krupnyy-gayd-po-typescript) 
> автор: Даниил Шило_