Стоит ли Typescript усилий?
Typescript — это скриптовый язык, компилируемый в JavaScript. Разработка Microsoft, которая, на сегодняшний день, успела завоевать и фанатов и недоброжелателей. Главный вопрос для начинающих, и не только: «Зачем он мне нужен?».
Поскольку статей, описывающих достоинства и недостатки, описание языка и примеры работы — валом, я хотел бы описать практические выводы при работе в достаточно крупном приложении.
Начнем с основных плюсов:
Строгая типизация
Позволяет более полно описывать свойства и методы обьектов и классов, из-за чего пропадает необходимость, которая, лично меня, дико раздражала, делать проверку всех, входящих в метод или функцию, аргументов:
В любом случае, TypeScript сильно упрощает этот процесс:
И мы плавно перейдем ко второму пункту, которому первый сильно способствует:
Читабельность кода
Из примера выше, очевидно, что читать код на TypeScript будет проще, ввиду отсутствия нагромождений кода, характерные Javascript.
Можно представить, во что превратится код, написанный на JavaScript, спустя какое-то время…
В некоторых случаях, в JS, можно уменьшить ущерб путем абстракций, но в целом, TS сильно впереди по данному вопросу.
Более легкий переход в мир JS из мира статики
Многие проявляют интерес к JS, но их отпугивает некая хаотичность и непредсказуемость языка. Здесь Вам сильно поможет TS, который позволяет писать JS, более привычным и понятным путем.
Обратная совместимость с JS
И это, таки, приятный бонус, потому как не придется переписывать весь существующий код, чтобы поиграться с TS и написать лишь часть приложения на нем + есть возможность перенести все любимые библиотеки с JS на TS, если будет такая необходимость.
Широкая поддержка IDE
TypeScript, на данный момент, имеет поддержку в любой популярной IDE, включая IDEA, WebStorm, Sublime, Atom, и так далее. Соответственно, менять любимую среду разработки не придется.
Теперь опишем основные минусы:
Строгая типизация
Этот пункт работает как во благо, так и во вред, потому что необходимо описывать все типы для всех обьектов, классов, переменных, и иже с ними, что было не свойственно JavaScript ранее.
Компилятор
Он существенно уменьшает вероятность «тупой» ошибки, типа пропущенных запятых и неправильно написанных имен переменных, но, также, убивает всю прелесть JS, когда большую часть решений можно было написать на коленках и проверить в консоли браузера.
Не стоит забывать, что время от времени, придется обновлять и сам компилятор, поскольку язык развивается и, рано или поздно, появится необходимость обновить существующую версию компилятора, а, возможно, и самого кода.
Debug
Естественно, любому разработчику необходимо понимать, как, быстро и эффективно, проверять код на ошибки, ловить и исправлять баги. И, первым делом, надо разобраться, как это процесс наладить в TypeScript. Существует множество гайдов для различных IDE: WebStorm и Visual Studio о том, как все это дело настроить в редакторах кода и эффективно работать, но с JS этого делать не надо было, потому как, можно было запустить код, наставить точек останова внутри редактора или браузера и спокойно дебажить. С TS придется немного попотеть.
А вдруг помрет?
Это интересный и серьёзный вопрос, потому как стандарты JS идут в ногу со временем и интегрируют в сам язык многое, что было полезно в TS: классы, стрелочные функции, и так далее. Рано или поздно, все полезные функции TS будет так или иначе перенесены в стандарт языка и TS повесит бутсы на гвоздь. А если ребята из Microsoft решат, что им это не нужно и полностью оставят TS на волю open-source? Понятно, что являясь открытым продуктом, TS не лишиться поддержки совсем — всегда найдутся энтузиасты, но поддержка такого гиганта, как Microsoft, никогда не помешает.
Опять же сам Microsoft, как основного разработчика, многие относят к минусу, потому как репутация у гиганта весьма спорная: Skype, Nokia, Windows Phone, Windows Vista, и так далее.
Надеюсь, что помог кому-то с решением о данном вопросе, либо же заставил задуматься о целесообразности перехода.
Почему вам стоит использовать TypeScript
Если вы еще не в курсе: JavaScript победил. На сегодняшний день это самый кроссплатформенный язык, доступный для любых устройств. На нем можно создавать веб-приложения (клиент и сервер), в том числе с оффлайн-режимом работы, десктопные приложения (для Windows 8), приложения для смартфонов и планшетов (PhoneGap), расширения для Microsoft Office, SharePoint и Dynamics. Код на JavaScript работает в СУБД, таких как MongoDB и даже Hadoop в Windows Azure (BigData однако).
На Javascript уже написаны Doom и эмулятор Linux. Фактически решая любую задачу, кроме написания модуля ядра ОС, вы встретитесь с JavaScript. Если вы еще не знаете JavaScript, то вам следует срочно начать его изучать.
У JavaScript много недостатков
Многие разработчики испытывают такую реакцию на JavaScript:
Большую часть людей пугает отсутствие intellisense при наборе кода и манипуляции с HTML\CSS. Но это не самые большие проблемы.
Самая большая проблема JavaScript в том, что его придумал не Microsoft.
Основные недостатки JavaScript:
Для того чтобы не писать JavaScript были созданы компиляторы Java –> JavaScript, C# –> JavaScript, LLVM –> JavaScript. Но все это приводит к тому, что на программу на исходном языке накладываются существенные ограничения, а также существующие библиотеки для JavaScript не используются.
TypeScript исправляет часть недостатков
Microsoft, посмотрев на эту картину, решил что нужен язык, который с одной стороны исправляет проблемы, с другой стороны максимально близок к JavaScript, чтобы использовать существующие наработки.
Так и появился язык TypeScript (ссылка на оффсайт). TypeScript является надмножеством JavaScript. То есть любой корректный код на JavaScript также является корректным кодом на TypeScript.
TypeScript использует статическую типизацию, то есть все типы проверяются при компиляции. Кстати сам компилятор TypeScript написан на TypeScript и является open source (ссылка на репозитарий).
TypeScript добавляет возможность объявлять модули, классы и интерфейсы. Это позволяет масштабировать разработку сложных JavaScript приложений.
На выходе получается обычный JavaScript, который не требует дополнительных библиотек или специальных компонентов.
TypeScript в действии
При наборе кода в VisualStudio доступна богатая подсказка:
Поддерживаются классы, аннотации и вывод типов, работает интерактивная отладка.
С легкостью можно использовать в TypeScript внешние библиотеки, например jquery:
При несовпадении типов компилятор ругается:
Компиляция TypeScript происходит при сборке проекта, проверяя многие ошибки без запуска.
Ну и самая главная фича, от вида которой я чуть не расплакался:
Кто еще не до конца вдохновился может глянуть на raytracer на TypeScript, результат работы.
Как начать использовать TypeScript
Слева код на TypeScript, справа результат компиляции на JavaScript. Таким образом использование TypeScript поможет вам лучше понять и изучить JavaScript.
Тем, кто не использует visual studio, повезло чуть меньше. На сегодня доступны плагины для распространенных текстовых редакторов, а также инструменты командной строки.
Далее вам следует обязательно прочитать туториалы от настоящего папы, иногда стоит заглядывать в спецификацию.
Можество определений типов для популярных библиотек можно найти в проекте DefinitelyTyped. Судя по нику автора проекта это наш соотечественник.
Вводный курс по TypeScript
Авторизуйтесь
Вводный курс по TypeScript
TypeScript — это расширенная версия JavaScript, главной целью которого является упрощение разработки крупных JS-приложений. Этот язык добавляет много новых принципов — классы, дженерики, интерфейсы, статические типы, что позволяет разработчикам использовать разные инструменты, такие как статический анализатор или рефакторинг кода.
Стоит ли использовать TypeScript?
В первую очередь возникает вопрос: а какие преимущества у этого языка?
В каких случаях стоит использовать TypeScript?
Хоть выше были приведены достаточные аргументы к использованию этого языка, TypeScript не является универсальным решением. В каких же случаях лучше всего подходит этот язык?
Установка TypeScript
Установить TypeScript совсем не сложно — достаточно загрузить его через пакетный менеджер npm и создать TypeScript-файл:
После его установки можно сразу перейти к рассмотрению возможностей этого языка и его синтаксиса.
Типы переменных
Number
Все числовые переменные в TypeScript существуют в виде числа с плавающей запятой. Числовой тип получают даже двоичные и шестнадцатеричные числа:
String
Как и другие языки, TypeScript использует тип String для хранения текстовой информации:
Можно создавать и многострочные переменные, а также в строки можно вставлять выражения, если выделить строку символами « :
Boolean
Куда же без одного из основных типов данных:
Присвоение типов
Одиночный тип переменной
Простой пример, где присваивается значение переменной типа String :
Такой способ действителен для всех типов данных.
Мультитип переменной
В коде выше переменной назначается два типа: строчный и численный. Теперь переменной можно присваивать как текстовые данные, так и числовые.
Проверка типов
Ниже будут описаны два основных (на деле их существует больше) способа проверки типа переменной.
Typeof
Команда typeof работает только с базовыми типами данных. Это означает, что эта команда может определить только типы, описанные выше.
Instanceof
Тип Assertions
Иногда приходится преобразовывать (кастовать) переменную одного типа в другой тип. Особенно часто это случается, когда переменную типа any (или другого произвольного типа) нужно передать в функцию, которая принимается аргумент определённого типа.
Существует много решений этой задачи, но ниже будут описано два самых популярных из них.
Ключевое слово as
Чтобы кастовать переменную, нужно после оператора as написать тип, в который переводится переменная.
Оператор <>
Этот код работает идентично предыдущему — разница только синтаксическая.
TypeScript: как с ним работать и чем он отличается от JavaScript
Frontend-разработка шагнула далеко за пределы JavaScript. Разбираемся, что такое TypeScript и почему его так любят.
На JavaScript написаны веб-интерфейсы практически всех сайтов. Однако не все его любят, а альтернатив почти нет. Единственный конкурент JS — WebAssembly, однако за несколько лет своего существования он пока не смог стать достаточно популярным.
Из-за такого расклада у разработчиков остаётся два выхода:
И многие выбирают второе решение. Поэтому за последние годы появилось сразу несколько языков-надстроек над JavaScript:
О последнем и пойдёт речь в этой статье. В 2019 году TypeScript стал одним из самых любимых языков программирования и попал в топ-10 по популярности:
Пишет о программировании, в свободное время создает игры. Мечтает открыть свою студию и выпускать ламповые RPG.
Что такое TypeScript
TypeScript — это язык программирования, в котором исправлены многие недостатки JavaScript. Код на TypeScript выглядит почти так же, как и код на JS, и, если у вас есть опыт frontend-разработки, изучить TypeScript достаточно просто. Особенно учитывая, что вы можете писать JS-код прямо в TS-скриптах.
Код на TypeScript компилируется в JS и подходит для разработки любых проектов под любые браузеры — тем более что можно выбрать версию JS, в которую будет компилироваться код.
TypeScript — проект с открытым исходным кодом, поэтому он очень быстро развивается. Многое, что появляется в TS, позже переходит и в JavaScript: например, let и const, стрелочные функции и так далее.
Давайте разберём два главных преимущества TS перед JS.
Строгая типизация
Многие проблемы в JavaScript появляются из-за динамической типизации и в целом странного поведения типов данных:
В TypeScript типизация статическая, что избавляет от множества проблем. Есть числовой тип, строковый, логический и другие. Возможно описывать и свои типы данных, например, с помощью enum:
Улучшенное ООП
И в JS, и в TS есть поддержка объектно-ориентированного программирования: классы, объекты, наследование. Однако TypeScript шагнул чуть дальше и использует больше возможностей ОПП. В том числе, например, интерфейсы:
Другой большой плюс — модификаторы доступа. Их в TypeScript три: public, private и protected. Вот пример их использования:
Также есть и другие возможности:
В будущем всё это может появиться и в JavaScript, но браузеры начнут поддерживать такие возможности ещё очень нескоро.
Минусы TypeScript
Разработчики любят этот язык, а некоторые крупные проекты уже переходят на него. Например, популярный фреймворк Angular.JS. Но этого всё равно недостаточно, чтобы он стал таким же востребованным, как JavaScript. Это связано с тем, что разработка веб-приложения на TypeScript стоит дороже и отнимает больше времени.
Особенно если необходимо использовать какую-нибудь библиотеку или фреймворк, которые не портированы на TS. В этом случае разработчикам придётся самостоятельно описывать сигнатуры (указывать типы данных) всех функций и методов — достаточно длительный процесс, учитывая размеры современных библиотек.
Также порог входа в TypeScript выше — чтобы использовать его преимущества, важно знать типы данных и объектно-ориентированное программирование.
Установка TypeScript
Чтобы использовать TypeScript, установите сначала Node.JS. Как это сделать, можете прочитать в нашей статье. После этого введите в консоли команду:
Если всё пройдёт успешно, то в папке появится файл app.js, который и подключим к странице.
В compilerOptions хранятся все параметры для компилятора:
Пишем приложение на TypeScript
Теперь создадим простой калькулятор и посмотрим, как отличается код для него на JS и на TS. Сначала сверстаем форму:
Здесь два поля для ввода чисел, кнопка, которая запускает скрипт и элемент для вывода результата:
Код TypeScript выглядит так:
А скомпилированный JS-код для такого калькулятора выглядит вот так:
Заключение
Несмотря на то что в TypeScript очень достойный синтаксис, JavaScript ещё долго будет доминировать во frontend-разработке. Поэтому его в любом случае нужно знать, даже если он вам не нравится.
Если вы только приступаете к изучению программирования, то начинать с TypeScript будет сложно. Чтобы подготовиться, вы можете записаться на наш курс по frontend-разработке — вы освоите HTML, CSS, JS и его популярные фреймворки.
Действительно ли нам нужен TypeScript в 2020?
TypeScript стал одним из необходимых навыков для современного веб разработчика. В 2019 он вошел в ТОП-10 наиболее используемых языков на GitHub, его поддержку полностью добавили в Create react app, и можно найти массу других свидетельств роста его популярности. В то же время такие языки, как Java и C продолжают сдавать позиции.
Когда мы говорим о преимуществах TypeScript, на ум обычно приходит следующий список:
Помня об этом, давайте выясним, как TypeScript может помочь нам улучшить нашу продуктивность и эффективность.
Статическая типизация — волшебная таблетка от багов?
Главная фича TypeScript — поддержка статической типизации. Среди разработчиков распространено убеждение, будто динамическая типизация — источник чуть ли не всех проблем JavaScript разработчиков.
Я гадаю, что плохого люди находят в динамической типизации? Почему на другие динамические языки, например, Python и Ruby, не обрушивается такой шквал критики? Могу лишь предполагать, что проблема не столько в динамической типизации, сколько в приведении типов в JavaScript. Действительно, иногда может очень неприятно удивить код типа такого:
Но это проблема скорее плохого знания JavaScript, а не самого языка. Представьте, что у вас есть мощная спортивная машина. Но ваши водительские навыки достаточно посредственные. Вы будете требовать от производителя машины внести изменения, чтобы уменьшить максимальную скорость машины или научитесь продвинутому вождению и станете выдающимся профессионалом? То, что предлагает нам TypeScript — ограничить возможности динамической типизации вместо того, чтобы как следует выучить JavaScript.
Еще один вопрос к противникам динамической типизации — если статическая типизация так хороша, почему мы все еще встечаем баги в коде, написанном на Java и C#? Да, мы можем отловить эти ошибки на этапе компиляции, но, давайте будем честны, этого недостаточно. Мы должны следовать SOLID принципам и другим лучшим практикам, чтобы обеспечить качественный код. И снова — это относится в большей степени к знаниям и квалификации программистов, чем к языку программирования.
Действительно ли легче читается TypeScript код?
Приведу 2 примера Redux Thunk:
и тоже самое на TypeScript:
Что значат все эти дженерики? Зачем в них 2 пустых объекта? Сколько времени мы должны потратить на чтение документации, чтобы во всем этом разобраться? Хорошо, это еще нормально для Redux Thunk, поскольку это очень популярная middleware для Redux, у них отличная команда поддержки и документация. Но что, если нам придется поддерживать код, который не имеет всего этого?
Больше не будет трудноуловимых багов?
В предыдущем примере Вы увидели, как TypeScript делает код более многословным. Как известно, чем больше и сложнее система — тем больше вероятность ошибки. Помимо тех ошибок, которые мы могли допустить в JavaScript коде, мы должны еще следить за тем, чтобы не сделать опечатку в интерфейсах, ошибку в дженериках, и т.д. Справедливости ради стоит заметить, что компилятор поможет быстро найти и исправить такие ошибки, но без TypeScript мы бы вообще с ними не столкнулись.
Следование лучшим практикам ООП
Как мы знаем, мы должны следовать лучшим практикам, если хотим писать качественный, легко масштабируемый и поддерживаемый код. И TypeScript может нам в этом помочь. Звучит отлично, давайте рассмотрим пример из Express:
Первое, что бросается в глаза — опять пишется больше кода. Мы используем классы, чтобы писать в ООП стиле. Нам придется потом создавать экземпляры этих классов. В добавок, мы можем использовать интерфейсы, статические типы и другие конструкции. И чтобы это все не превратилось в полнейший хаос, нам не остается ничего, кроме как использовать best practices. И это то, что называется: «поощрение разработчиков к использованию лучших ООП практик».
Когда разработчики проголосовали за простые, гибкие и динамичные языки, такие как JavaScript и Python, когда парадигма функционального программирования показала свои преимущества и способность решать некоторые задачи более изящно и эффективно (и в JavaScript мы можем использовать оба подхода), TypeScript подталкивает нас к тому, чтобы писать код по-старинке в стиле ООП Java и C#.
Подводя итог, мы увидели, что TypeScript в действительности не экономит наше время, он ни защищает нас от большого количества багов, ни увеличивает нашу производительность. Более того, он требует написания большего количества кода, дополнительной конфигурации, type definition файлов, траты времени на чтение дополнительной документации. Новичок скорее напишет, может, не идеальное, но работающее приложение на JavaScript или Ruby, пока мы будем писать отличное TypeScript приложение в соотвествии со всеми принципами. А потом он наймет нас переписывать его стартап, где мы сможем использовать TypeScript, чтобы сделать все правильно.
Забавно видеть, как массивные, многословные и усложненные языки уходят, не выдержав конкуренции с более динамичными и простыми, а затем последние отказываются от всего, что помогло им так быстро развиться, и стремяться стать тяжеловеснее, многословнее и сложнее.
Окей, мы больше не хотим Java, хотим JavaScript. Но нам не нравится JavaScript таким, как он есть, поэтому давайте сделаем его немножечко более похожим на Java. Отлично, теперь у нас есть все, что было в Java, при этом это не Java. Погнали!