Початок роботи з TypeScript

текст перекладу

Вступ до TypeScript

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

pic

Потрібність TypeScript

JavaScript — це слабо типізована мова. Іноді важко зрозуміти, які типи даних передаються в JavaScript.

У JavaScript параметри функцій і змінні не мають жодної інформації! Тому розробники повинні звертатися до документації або здогадуватися на основі реалізації.

TypeScript дозволяє визначити типи даних, які передаються в коді, і має можливість повідомляти про помилки, коли типи не співпадають.

Наприклад, TypeScript повідомить про помилку, коли передавати рядок у функцію, яка очікує число. JavaScript цього не зробить.

Мій шлях навчання

Я почав вивчати TypeScript на чудовому сайті під назвою Scrimba.
Ось посилання на курс:

[

Навчання TypeScript

Практичний курс, який дасть вам основи TypeScript під час створення реального додатку для кочуючих користувачів.

scrimba.com

](https://scrimba.com/learn/typescript?source=post_page-----20ea25832a7e--------------------------------)

Це чудовий курс з практичним навчанням. Він навчає вас TypeScript з нуля. Деякі попередні вимоги:

Необхідні базові знання з HTML і JavaScript.

Налаштування TypeScript

Встановлення TypeScript:

npm install -g typescript

Це встановлює компілятор TypeScript (tsc), який використовується для перетворення коду TypeScript в JavaScript.

Створення нового проєкту TypeScript:

Створіть нову директорію для вашого проєкту:

mkdir my-typescript-project && cd my-typescript-project

Ініціалізуйте новий проєкт Node.js:

npm init -y

Встановіть TypeScript локально для вашого проєкту:

npm install typescript --save-dev

Створіть файл tsconfig.json:

tsc --init

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

Основні можливості TypeScript

Статична типізація:

TypeScript вводить статичну типізацію, яка допомагає виявляти помилки під час розробки, а не на етапі виконання. Наприклад:

let age: number = 25; let name: string = "John";

Анотації типів:

Ви можете явно визначати типи для змінних, параметрів і значень, що повертаються.

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

Інтерфейси і типи:

Використовуйте інтерфейси або псевдоніми типів для визначення структури об'єкта.

interface Person { name: string;, age: number; }  
const person: Person = { name: "Alice", age: 30, };

Класи та модифікатори доступу:

TypeScript підтримує об'єктно-орієнтоване програмування за допомогою класів і модифікаторів.

class Animal {   
public name: string;  
private age: number;   
constructor(name: string, age: number) {   
this.name = name;   
this.age = age;   
 }   
}

Перелічення (Enums):

Перелічення використовуються для визначення набору іменованих констант.

enum Direction {   
North,   
South,   
East,   
West,   
}   
let dir: Direction = Direction.North;

Загальні випадки використання

Типізація параметрів функцій та значень, що повертаються:

function multiply(a: number, b: number): number {   
return a * b;   
}

Використання інтерфейсів для структури об'єктів:

interface User {   
id: number;   
username: string;   
}   
const user: User = {   
id: 1,   
username: "developer",   
};

Робота з бібліотеками сторонніх розробників:

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

Встановіть визначення типів за допомогою:

npm install @types/library-name --save-dev

Переваги використання TypeScript

  • Виявлення помилок під час компіляції: TypeScript виявляє помилки, пов'язані з типами, під час компіляції, що робить код більш надійним.
  • Краща підтримка інструментів: IDE, такі як VS Code, надають автодоповнення, інструменти для рефакторингу та підказки типів для TypeScript.
  • Покращена читабельність коду: Анотації типів роблять код самодокументованим та легшим для розуміння іншими.

Виклики для початківців

  • Перехід від JavaScript: Розробники, звиклі до JavaScript, можуть спочатку знайти сувору типізацію TypeScript складною.
  • Розуміння складних функцій: Такі концепти, як генерики, об'єднані типи та декоратори, можуть бути заплутаними на початку, але з часом стають зрозумілішими.

Ресурси для вивчення TypeScript

  • Офіційна документація: TypeScript Docs
  • Онлайн-уроки та курси: Вебсайти, такі як freeCodeCamp, Udemy та Codecademy, пропонують чудові курси з TypeScript.
  • Канали на YouTube: Канали, такі як Traversy Media та The Net Ninja, надають безкоштовні уроки з TypeScript.
  • Форуми спільноти: Приєднуйтесь до форумів, таких як Stack Overflow та обговорення на GitHub TypeScript, щоб вчитися від інших.

Курс на YouTube:

Курс для початківців з TypeScript

Висновок

  • TypeScript покращує JavaScript, додаючи статичну типізацію, що робить його потужним інструментом для сучасної розробки.
  • Початківці повинні почати з малих проєктів, щоб практикувати основні концепти, а потім поступово вивчати складніші функції.
  • Пам'ятайте, що шлях до освоєння TypeScript є безперервним — продовжуйте вчитися та експериментувати!

Перекладено з: Getting Started With TypeScript

Leave a Reply

Your email address will not be published. Required fields are marked *