Почему вы должны начать писать на TypeScript в 2022 году

Привет! Это моя первая статья на Хабре и в ней я хочу рассказать про такой язык, как TypeScript, и почему именно на нем вместо Javascript ты должен начать писать уже в этом году! В данной статье приведу 2 примера, когда TypeScript поможет нам избежать ошибки или подскажет, что что-то не так. Погнали!

1. Стандартная типизация входящих аргументов функции и возвращаемого значения

Приведу 2 простых примера :

function sum (a,b) {
  return a + b;
}

console.log(sum(1,2)); // Вернет 3

function concatenation (a,b) {
  return a + b;
}

console.log(sum("Let's ","start!")); // Вернет "Let's'start!"

Пока что все в порядке. Но если аргументы в функции sum поменяются на string тип а в функции concatenation на number, то и тип возвращаемого результата и сам результат поменяются, и будут некорректными

function sum (a,b) {
  return a + b;
}

console.log(sum('Start',2)); 
// Вернет уже не сумму а результат сложения строки с числом "Start2"

function concatenation (a,b) {
  return a + b;
}

console.log(sum(1,2)); // Вернет 3

Но если мы напишем те же функции с использованием Typescript и опишем их типами, то отловим данные ошибки на этапе компиляции

function sum (a: number,b:number):number {
  return a + b;
}

console.log(sum('Start',2)); 

Наша IDE подсветит нам, что данная функция принимает тип number, а не тип string, и компиляция не пройдет

Argument of type 'string' is not assignable to parameter of type 'number'.ts(2345)

Также и в примере с функцией concatenation

function concatenation (a:string,b:string):string {
  return a + b;
}

console.log(sum(1,2)); 

Argument of type 'number' is not assignable to parameter of type 'string'.ts(2345)

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

2. Typescript может эффективно подсказывать в IDE

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

function getValueFromObj(obj, key) {
	return obj[key];
}

const Obj = {
	'a': 1
}

console.log(getValueFromObj(Obj, 'a')); //Вернет 1

Но что будет, если передать в аргумент ключ, которого нет в объекте? Обычный Javascript пропустит эту ошибку. Но мы можем превентивно описать типы так, чтобы если мы уже знаем, что за объект у нас будет и какие у него ключи, мы не пропустим ключ, которого нет в объекте!

function getValueFromObj<T, K extends keyof T>(obj:T, key:K) {
	return obj[key];
}

const Obj = {
	'a': 1
}

console.log(getValueFromObj(Obj, 'b'));

Данный код не скомпилится, и Typescript подчеркнет нам второй аргумент функции с напоминанием, что такого ключа нет в объекте!

Argument of type '"b"' is not assignable to parameter of type '"a"'.ts(2345)

Стоит отметить, что данная проверка является лишь помощью в нахождении ошибок подобного рода и Typescript'a лишь проверяет на ошибки и скомпилится в нативный JS, в рантайме же нет Typescript'a и он не поймает там эту ошибку!

Кроме данных фичей, какие еще преимущества?

В настоящее время всё больше компаний начинают свои проекты на Typescript или переписывают свои старые проекты. Это обусловлено тем, что Typescript уже де-факто стандарт в написании проектов.

Я приведу список преимуществ:

• С каждым годом популярность Typescript только растёт! В доказательство этого приведу ссылку из последнего developer survey

• Отличная поддержка типов библиотеками

• Легко внедряется: поскольку Typescript совместим с Javascript, проект можно постепенно переводить на Typescript!

• Лёгкий старт: Сравнительно легкий старт для начала. Можно начать с гайда Typescript за 5 минут и уже успешно практиковаться!

Выводы

• Вы не должны писать каждый проект на Typescript, но если вы пишите библиотеку, то Typescript лучший выбор, так как возможно её будут использовать в проектах с Typescript.

• Typescript не поможет вам найти все ошибки в вашем проекте, но он поможет вам писать красивый типизированный код!