Возвращение Кукуси #2 или введение в TypeScript ❤️
Всем огромный привет от пропавшей Кукуси ) Классно я вернулась тогда, да? На этот раз всё, теперь я точно снова с вами.
Как я и рассказывала вам уже, у нас в компании есть карьерная лестница с довольно четко описанными требованиями для каждой из её ступеней. И в понедельник утром, я сдала свой первый здешний экзамен и перешла на новый уровень.
Вообще, за эти три месяца нужно было пройти три курса на coursera, которые я могу смело всем советовать. Отличный преподаватель, очень интересные занятия - не слишком длинные, и очень полезные.
Ну и наш учебный проект, который мы будем дорабатывать уже в новой должности, на Angular.
Работая на фрилансе, я в основном использовала фреймворк AngularJS. Angular - это не то же самое, вообще многие называют его Angular 2, но на самом деле, он просто Angular. И я в него влюблена.
Наверняка, найдутся те, кто скажет, что есть что-нибудь покруче, поудобнее. И возможно так оно и есть, но пока я очень довольна этим фреймворком.
Angular написан на TypeScript и поэтому TS - один из основных инструментов работы с Angular.
Сегодня я хочу немного познакомить вас с TypeScriptом.
Я до этого писала целую серию уроков о JS, TypeScript же - надмножество JavaScript, которая решает его недостатки. Например, делает возможной статическую типизацию и использование классов, как это принято в объектно-ориентированных языках программирования. По факту, код, написанный на TypeScript, компилируется в код JS.
Как я уже сказала, TS - язык со статической типизацией, то есть в ходе выполнения программы изменить тип не получится. Это позволяет уменьшить количество ошибок и отловить многие из них еще на этапе компиляции. TS поддерживает все типы, имеющиеся в JavaScript, дополняя их типом перечислений - enum
.
В JavaScript используется прототипное программирование, которое может взорвать мозг любого программиста, не говоря уже о тех, кто писал на С++
, Java
или каком-либо другом традиционном объектно-ориентированном языке программирования. Собственно TypeScript решает и эту проблему.
Давайте вкратце еще расскажу о паре основных понятиях ООП (это был мой самый нелюбимый курс в университете, о чем я сейчас очень жалею).
-
Класс - это описание сущности, где определяется её состояние и поведение, зависящее от этого состояния, а также правила для взаимодействия с данной сущностью (контракт).
С точки зрения программирования класс можно рассматривать как набор данных (полей, атрибутов, членов класса) и функций для работы с ними (методов).
С точки зрения структуры программы, класс является сложным типом данных.
class User {
public name: string;
public printPost (post: {theme?: string, body: string }) {
console.log(post);
}
}
class GolosUser extends User {
public reputation: number;
public printPost (post: { body: string }) {
console.log(this.name, this.reputation);
console.log(post);
}
} -
В TypeScript интерфейсывыполняют функцию именования типов, и являются мощным способом определения соглашений внутри кода, а также за пределами проекта.
Чтобы наглядно показать, как это работает, давайте попробуем разобрать маленький пример:
function printPost(post: { theme: string, body: string }) {
console.log(post.body);
}
let myPost= {theme: "TypeScript", body: "TypeScript - это..."};
printPost(myPost);У нас есть функция
printPost
, которая принимает один параметр -post
, у которого, в свою очередь, требуются два свойства:theme
иbody
, оба - строковые (типаstring
).Этот же код можно переписать следующим образом:
interface IPost{
theme?: string,
body: string
}
function printPost(post: IPost) {
console.log(post.body);
}
let myPost= {body: "TypeScript - это..."};
printPost(myPost);Теперь у нас есть интерфейс
IPost
- это имя можно будет использовать, чтобы задавать требования о том, какие свойства должен иметь объектpost
.Обратите внимание, что в интерфейсе свойство
theme
необязательное.
Для написания этой статьи использовались источники:
Ну а дальше TypeScript будем изучать в паре с Angular... До следующего урока! 😉