TypeScript
То же самое, что и JS только с типами. Что дают типы? Контроль. Контроль над стабильностью приложения и спасение от преждевременных ошибок. Пока ты пишешь код, опираясь на типы, при ошибках в редакторе тут же будет указано, что используешь неправильно. Полезно, когда кодовая база проекта больше 10к строк кода. И когда пишешь код не в соло.
Где-то даже слышал про такую практику, как прототипирование на типах. То есть ты просто описываешь будущую модель приложения, используя типы как сущности и их возможные взаимодействия друг с другом. Вполне может помочь сэкономить много времени. А потом быстро написать логику поверх моделей.
Нет смысла самому себе показывать синтаксическое отличие TS от JS — я же уже знаю.
Типы
JS-типы: string, number, boolean, bigint, symbol, undefined, null, object, function
TS-типы: any, unknown, void, never и пару дополнительных конструкций использования типов в виде Array, Tuple, Enum.
any- заменяет любой тип и является "богом" всех типов, проходя любые проверки типизации. Но абсолютно убивает смысл существования типов. При разработке с нуля лучше избегать ситуаций его использования, но может быть удобно при внедрении в уже существующий проект на JS для временных решений. Использоватьanyвсегда равносильно тому, что не использовать TS вовсе.unknown- почти тоже самое, что иany. Но не позволяет использовать несуществующие свойства объекта, как any. На самом деле не понимаю, где его использовать, ни разу не видел нигде.never- для функций, которые ничего не возвращают и при этом так же не совершают никаких действий, связанных с приложением. Обычно используются для обработчиков ошибок или функций, завершающих выполнение программы.void- для функций, которые просто ничего не возвращают.
Как типы можно применять
В целом все взаимодействия и условия с типами можно понять, достаточно один раз посмотреть какие они бывают.
type id = string | number — id может быть или строкой, или числом.
type Object = {
first: string
second?: string
}second - опциональный и в объекте может быть не указан.
Как в примере выше типы можно вкладывать в типы и указывать типы для типов (дженерики).
Так же, как и там естьreadonly параметр, который указывает, что данное поле невозможно изменить в будущем, что полезно при создании внешних библиотек или оберток.
Или можно использовать Type Assertion, чтобы явно указать с каким типом используется та или иная переменная. Например:
const canvas = document.getElementById('main-canvas') as HTMLCanvasElementconst canvas = <HTMLCanvasElement>document.getElementById('main-canvas')На данном этапе без as тайпскрипт будет знать только типHTMLElement на основе методаgetElementById() .
А с помощью! в конце переменной можно "крикнуть", что эта переменная не может бытьundefined илиnull :
function f(x?: number | undefined): void {
console.log(x!.toFixed())
}