# Why TypeScript

Чому TypeScript?

Існує два головних бонуса TypeScript:

* Надає систему типів *optional type system* для JavaScript.
* Надає функціональность, яка буде втілена JavaScript в наступних версіях на основі сучасного JavaScript

Ці бонуси повинні мотивувати вас на навчання.

## The TypeScript type system

Система типів в TypeScript

Ви можете бути здивовані "**Навіщо додавати типи в JavaScript?**"

Використання типізації може суттєво покращити якість вашего коду та зробити його набагато стабільним. Великі команди (Google, Microsoft, Facebook) постійно приходили до цього висновку. Зокрема:

* Типи підвищують вашу спритність під час виконання рефакторингу. *Для компілятора краще виловлювати помилки, ніж мати збій під час виконання*.
* Типізація це одна з найкращих форм створення документації які існують. *Сигнатура функції — це теорема, а тіло функції — доказ*.

Однак типи мають манеру бути надмірно церемоніальними. TypeScript робить бар’єр входу якомога нижче. Ось як:

### Your JavaScript is TypeScript

Ваш JavaScript це TypeScript.

TypeScript забезпечує безпеку типу під час компіляції для вашого коду JavaScript. Це не дивно, враховуючи його назву. Чудово те, що типи абсолютно необов’язкові. Ваш JavaScript код в файлі `.js` може бути перетворений на файл `.ts` и TypeScript зможе повернути вам все ще коректний `.js` еквівалент початкового JavaScript файла. TypeScript це *новий поверх* над JavaScript з опціональною перевіркою типів.

### Types can be Implicit

Типи можуть бути неявними.

TypeScript намагатиметься вивести якомога більше інформації про тип, щоб забезпечити вам безпеку типу з мінімальними витратами продуктивності під час розробки коду. Наприклад, цей приклад TypeScript знає, що "foo" має тип `number` та поверне помилку:

```ts
var foo = 123;
foo = '456'; // Error: cannot assign `string` to `number`

// Is foo a number or a string
```

Така поведінка є досить корисною. Якщо ви робите щось, як показано в цьому прикладі, тоді в решті вашого коду, ви не можете бути впевнені `foo`є `number` чи `string`. Ця проблема більш типова для проекту з великою кількістю файлів. Більш детально ми зануримося в цю тему далі.

### Types can be Explicit

Типи можуть бути неявними.

Як ми відмітили раніше, TypeScript намагається зробити код найбільш безпечним. Однак ви можете використовувати анотації, щоб:

1. Допомогти компілятору та, що важливіше, задокументуйте матеріал для наступного розробника, який має прочитати ваш код (це, можливо, будете і ви в майбутньому!).
2. Забезпечити те, що компілятор бачить, те, що ви думали, що він повинен бачити. Тобто ваше розуміння коду відповідає алгоритмічному аналізу коду (здійсненому компілятором).

TypeScript використовує анотації типів постфіксів, популярні в інших *опціонально* анотованих мовах (наприклад, ActionScript і F#).

```ts
var foo: number = 123;
```

Якщо ви робите щось не вірно, компілятор видать помилку:

```ts
var foo: number = '123'; // Error: не можу ініціалізовани числову змінну строкою
```

Ми обговоримо всі деталі синтаксісу анатацій, які підтримує TypeScript в наступних главах.

### Types are structural

Типи є структурними.

У деяких мовах (зокрема, номінально типізованих) статичне введення призводить до непотрібної церемонії, оскільки навіть якщо *ви знаєте*, що код працюватиме добре, семантика мови змушує вас копіювати щось навколо. Ось чому такі речі, як [automapper для C#](http://automapper.org/) є *життєво важливими* для C#. У TypeScript ми дійсно хочемо, щоб розробникам JavaScript було легко з мінімальним когнітивним перевантаженням, типи є *структурними*. Це означає, що *duck typing* (різновид динамічної типізації, застосовуваної в деяких мовах програмування, коли межі використання об'єкта визначаються його поточним набором методів і властивостей, на противагу успадкуванню від певного класу) є першокласною мовною конструкцією. Розглянемо наступний приклад. Функція `iTakePoint2D` прийме все, що містить усе те, що вона очікує (`x` і `y`):

```ts
interface Point2D {
    x: number;
    y: number;
}
interface Point3D {
    x: number;
    y: number;
    z: number;
}
var point2D: Point2D = { x: 0, y: 10 }
var point3D: Point3D = { x: 0, y: 10, z: 20 }
function iTakePoint2D(point: Point2D) { /* do something */ }

iTakePoint2D(point2D); // exact match okay
iTakePoint2D(point3D); // extra information okay
iTakePoint2D({ x: 0 }); // Error: missing information `y`
```

### Type errors do not prevent JavaScript emit

Помилки типу не перешкоджають роботі JavaScript.

Щоб вам було легше перенести ваш код JavaScript на TypeScript, навіть якщо є помилки компіляції, за замовчуванням TypeScript *видасть дійсний JavaScript* в найкращому можливому варіанті.

```ts
var foo = 123;
foo = '456'; // Error: не можу ініціалізовати числовую переменную строкою
```

буде конвертовано в працюючий js:

```ts
var foo = 123;
foo = '456';
```

Тож ви можете поступово оновлювати свій код JavaScript до TypeScript. Це дуже відрізняється від роботи багатьох компіляторів інших мов і є ще однією причиною переходу на TypeScript.

### Types can be ambient

Основною метою розробки TypeScript було зробити можливим безпечне та просте використання існуючих бібліотек JavaScript у TypeScript. TypeScript робить це за допомогою *declaration*. TypeScript надає вам гнучку шкалу того, скільки зусиль ви хочете докласти до ваших декларацій, що більше зусиль ви докладете, то більше безпеки типів + коду ви отримаєте. Зауважте, що [спільнота DefinitelyTyped](https://github.com/borisyankov/DefinitelyTyped) уже написала визначення для більшості популярних бібліотек JavaScript, які покривають більшості цілей:

1. Файл визначення вже існує.
2. Або, принаймні, у вас є широкий список добре перевірених шаблонів декларацій TypeScript, які вже доступні

Як короткий приклад того, як ви створили б власний файл декларації, розглянемо тривіальний приклад [jquery](https://jquery.com/). За замовчуванням (як і слід очікувати від хорошого коду JS) TypeScript очікує, що ви оголосите (тобто використаєте десь `var`) перед використанням змінної

```ts
$('.awesome').show(); // Error: cannot find name `$`
```

Як швидкий фікс *ви можете сказати TypeScript* що це є дещо з назвою `$`:

```ts
declare var $: any;
$('.awesome').show(); // Okay!
```

Якщо ви хочете, ви можете спиратися на це базове визначення та надати більше інформації, яка допоможе захистити вас від помилок:

```ts
declare var $: {
    (selector:string): any;
};
$('.awesome').show(); // Okay!
$(123).show(); // Error: повинно бути типу string
```

Ми детально обговоримо деталі створення визначень TypeScript для існуючого JavaScript пізніше, коли ви дізнаєтесь більше про TypeScript (наприклад, такі речі, як `interface` і `any`).

## Future JavaScript => Now

Майбутній JavaScript => Зараз.

TypeScript надає низку функцій, запланованих у ES6 для поточних механізмів JavaScript (які підтримують лише ES5 тощо). Команда TypeScript активно додає ці функції, і цей список з часом лише розширюватиметься, і ми розглянемо це у окремому розділі. Але як зразок ось приклад класу:

```ts
class Point {
    constructor(public x: number, public y: number) {
    }
    add(point: Point) {
        return new Point(this.x + point.x, this.y + point.y);
    }
}

var p1 = new Point(0, 10);
var p2 = new Point(10, 20);
var p3 = p1.add(p2); // { x: 10, y: 30 }
```

та він підтримує виконистання функції-стрілки:

```ts
var inc = x => x+1;
```

### Summary

У цьому розділі ми надали вам мотивацію та цілі розробки TypeScript. Подолавши це, ми можемо копатися в дрібницях TypeScript. \[]\(Interfaces are open ended) \[]\(Type Inference rules) \[]\(Cover all the annotations) \[]\(Cover all ambients : also that there are no runtime enforcement) \[]\(.ts vs. .d.ts)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://artfulbits-se.gitbook.io/typescript/getting-started/why-typescript.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.