Что такое TypeScript и почему разработчики должны его попробовать?

JavaScript – это уникальный язык программирования. Он построен для веб-разработки и имеет другие правила для других языков программирования.

Одним из наиболее заметных отличий является то, что JavaScript динамически типизирован, что означает, что вам не нужно объявлять типы при создании переменных. Такие языки, как C, C # и Java заставят вас объявлять типы переменных. Они называются статически типизированными переменными.

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

Типы переменных

тип переменной является информация, которую вы планируете хранить в переменной.

Вот переменная Java, например:

int myNumber = 10;

Эта переменная ИНТ, что является сокращением от целого числа. Это позволяет вам знать, что переменная мой номер планирует хранить целое число. Если вы попытаетесь сохранить другое значение в переменной, например строку символов, программа не запустится.

Вот еще несколько типов переменных, которые вы могли использовать:

• int – обычные числа
• float – десятичные числа
• char – отдельные символы, такие как «x» или «a»
• строка – серия символов, таких как «Привет» и «Это строка»
• логическое значение – истина или ложь

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

Что такое TypeScript?

TypeScript – это версия JavaScript, разработанная Microsoft, которая вводит переменные типы в ваш код. Это не новый язык; думать об этом как обертку над простым JavaScript. Он имеет синтаксис, очень похожий на JavaScript, поэтому его легко начать.

Чтобы показать, насколько они похожи, вот строка кода на JavaScript и TypeScript.

JavaScript:

let myNumber = 10;

Машинопись:

let myNumber: number = 10;

Когда вы объявляете переменную в TypeScript, вы одновременно объявляете тип. Это небольшое изменение, которое имеет большое влияние.

TypeScript – это скомпилированный язык, в отличие от JavaScript, который работает в браузере. Скомпилированные языки могут быть быстрее и приводить к более эффективным программам

,

Тем не менее, нет никакого дополнительного программного обеспечения для загрузки; Файлы TypeScript скомпилированы в обычные файлы JavaScript, которые можно использовать в любом веб-приложении. Файлы TypeScript сохраняются как .TS файлы.

Как установить TypeScript

Начать работу с TypeScript легко:

• Через менеджер пакетов Node.js (NPM)
• Установка плагинов TypeScript для Visual Studio

Установить с помощью NPM легко с помощью командной строки:

> npm install -g typescript

Если вы используете Visual Studio 2017 или Visual Studio 2015 Update 3, у вас уже есть TypeScript. Если он не установлен, вы можете скачать его через веб-сайт TypeScript,

Преимущества TypeScript

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

Типизированные переменные

TypeScript позволяет назначать типы для переменных в вашем коде. Вы видели пример в начале, но как это поможет вам?

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

TypeScript дает вам много возможностей для создания переменных.

чисел

let myNumber: number = 10;

Струны

let myString: string = "TypeScript";

Булевы переменные

let myBoolean: boolean = true;

Массивы

Когда вы определяете массив, вы будете использовать тип значения, содержащегося в массиве, за которым следуют квадратные скобки.

let myArray: number [] = [1,2,3];

Любые

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

Вы можете свободно изменять значения этих переменных.

let anyType: any = 10;
anyType = "Hello"; //No error
anyType = true; //Still no error

пустота

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

function randomMessage(): void { Console.log("This is just a message"); }

Значение NULL

Просто дает вам нулевое значение.

let myNull: null = null; //This is all you can do

Неопределенный

Так же просто, это дает вам неопределенное значение.

let myUndefined: undefined = undefined; //This is all you can do

Добавленные функции

TypeScript предоставляет вам некоторые дополнительные функции и типы, которые позволяют вам делать больше с JavaScript.

Кортеж

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

let myTuple: [number,string];
myTuple = [45, "Hello"];
myTuple = ["Hello", 45]; // Error

Типы перечислений

Типы Enum – это специальный тип, который присваивает серии числовые значения.

enum Color { Red, Green, Blue }

В этом перечислении Red присваивается значение 0, Green – 1, а Blue – 2. Перечисления индексируются нулями, как массивы в JavaScript.

Классы объектов

Классы объектов, интерфейсы и наследование поддерживаются в TypeScript.

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

Вы можете сделать класс с конструкторами

class Student { 
Name: string; constructor(first,middle,last) { 
this.Name = first + " " + middle + " " + last; } 
}

let newStudent = new Student("John", "Leonard","Smith");

Вы можете сделать интерфейс и использовать его как тип.

interface Person {
 personName: string;

function sayHello(person: Person) {
 return "Hello " + person.personName;
}

функции

TypeScript также объявляет типы в функциях.

function addNum(num1: number, num2: number) {
 return num1 + num2;
}

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

function addNums(num1: number, num2 = 15) {
 return num1 + num2;
}

addNums(5,5); // This will return 10
addNums(5); // This will return 20. There was no second value, so the default parameter of 15 is used

Компилятор TypeScript помогает тестировать код

JavaScript, работающий в веб-браузере, великолепен, потому что он прост. TypeScript использует компилятор для перевода кода в файл JavaScript, но разве это не дополнительная работа?

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

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

Открытый источник

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

TypeScript хорошо работает с Visual Studio и Visual Studio Code. Visual Studio Code – лучший выбор для работы в JavaScript

так что вы готовы начать, если решите его использовать.

Работает с другими веб-фреймворками

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

TypeScript не удерживает вас от использования этих очень полезных веб-фреймворков

, Он совместим с React, Angular, Express, Babel, Vue.js, ASP.NET Core и React Native.

Веб-разработка и JavaScript

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

прежде чем погрузиться в TypeScript.

Хотите испытать? Загрузите TypeScript и попробуйте общий проект, такой как создание слайд-шоу JavaScript

, Развивайте свои знания, и очень скоро вы станете экспертом по веб-разработке!