Вводный курс по TypeScript


Оглавление (нажмите, чтобы открыть):

[Повтор][javascript.ru]Курс по TypeScript

Тема в разделе «Курсы по программированию», создана пользователем Knayz, 18 июн 2020 .

    li» data-history=»on» >
  • [Повтор][javascri.
  • Отзывы (1)

Статус темы: Закрыта.

  • Инфа полезная, но спикер самый бесячий, каких я только слышал! Куча слов паразитов, много воды, тараторит как из пулемета, и ладно бы он так по делау тараторил, так ведь просто создает видимость умного человека. Вещи нормально не объясняет, просто, по большей части, вбрасывает понятия и еб*сь с этим как хочешь. Сочувствую тем, кто с этим человеком работает. Честно, сколько курсов пересмотрел, но впервый раз такое, что во время просмотра не выдержал и зашел сюда, чтобы высказаться!

    Перевод официальной документации Typescript на русский.

    Почему Typescript?

    Typescript — это не «еще один язык программирования». В двух словах — это просто надмножество Javascript (ES6) с опциональной статической типизацией. Именно эти две особенности позволяют создавать масштабные приложения, сохраняя качество и упрощая разработку.

    Начать просто.

    Для того, чтобы начать писать на Typescript, не нужно читать весь этот учебник. Достаточно установить и можно сразу писать на том же Javascript’е, к которому вы привыкли. Потому что Typescript — это всего лишь расширение существующего стандарта. Постепенно добавляйте типы и другие удобные особенности в свое приложение по мере изучения руководства и вы почувствуете его преимущество.

    А он точно хорош? Появился то недавно.

    Курс по TypeScript

    serafim

    Житель Разулы

    Программа
    TypeScript увеличивает эффективность и надёжность JavaScript-разработки добавлением строгой типизации. Он взят за основу в некоторых современных фреймворках, таких как AngularJS 2.0 и Ionic Framework 2.0.

    В этом курсе мы с вами шаг за шагом пройдем от знакомства с основными идеями до реального использования TypeScript, на практике посмотрим как решать типичные проблемы. Начнем с построения простых компонентов, научимся настраивать окружение, поговорим про системы сборки.

    Курс состоит из 4-х занятий:
    1. Знакомство с TypeScript и его окружением.
    2. Основные структурные элементы в TypeScript
    3. TypeScript и сторонние библиотеки, модулизация.
    4. Декораторы, прочие вопросы по TypeScript.
    Детали программы смотрите далее.

    Основные темы программы
    Неделя 1

    Знакомство с TypeScript и основными структурными элементами

    В этом блоке мы разберем основные идеи TypeScript, зачем он нужен и почему так важен. Научимся писать простые компоненты и узнаем, в чем принципиальное отличие TypeScript от других решений. Разбираем нюансы о типах, функциях и классах.

    • Настраиваем окружение.
    • Устанавливаем правила редактирования.
    • Знакомимся с типизацией и разбираемся в ней.
    • Рассматриваем функции в контексте ЕS6 и рассматриваем их сквозь призму TypeScript.
    • Рассмотрим классы как основной строительный элемент TypeScript.
    Неделя 2

    Углубляемся в понимание TypeScript

    Когда мы пишем реальные приложения или тестируем их, мы используем ряд сторонних решений и библиотек. Мы познакомимся с тем, где и как можно найти определения типов для них и как их интегрировать в проект. Напишем свои определения типов. Также мы модуляризуем на TypeScript-проект и разберём ряд дополнительных тем, таких как система сборки, декораторы и др.

    • Пишем приложения со сторонними библиотеками.
    • Учимся писать свои определения и используем сторонние.
    • Говорим о модулях и их реализации в TypeScript.
    • Смотрим как можно собрать модули с помощью WebPack.
    • Рассматриваем декораторы. Что это? Зачем? Где?.

    Введение в TypeScript

    Что такое TypeScript

    TypeScript представляет язык программирования на основе JavaScript.

    Развитие TypeScript началось в конце 2012 года. Хотя он зародился в компании Microsoft, и его фактическим создателем является программист Андерс Хейлсберг, так же известный как создатель таких языков как Delphi, C#, но данный проект сразу стал развиваться как OpenSource. И уже с самого начала новый язык стал быстро распространяться в силу своей гибкости и производительности. Немало проектов, которые были написаны на JavaScript, стали переноситься на TypeScript. Популярность и актуальность идей нового языка привела к тому, что ряд из этих идей в последующем станут частью нового стандарта JavaScript. А новая версия одного из популярнейших фреймворков для Web — Angular 2/4/5/6 полностью написана на TypeScript совместно компаниями Microsoft и Google.

    Однако, казалось бы, зачем нужен еще один язык программирования для клиентской стороны в среде Web, если со всей той же самой работой прекрасно справляется и традиционный JavaScript, который используется практически на каждом сайте, которым владеет множество разработчиков и поддержка которого в сообществе программистов довольно высока. Но TypeScript это не просто новый JavaScript.

    Во-первых, следует отметить, что TypeScript — это строго типизированный и компилируемый язык, чем, возможно, будет ближе к программистам Java, C# и других строго типизированных языков. Хотя на выходе компилятор создает все тот же JavaScript, который затем исполняется браузером. Однако строгая типизация уменьшает количество потенциальных ошибок, которые могли бы возникнуть при разработке на JavaScript.

    Во-вторых, TypeScript реализует многие концепции, которые свойственны объектно-ориентированным языкам, как, например, наследование, полиморфизм, инкапсуляция и модификаторы доступа и так далее.

    В-третьих, потенциал TypeScriptа позволяет быстрее и проще писать большие сложные комплексные программы, соответственно их легче поддерживать, развивать, масштабировать и тестировать, чем на стандартном JavaScript.

    В-четвертых, TypeScript развивается как opensource-проект и, как и многие проекты, хостится на гитхабе. Адрес репозитория — https://github.com/Microsoft/TypeScript. Кроме того, он является кроссплатформенным, а это значит, что для разработки мы можем испольвать как Windows, так и MasOS или Linux.

    В то же время TypeScript является надмножеством JavaScript, а это значит, что любая программа на JS является программой на TypeScript. В TS можно использовать все те конструкции, которые применяются в JS — те же операторы, условные, циклические конструкции. Более того код на TS компилируется в javascript. В конечном счете, TS — это всего лишь инструмент, который призван облегчить разработку приложений.

    Генерируемый компилятором TypeScript код JS поддерживается подавляющим большинством браузеров, так как ориентируется прежде всего на стандарт ECMAScript 3, хотя TS также поддерживает и стандарты ECMAScript 5 и ECMAScript 2015 / 2020. Хотя в процессе разработки мы можем сами задать целевой стандарт ECMAScript.

    Как использовать TypeScript? Поскольку данный язык является OpenSource, то все его инструменты доступны для всех желающих. Для работы с TypeScript мы можем использовать как Windows, так и Linux и MacOS.

    Сам компилятор TS можно установить с помощью команды менеджера пакетов npm, который используется в Node.js:

    Для написания кода на языке TypeScript можно использовать любой самый простейший текстовый редактор. Многие текстовые редакторы и среды разработки, например, Visual Code Studio, Atom, Sublime, Visual Studio, Netbeans, WebStorm и другие, имеют поддержку TypeScript на уровне плагинов, что позволяет воспользоваться рядом преимуществом, например, подцветкой кода или всплывающей подсказкой по типам и конструкциям языка.

    WEB start

    Компьютеры. Интернет. Заочное профессиональное обучение. 055-966-10-17

    Обучение

    Широкий спектр программ и различных форм обучения

    Возможность заочного, дистанционного обучения 055-966-10-17

    • Программирование. Современные языки и технологии.
    • Обслуживание персональных компьютеров.
    • Компьютерные сети. Защита информации.
    • Интернет. Планирование, создание WEB-сайтов. Дизайн, программирование. CEO, продвижение сайтов в интернет.
    • Основы современных IT — технологий.

    Наши преимущества

    • Наши программы обучения ориентированы на конкретного слушателя. Вы можете обучаться по одной из предложенных Вам программ, а можете самостоятельно составить, откорректировать, откорректировать свою персональную программу обучения. Преподаватель, консультант помогают Вам сориентироваться в материале курса при выборе программы обучения.
    • Обучение индивидуальное. Преподаватель проводит занятие только для Вас, ориентируясь на Ваши возможности, предыдущие знания и опыт, скорость восприятия нового материала.
    • Вы учитесь в удобное для Вас время , в удобной для Вас форме, может быть выбран гибкий график занятий, в соответствии с Вашими возможностями и пожеланиями.
    • Обучение проводится дистанционно . Вы можете обучаться, сидя за Вашим компьютером дома или на работе, не тратя время на поездки к месту обучения.

    Регистрация на сайте

    Дополнительные материалы

    Вводный курс

    TypeScript

    Язык TypeScript — это надмножество языка ECMAScript 6 (также известной как ECMAScript 2015, ES2015), которое компилируется в обычный код на JavaScript (ES5) и широко поддерживается современными ОС.

    На настоящий момент браузеры не имеют встроенной поддержки ни TypeScript, ни ECMAScript 6, поэтому для публикации на сервеере код должен быть преобразован в код на JavaScript, поддерживаемый всеми браузерами.

    Установка TypeSceipt

    Удобно работать с TypeScript в среде NodeJs.

    В консоли NodeJS TypeScript устанавливается при помощи npm (Node Package Manager):

    > npm install -g typescript


    Для работы с программами на TypeScript можно использовать любой текстовый редактор. Наиболее популярный, наверное, на сегодня — бесплатный Microsoft Visual Studio Code.

    Для удобства можно поставить под VS Code расширение Lint для TypeScript:

    Для Visual Studio Code — установить lint:

    npm install -g lint

    Создание первой программы на TypeScript

    Текст программы — в файле test1.ts

    Создать текстовый файл в любом редакторе (далее — Visual Studio Code)

    Компиляция программы

    Компайлер создаёт файл:

    test1.js , который уже можно запустить и в браузере и в NodeJs:

    Характерные особенности программы на TypeScript

    Основные отличия, характерные особенности языка TypeScript по сравнению с JavaScript.

    Типы данных

    Важной отличительной особенностью TypeScript является поддержка статического описания данных. Это означает, что вы можете объявлять типы переменных, и компилятор будет проверять, что им не присвоены неправильные типы значений. Если объявления типов опущены, они будут автоматически получены из вашего кода.

    Задание типов

    Приведение типов (Type assertions)

    let someValue: any = «this is a string»; let strLength: number = ( someValue).length;

    let someValue: any = «this is a string»; let strLength: number = (someValue as string).length;

    Описание функции

    Описание типов данных

    Необязательные параметры-аргументы функции (Optional parameters)

    Параметры по-умолчанию (Default parameters)

    Arrow functions

    TypeScript допускает такой синтаксис при описании функций


    Интерфейсы (Interfaces)

    Язык TypeScript позволяет описывать комплексные пользовательские структуры данных — интерфейсы.

    Классы

    Описание классов

    Модификаторы уровня доступа (Access modifiers)

    public, private, protected

    Доступ к свойствам класса (Accessors — getter, setter)

    TypeScript использует специальные функции: getters/setters как способ доступа к дочерним элементам объекта (в том числе и private).

    Modules

    Модуль выполняется в пределах собственного пространства имён (namespace ), а не в глобальном (global namespace); это означает, что переменные, функции, классы и т. д., объявленные в модуле, не видны вне модуля, если они явно не экспортируются с использованием одной из форм экспорта. И наоборот, чтобы использовать переменную, функцию, класс, интерфейс и т. д., экспортированные из другого модуля, их нужно импортировать с использованием одной из форм импорта.

    Модуль в TypeScript — самостоятельное пространство имён.

    Модуль — файл TypeScript, который может содержать описания данных.

    Те данные, которые модуль хочет сделать достыпными для других пространств имён, он помечает описателем export.

    Для использования чужих данных (из другого модуля) их нужно импортировать (import).

    Файл конфигурации

    Создать стандартный файл конфигурации для программы на TypeScript (tsconfig.json)

    Этот файл содержит целый ряд параметров для компилятора.

    Например: «target»: «es5» говорит о том, что результатом работы компилятора должен быть файл на стандартном JavaScript (версиz ECMAScript ES5 ).

    Начинаем работу с TypeScript

    Russian (Pусский) translation by Ilya Nikov (you can also view the original English article)

    В конце 2012 года Microsoft представила TypeScript, типизированный суперсет для JavaScript, который компилируется в обычный JavaScript. TypeScript фокусируется на предоставлении полезных инструментов для крупномасштабных приложений путем реализации функций, таких как классы, аннотации типов, наследование, модули и многое другое! В этом уроке мы начнем с TypeScript, используя простые примеры кода с укусом, скомпилируем их в JavaScript и просмотрим мгновенные результаты в браузере.

    Установка инструментов

    Возможности TypeScript применяются только во время компиляции.

    Вы настроите свою машину в соответствии с вашей конкретной платформой и потребностями. Пользователи Windows и Visual Studio могут просто загрузить плагин Visual Studio. Если вы работаете в Windows и не имеете Visual Studio, попробуйте Visual Studio Express для Интернета. Опыт TypeScript в Visual Studio в настоящее время превосходит другие редакторы.

    Если вы работаете на другой платформе (или не хотите использовать Visual Studio), все, что вам нужно, это текстовый редактор, браузер и пакет npm для TypeScript для использования TypeScript. Следуйте инструкциям по установке:


    1. Установка диспетчера пакетов node (npm)
    2. Глобально установите TypeScript пакет npm:
    3. Любой современный браузер: для этого учебника мы используем Chrome.
    4. Любой текстовый редактор: для этого учебника используется Sublime Text
    5. Модуль подсветки синтаксиса для текстовых редакторов

    Готово; мы готовы сделать простое приложение «Hello World» в TypeScript!

    Hello World в TypeScript

    TypeScript является надмножеством Ecmascript 5 (ES5) и включает функции, предлагаемые для ES6. Из-за этого любая программа JavaScript уже является программой TypeScript. Компилятор TypeScript выполняет локальные преобразования файлов в программах TypeScript. Следовательно, окончательный вывод JavaScript точно соответствует вводу TypeScript.

    Сначала мы создадим базовый файл index.html и ссылку на внешний файл сценария:

    Это простое приложение «Hello World»; поэтому давайте создадим файл с именем hello.ts . Расширение *.ts обозначает файл TypeScript. Добавьте следующий код в hello.ts :

    Затем откройте интерфейс командной строки, перейдите к папке, содержащей hello.ts , и запустите компилятор TypeScript с помощью следующей команды:

    Команда tsc является компилятором TypeScript и сразу генерирует новый файл hello.js . В нашем приложении TypeScript не используется синтаксис, специфичный для TypeScript, поэтому мы видим тот же самый код JavaScript в hello.js , который мы написали на hello.ts .

    Круто! Теперь мы можем изучить возможности TypeScript и посмотреть, как это может помочь нам поддерживать и создавать широкомасштабные приложения JavaScript.

    Аннотации type

    Аннотации типа являются дополнительной функцией, которая позволяет нам проверять и выражать наше намерение в программах, которые мы пишем. Давайте создадим простую функцию area() в новом файле TypeScript, называемом type.ts

    Затем измените источник скрипта в index.html на type.js и запустите компилятор TypeScript с помощью t sc type.ts . Обновите страницу в браузере, и вы увидите следующее:

    Как показано в предыдущем коде, аннотации типа выражаются как часть параметров функции; они указывают, какие типы значений вы можете передать функции. Например, параметр shape обозначается как строковое значение, а width и height — это числовые значения.

    Аннотации типов и другие функции TypeScript применяются только во время компиляции. Если вы передадите какие-либо другие типы значений этим параметрам, компилятор даст вам ошибку времени компиляции. Такое поведение чрезвычайно полезно при создании крупномасштабных приложений. Например, давайте намеренно передать строковое значение для параметра width :

    Мы знаем, что это приводит к нежелательному результату, и компиляция файла предупреждает нас о проблеме со следующей ошибкой:

    Обратите внимание, что, несмотря на эту ошибку, компилятор сгенерировал файл type.js . Ошибка не останавливает компилятор TypeScript от генерации соответствующего JavaScript, но компилятор предупреждает нас о потенциальных проблемах. Мы предполагаем, что width будет числом; передача чего-либо другого приводит к нежелательному поведению в нашем коде. Другие аннотации типа включают bool или даже any .

    Интерфейсы

    Давайте расширим наш пример, включив интерфейс, который далее описывает форму как объект с дополнительным свойством color . Создайте новый файл с именем interface.ts и измените источник скрипта в index.html , чтобы включить interface.js . Введите следующий код в interface.ts :

    Интерфейсы — это имена, присвоенные типам объектов. Мы можем не только объявить интерфейс, но и использовать его как аннотацию типа.

    Компиляция interface.js не приводит к ошибкам. Чтобы вызвать ошибку, добавим еще одну строку кода в interface.js с формой, которая не имеет свойства имени и посмотрим результат в консоли браузера. Добавьте эту строку в interface.js :

    Теперь скомпилируйте код с помощью tsc interface.js . Вы получите сообщение об ошибке, но не беспокойтесь об этом прямо сейчас. Обновите свой браузер и посмотрите на консоль. Вы увидите что-то похожее на следующий снимок экрана:

    Теперь давайте посмотрим на ошибку. Это:

    Мы видим эту ошибку, поскольку объект, переданный в area() , не соответствует интерфейсу Shape ; для этого требуется свойство name.


    Стрелочные функции

    Понимание сферы действия ключевого слова this является сложной задачей, и TypeScript упрощает его, поддерживая выражения стрелочных функций, новую возможность, обсуждаемую для ECMAScript 6. Стрелочные функции сохраняют значение this , что значительно упрощает запись и использование функций обратного вызова. Рассмотрим следующий код:

    this.name в строке 7 будет явно пустым, как показано в консоли браузера:

    Мы можем легко исправить эту проблему, используя стрелочную функцию TypeScript. Просто замените function() на ()=> .

    Взгляните на созданный файл JavaScript. Вы увидите, что компилятор ввел новую переменную var _this = this; , и использовал ее в функции обратного вызова setTimeout() для ссылки на свойство name .

    Классы с общедоступными и частными модификаторами доступа

    TypeScript поддерживает классы, и их реализация тесно соответствует предложению ECMAScript 6. Давайте создадим еще один файл с именем class.ts , и рассмотрим синтаксис класса:

    Вышеуказанный класс Shape имеет два свойства, area и color , один конструктор (точно названный constructor() ), а также метод shoutout() . Скоуп аргументов конструктора ( name , width и height ) являются локальными для конструктора. Вот почему вы увидите ошибки в браузере, а также компилятора:

    Любая программа JavaScript уже является программой TypeScript.

    Затем давайте рассмотрим public и private модификаторы доступа. Доступ к публичным членам можно получить повсюду, тогда как частные члены доступны только в рамках класса. Разумеется, в JavaScript нет возможности для обеспечения конфиденциальности, поэтому доступность для частного доступа обеспечивается только во время компиляции и служит предупреждением первоначальному намерению разработчика сделать его конфиденциальным.

    В качестве иллюстрации добавим модификатор public к аргументу конструктора, name и модификатор private к color . Когда мы добавляем public или private доступность к аргументу конструктора, этот аргумент автоматически становится членом класса с соответствующим модификатором доступности.

    Наследование

    Наконец, вы можете расширить существующий класс и создать из него производный класс с ключевым словом extends . Давайте добавим следующий код к существующему файлу class.ts и скомпилируем его:

    Несколько вещей происходят с производным классом Shape3D :

    • Поскольку он получен из класса Shape , он наследует свойства area и color .
    • Внутри метода конструктора метод super вызывает конструктор базового класса Shape , передавая значения name , width и height . Наследование позволяет нам повторно использовать код из Shape , поэтому мы можем легко вычислить this.volume с унаследованным свойством area .
    • Метод shoutout() переопределяет реализацию базового класса, а новый метод superShout() напрямую вызывает метод buout() базового класса, используя ключевое слово super .

    Имея только несколько дополнительных строк кода, мы можем легко расширить базовый класс, чтобы добавить более конкретные функции и сделать наше намерение известным с помощью TypeScript.

    Ресурсы TypeScript

    Несмотря на чрезвычайно молодой возраст TypeScript, вы можете найти много полезных ресурсов в Интернете (включая полный курс, который подходит к Tuts + Premium!). Обязательно проверьте их:

    Мы только начинаем

    Попробовать TypeScript легко. Если вам нравится более статически типизированный подход для больших приложений, то функции TypeScript будут применять привычную, дисциплинированную среду. Хотя его и сравнивают с CoffeeScript или Dart, TypeScript отличается тем, что он не заменяет JavaScript; он добавляет функции JavaScript.

    Нам еще предстоит увидеть, как будет развиваться TypeScript, но Microsoft заявила, что сохранит свои многочисленные функции (аннотации типов) в соответствии с ECMAScript 6. Итак, если вы хотите попробовать многие новые функции ES6, TypeScript — отличный способ сделать это! Вперед, попробуйте!

    Язык программирования TypeScript

    Описание


    На курсе рассматривается расширенная версия JavaScript – TypeScript, включающая все возможности EcmaScript 2015 и перспективные возможности JavaScript, пока не включенные в стандарт. Также разбирается система типизации, облегчающая валидацию JavaScript-приложений.

    TypeScript дает возможность использовать синтаксис, близкий таким языкам, как Java или C#, и позволяющий писать более аккуратный, удобный и легко поддерживаемый код. TypeScript содержит все возможности EcmaScript 2015, такие как поддержка синтаксиса для классов и наследования, использование Promise, функций-генераторов, а также возможности, еще не введенные в стандарт JavaScript: поддержка конструкций Async/Await, поддержка декораторов.

    Курсы TypeScript с Angular и ReactJS от экспертов веб разработки

    Если вы разрабатываете приложения на JavaScript, вы точно должны были слышать о TypeScript. Если вам не хватает времени на длительное обучение, но вы хотите расширить свои возможности при разработке, то рассмотрите онлайн-курсы TypeScript. С ними вы буквально за несколько дней выучите то, что пригодится вам в последующие годы работы.

    TypeScript был представлен в 2012 году компанией Microsoft. Ее создатель – Андерс Хейлсберг, в прошлом известен разработкой Turbo Pascal, Delphi и C#. Этот язык совместим с JavaScript и призван значительно расширить его возможности. Используется как компилятор. Благодаря нему вы сможете запускать программы в любом браузере и работать с платформой Node.js.

    Преимущества Type Script (в сравнении с JavaScript):
    — поддержка полноценных классов;
    — возможность подключения модулей;
    — повышение скорости разработки и выполнения программ;
    — повышение удобочитаемости и повторного использования написанного кода;
    — упрощенный поиск ошибок.

    С учетом этих преимуществ мы подобрали для вас пятерку самых лучших курсов TypeScript, чтобы процесс обучения для вас был и простым, и практичным одновременно. В качестве платформы мы выбрали Udemy, на которой уже больше 15 млн. учащихся и 45 тысяч курсов.

    Премиум курсы TypeScript от опытных преподавателей 2020

    Понимание и база Type Script

    Преподаватель: Максимилиан Шварцмюллер, опытный разработчик и преподаватель
    Стоимость: 110$
    Количество студентов: 7 216+
    Объем программы: 137 лекций; 6,5 часов
    Уровень подготовки (требования для курса): основы JavaScript, желательно иметь опыт с ООП и ES6

    Чему вы научитесь?
    — Базовые понятия о Type Script и принцип его работы
    — Понимание преимуществ Type Script над JavaScript
    — Использовать Type Script и его возможности: типы, поддержка ES6, классы, модули, интерфейсы и многое другое

    От самых базовых знаний и функций до полноценной возможности использования Type Script в своих проектах – в рамках этого курса вы получите максимум необходимой информации с реальными практическими заданиями.

    Кроме базовых функций вы также изучите более продвинутые возможности, например как настраивать потоки работ в Type Script (в том числе с Gulp и Webpack) и как использовать современные функции ES6: декораторы, стрелочные функции и деструктуризацию. Также вы изучите как использовать Type Script с Angular и ReactJS, и получить этого максимум преимуществ.

    С практической точки зрения в курсе есть большое количество заданий с решениями, в том числе проекты на ReactJS.

    Если вы не хотите зацикливаться только на JavaScript, вам обязательно стоит пройти этот практический и понятный курс.

    Введение в разработку на TypeScript

    Преподаватель: Джордан Хадженс, опытный разработчик и преподаватель
    Стоимость: 40$
    Количество студентов: 2 335+
    Объем программы: 42 лекции; 6 часов
    Уровень подготовки (требования для курса): никаких навыков не требуется

    Чему вы научитесь?
    — Подготовитесь к разработке приложений на Angular 2
    — Писать код на языке Type Script
    — Работать с классами и методикой объектно-ориентированного программирования (ООП) на TypeScript

    Этот курс сосредоточен на изучении Type Script для последующей разработки мобильных и веб-приложений на базе Angular.

    Сначала вы познакомитесь с синтаксисом и перейдете к более сложным методикам разработки: работа с замыканиями, ООП, асинхронная разработка в реальном времени и декораторы.

    Вы узнаете, как устанавливать и запускать программы как на Mac, так и на Windows. В каждом уроке есть исходный код, чтобы вы могли сверить с ним свой собственный код и таким образом убедиться в правильном понимании пройденного материала.

    Задача курса – научить вас вместо стандартных консольных приложений создавать реально полезные приложения на Angular 2.

    После завершения этого курса вас определенно заинтересуют курсы Angular JS, так что не останавливайтесь на достигнутом.

    Type Script: быстро и просто

    Преподаватель: Сепехр Эсмаили, разработчик и системный архитектор
    Стоимость: 20$
    Количество студентов: 2 689+
    Объем программы: 38 лекций; 1,5 часа
    Уровень подготовки (требования для курса): никаких навыков не требуется


    Чему вы научитесь?
    — Создавать приложения JavaScript, используя Type Script

    Курс предоставляет простой и практичный способ изучения Type Script, но вы также изучите основные функции ES6, типы в Type Script, объектно-ориентированное программирование с использованием классов в ES6 и Type Script, дженерики, модули и декораторы.

    Целевая аудитория курса – разработчики, веб-программисты, JavaScript-разработчики, которые планируют изучить Angular или разработку мобильных приложений на Ionic.

    Освойте TypeScript

    Преподаватель: Packt Publishing, платформа технического обучения с количеством студентов свыше 37 тысяч
    Стоимость: 95$
    Количество студентов: 332+
    Объем программы: 41 лекция; 3,5 часа
    Уровень подготовки (требования для курса): знание и опыт JavaScript; знакомство с Type Script (рекомендуем пройти один из первых курсов в нашей подборке)

    Чему вы научитесь?
    — Компилировать приложения и уметь анализировать их структуру
    — Понимать и более эффективно использовать систему типов Type Script
    — Расширите свои знания о классах ES6 и о том, как они связаны с классовыми шаблонами JavaScript
    — Использовать расширенные функции ES6/ES7
    — Знакомство с библиотеками JavaScript в Type Script
    — Улучшать и структурировать свой код, используя возможности языка Type Script
    — Реализовать статическую типизацию между клиентом и сервером в клиент-серверном приложении

    Курс призван научить вас важным навыкам, которые помогут вам, прежде всего, улучшать свой код и весь процесс разработки. Кроме взаимодействия с системой типов вы научитесь эффективно использовать расширенные возможности Type Script.

    После представления ключевых понятий о TypeScript на примере простого клиент-серверного приложения вы детально ознакомитесь с его системой типов, узнаете как следует работать с библиотеками JavaScript, а также как использовать Type Script для статической типизации между компонентами приложения.

    Преподаватель Девид Шеррет является программным разработчиком в сфере здравоохранения, который реализует несколько проектов, связанных с логистикой и технологиями для устранения подделок в фармацевтической отрасли. В процессе обучения вы сможете задавать ему любые вопросы в системе Stack Overflow, так что любые трудности в обучении будут решаться очень легко.

    Мастер-класс по TypeScript

    Преподаватель: Васко, front-end разработчик на образовательной платформе Angular University
    Стоимость: 150$
    Количество студентов: 921+
    Объем программы: 107 лекций; 7,5 часов

    Уровень подготовки (требования для курса): опыт веб-разработки, базовые знания HTML и JavaScript; знакомство с одним из языков программирования типа JavaScript, C#, Ruby, Python или Java; общее понятие об Angular; установленный Node или NPM (в процессу обучение вам объяснят, как это сделать); базовые понятия о REST; общее представление о реляционных базах данных.

    Чему вы научитесь?
    — Уверенно работать с Type Script в контексте full-stack-разработки
    — Создавать процессы Node.js, используя Type Script
    — Создавать небольшие приложения на Angular с помощью интерфейса командной строки
    — Всеохватывающее понимание системы Typescript 2 и ее реальное использование
    — Как импортировать и использовать сторонние определения типов для улучшения разрабатываемых программ
    — Использовать типобезопасность, чтобы улучшать свои программы
    — Создавать маленькие REST API, используя Express и Type Script
    — Отправлять запросы к БД SQL, используя Type Script и Sequelize

    Вы изучите Type Script 2, функции ES6 и систему типов. Type Script вы будете использовать для создания API REST Node в Express, и будете отправлять запросы к SQL-базе в Type Script, используя Sequelize ORM. Наконец вы создадите небольшой клиент Angular Type script, используя командную строку Angular, и научитесь отправлять запрос к REST API с помощью HTTP-модуля Angular.

    Это самый полноценный и глубокий курс по TypeScript, который позволит вам не только овладеть этим языком, но и применять его функции на практике для создания конкретных программ. Изучаемые в курсе преимущества типобезопасности помогут вам создавать более качественные программы, что существенно повысит ваш статус в глазах работодателей.

    Сегодня мы представили вам курсы, которые, я уверен, помогут вам значительно улучшить свои навыки JavaScript-разработки. Полный список можно найти здесь. Никогда не соглашайтесь на то, что у вас уже есть, и расширяйте свои знания, ведь развитие – это верный путь к успеху!

    Курс по TypeScript

    serafim

    Житель Разулы

    Программа
    TypeScript увеличивает эффективность и надёжность JavaScript-разработки добавлением строгой типизации. Он взят за основу в некоторых современных фреймворках, таких как AngularJS 2.0 и Ionic Framework 2.0.

    В этом курсе мы с вами шаг за шагом пройдем от знакомства с основными идеями до реального использования TypeScript, на практике посмотрим как решать типичные проблемы. Начнем с построения простых компонентов, научимся настраивать окружение, поговорим про системы сборки.

    Курс состоит из 4-х занятий:
    1. Знакомство с TypeScript и его окружением.
    2. Основные структурные элементы в TypeScript
    3. TypeScript и сторонние библиотеки, модулизация.
    4. Декораторы, прочие вопросы по TypeScript.
    Детали программы смотрите далее.

    Основные темы программы
    Неделя 1

    Знакомство с TypeScript и основными структурными элементами


    В этом блоке мы разберем основные идеи TypeScript, зачем он нужен и почему так важен. Научимся писать простые компоненты и узнаем, в чем принципиальное отличие TypeScript от других решений. Разбираем нюансы о типах, функциях и классах.

    • Настраиваем окружение.
    • Устанавливаем правила редактирования.
    • Знакомимся с типизацией и разбираемся в ней.
    • Рассматриваем функции в контексте ЕS6 и рассматриваем их сквозь призму TypeScript.
    • Рассмотрим классы как основной строительный элемент TypeScript.
    Неделя 2

    Углубляемся в понимание TypeScript

    Когда мы пишем реальные приложения или тестируем их, мы используем ряд сторонних решений и библиотек. Мы познакомимся с тем, где и как можно найти определения типов для них и как их интегрировать в проект. Напишем свои определения типов. Также мы модуляризуем на TypeScript-проект и разберём ряд дополнительных тем, таких как система сборки, декораторы и др.

    • Пишем приложения со сторонними библиотеками.
    • Учимся писать свои определения и используем сторонние.
    • Говорим о модулях и их реализации в TypeScript.
    • Смотрим как можно собрать модули с помощью WebPack.
    • Рассматриваем декораторы. Что это? Зачем? Где?.

    Начинаем работу с TypeScript

    Russian (Pусский) translation by Ilya Nikov (you can also view the original English article)

    В конце 2012 года Microsoft представила TypeScript, типизированный суперсет для JavaScript, который компилируется в обычный JavaScript. TypeScript фокусируется на предоставлении полезных инструментов для крупномасштабных приложений путем реализации функций, таких как классы, аннотации типов, наследование, модули и многое другое! В этом уроке мы начнем с TypeScript, используя простые примеры кода с укусом, скомпилируем их в JavaScript и просмотрим мгновенные результаты в браузере.

    Установка инструментов

    Возможности TypeScript применяются только во время компиляции.

    Вы настроите свою машину в соответствии с вашей конкретной платформой и потребностями. Пользователи Windows и Visual Studio могут просто загрузить плагин Visual Studio. Если вы работаете в Windows и не имеете Visual Studio, попробуйте Visual Studio Express для Интернета. Опыт TypeScript в Visual Studio в настоящее время превосходит другие редакторы.

    Если вы работаете на другой платформе (или не хотите использовать Visual Studio), все, что вам нужно, это текстовый редактор, браузер и пакет npm для TypeScript для использования TypeScript. Следуйте инструкциям по установке:

    1. Установка диспетчера пакетов node (npm)
    2. Глобально установите TypeScript пакет npm:
    3. Любой современный браузер: для этого учебника мы используем Chrome.
    4. Любой текстовый редактор: для этого учебника используется Sublime Text
    5. Модуль подсветки синтаксиса для текстовых редакторов

    Готово; мы готовы сделать простое приложение «Hello World» в TypeScript!

    Hello World в TypeScript

    TypeScript является надмножеством Ecmascript 5 (ES5) и включает функции, предлагаемые для ES6. Из-за этого любая программа JavaScript уже является программой TypeScript. Компилятор TypeScript выполняет локальные преобразования файлов в программах TypeScript. Следовательно, окончательный вывод JavaScript точно соответствует вводу TypeScript.

    Сначала мы создадим базовый файл index.html и ссылку на внешний файл сценария:

    Это простое приложение «Hello World»; поэтому давайте создадим файл с именем hello.ts . Расширение *.ts обозначает файл TypeScript. Добавьте следующий код в hello.ts :

    Затем откройте интерфейс командной строки, перейдите к папке, содержащей hello.ts , и запустите компилятор TypeScript с помощью следующей команды:

    Команда tsc является компилятором TypeScript и сразу генерирует новый файл hello.js . В нашем приложении TypeScript не используется синтаксис, специфичный для TypeScript, поэтому мы видим тот же самый код JavaScript в hello.js , который мы написали на hello.ts .

    Круто! Теперь мы можем изучить возможности TypeScript и посмотреть, как это может помочь нам поддерживать и создавать широкомасштабные приложения JavaScript.

    Аннотации type

    Аннотации типа являются дополнительной функцией, которая позволяет нам проверять и выражать наше намерение в программах, которые мы пишем. Давайте создадим простую функцию area() в новом файле TypeScript, называемом type.ts


    Затем измените источник скрипта в index.html на type.js и запустите компилятор TypeScript с помощью t sc type.ts . Обновите страницу в браузере, и вы увидите следующее:

    Как показано в предыдущем коде, аннотации типа выражаются как часть параметров функции; они указывают, какие типы значений вы можете передать функции. Например, параметр shape обозначается как строковое значение, а width и height — это числовые значения.

    Аннотации типов и другие функции TypeScript применяются только во время компиляции. Если вы передадите какие-либо другие типы значений этим параметрам, компилятор даст вам ошибку времени компиляции. Такое поведение чрезвычайно полезно при создании крупномасштабных приложений. Например, давайте намеренно передать строковое значение для параметра width :

    Мы знаем, что это приводит к нежелательному результату, и компиляция файла предупреждает нас о проблеме со следующей ошибкой:

    Обратите внимание, что, несмотря на эту ошибку, компилятор сгенерировал файл type.js . Ошибка не останавливает компилятор TypeScript от генерации соответствующего JavaScript, но компилятор предупреждает нас о потенциальных проблемах. Мы предполагаем, что width будет числом; передача чего-либо другого приводит к нежелательному поведению в нашем коде. Другие аннотации типа включают bool или даже any .

    Интерфейсы

    Давайте расширим наш пример, включив интерфейс, который далее описывает форму как объект с дополнительным свойством color . Создайте новый файл с именем interface.ts и измените источник скрипта в index.html , чтобы включить interface.js . Введите следующий код в interface.ts :

    Интерфейсы — это имена, присвоенные типам объектов. Мы можем не только объявить интерфейс, но и использовать его как аннотацию типа.

    Компиляция interface.js не приводит к ошибкам. Чтобы вызвать ошибку, добавим еще одну строку кода в interface.js с формой, которая не имеет свойства имени и посмотрим результат в консоли браузера. Добавьте эту строку в interface.js :

    Теперь скомпилируйте код с помощью tsc interface.js . Вы получите сообщение об ошибке, но не беспокойтесь об этом прямо сейчас. Обновите свой браузер и посмотрите на консоль. Вы увидите что-то похожее на следующий снимок экрана:

    Теперь давайте посмотрим на ошибку. Это:

    Мы видим эту ошибку, поскольку объект, переданный в area() , не соответствует интерфейсу Shape ; для этого требуется свойство name.

    Стрелочные функции

    Понимание сферы действия ключевого слова this является сложной задачей, и TypeScript упрощает его, поддерживая выражения стрелочных функций, новую возможность, обсуждаемую для ECMAScript 6. Стрелочные функции сохраняют значение this , что значительно упрощает запись и использование функций обратного вызова. Рассмотрим следующий код:

    this.name в строке 7 будет явно пустым, как показано в консоли браузера:

    Мы можем легко исправить эту проблему, используя стрелочную функцию TypeScript. Просто замените function() на ()=> .

    Взгляните на созданный файл JavaScript. Вы увидите, что компилятор ввел новую переменную var _this = this; , и использовал ее в функции обратного вызова setTimeout() для ссылки на свойство name .

    Классы с общедоступными и частными модификаторами доступа

    TypeScript поддерживает классы, и их реализация тесно соответствует предложению ECMAScript 6. Давайте создадим еще один файл с именем class.ts , и рассмотрим синтаксис класса:

    Вышеуказанный класс Shape имеет два свойства, area и color , один конструктор (точно названный constructor() ), а также метод shoutout() . Скоуп аргументов конструктора ( name , width и height ) являются локальными для конструктора. Вот почему вы увидите ошибки в браузере, а также компилятора:

    Любая программа JavaScript уже является программой TypeScript.

    Затем давайте рассмотрим public и private модификаторы доступа. Доступ к публичным членам можно получить повсюду, тогда как частные члены доступны только в рамках класса. Разумеется, в JavaScript нет возможности для обеспечения конфиденциальности, поэтому доступность для частного доступа обеспечивается только во время компиляции и служит предупреждением первоначальному намерению разработчика сделать его конфиденциальным.

    В качестве иллюстрации добавим модификатор public к аргументу конструктора, name и модификатор private к color . Когда мы добавляем public или private доступность к аргументу конструктора, этот аргумент автоматически становится членом класса с соответствующим модификатором доступности.

    Наследование

    Наконец, вы можете расширить существующий класс и создать из него производный класс с ключевым словом extends . Давайте добавим следующий код к существующему файлу class.ts и скомпилируем его:

    Несколько вещей происходят с производным классом Shape3D :

    • Поскольку он получен из класса Shape , он наследует свойства area и color .
    • Внутри метода конструктора метод super вызывает конструктор базового класса Shape , передавая значения name , width и height . Наследование позволяет нам повторно использовать код из Shape , поэтому мы можем легко вычислить this.volume с унаследованным свойством area .
    • Метод shoutout() переопределяет реализацию базового класса, а новый метод superShout() напрямую вызывает метод buout() базового класса, используя ключевое слово super .

    Имея только несколько дополнительных строк кода, мы можем легко расширить базовый класс, чтобы добавить более конкретные функции и сделать наше намерение известным с помощью TypeScript.

    Ресурсы TypeScript

    Несмотря на чрезвычайно молодой возраст TypeScript, вы можете найти много полезных ресурсов в Интернете (включая полный курс, который подходит к Tuts + Premium!). Обязательно проверьте их:

    Мы только начинаем

    Попробовать TypeScript легко. Если вам нравится более статически типизированный подход для больших приложений, то функции TypeScript будут применять привычную, дисциплинированную среду. Хотя его и сравнивают с CoffeeScript или Dart, TypeScript отличается тем, что он не заменяет JavaScript; он добавляет функции JavaScript.

    Нам еще предстоит увидеть, как будет развиваться TypeScript, но Microsoft заявила, что сохранит свои многочисленные функции (аннотации типов) в соответствии с ECMAScript 6. Итак, если вы хотите попробовать многие новые функции ES6, TypeScript — отличный способ сделать это! Вперед, попробуйте!

    Мастер Йода рекомендует:  Использование Output Buffering в PHP
Добавить комментарий