Ответы на самые популярные вопросы на собеседовании по TypeScript: связь TS и JS

Богдан Мирченко

20.04.2021 11:17

Технический писатель и программист Райан Телин поделился в блоге на dev.to 50 самыми популярными вопросами на собеседовании по TypeScript и ответами на них. Мы разбили подборку на четыре части. Первую часть можно посмотреть здесь, вторую здесь. В третью часть вошли девять вопросов о связи между TypeScript и JavaScript и продвинутые вопросы.

18. Как TypeScript связан с JavaScript?

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

TypeScript также может взаимодействовать с большинством тех же технологий, что и JavaScript, такими как Angular и jQuery.

19. Что такое JSX в TypeScript?

JSX — это встраиваемый XML-подобный синтаксис, который позволяет создавать HTML. TypeScript поддерживает встраивание, проверку типов и компиляцию JSX непосредственно в JavaScript.

20. Какие режимы JSX поддерживает TypeScript?

TypeScript имеет встроенную поддержку для режимов preserve, react и react-native.

preserve сохраняет JSX без изменений для использования в последующем преобразовании;
react не выполняет преобразование JSX, а вместо этого генерирует метод react.createElement и выводит его как файл с расширением .js;
react-native сочетает в себе свойства режимов preserve и react: поддерживает весь JSX и выводит его как файл с расширением .js.

21. Как скомпилировать файл TypeScript?

Для этого нужно вызвать компилятор TypeScript tsc. Компилятор устанавливается с помощью менеджера пакетов npm:

npm install -g typescript
tsc <TypeScript File Name>

22. Какие области видимости доступны в TypeScript? Как это связано с JavaScript?

Глобальная область: определяется вне любого класса и может использоваться в любом месте программы;

Область видимости функции/класса: переменные, определенные в функции или классе, которые могут использоваться в любом месте в пределах этой области;
Локальная область действия/область действия блока: переменные, определенные в локальной области видимости, могут использоваться в любом месте этого блока.

Продвинутые вопросы по TypeScript

23. Что такое стрелочные/лямбда-функции?

Стрелочные функции — это сокращенный синтаксис для определения функциональных выражений анонимных функций. Это похоже на лямбда-функции в других языках программирования. Стрелочная функция позволяет пропустить ключевое слово function и написать более короткий код.

24. Объясните, что такое Rest-параметры и правила их объявления

Rest-параметры позволяют передавать функции различное количество аргументов (ноль и более). Это полезно, когда нет информации о том, сколько параметров получит функция. Все аргументы после оставшегося символа … будут сохранены в массиве. Например:

function Greet(greeting: string, ...names: string[]) {
    return greeting + " " + names.join(", ") + "!";
}

Greet("Hello", "Steve", "Bill"); // returns "Hello Steve, Bill!"

Greet("Hello");// returns "Hello !"

Rest-параметр должен быть последним в определении параметра, при этом может быть только один rest-параметр на функцию.

25. Что такое директивы с тремя наклонными чертами (Triple-Slash Directives)? Какие они бывают?

Директивы с тремя наклонными чертами — это однострочные комментарии, содержащие тег XML для использования в качестве директив компилятора. Каждая директива указывает, что загружать в процесс компиляции. Директивы с тремя наклонными чертами работают только в верхней части своего файла и будут рассматриваться как обычные комментарии в любом другом месте файла.

/// <reference path=”…” /> — наиболее распространенная директива, которая определяет зависимость между файлами;
/// <reference types=”…” /> — определяет зависимость для пакета;
/// <reference lib=”…” /> — позволяет исключить встроенный файл «lib».

26.Что делает тип Omit?

Omit — это форма служебного типа, которая упрощает преобразование общих типов. Omit позволяет создать тип, передав текущий Type и выбрав Keys, которые нужно пропустить в новом типе.

Omit<Type, Keys>

Например:

interface Todo {
  title: string;
  description: string;
  completed: boolean;
  createdAt: number;
}

type TodoPreview = Omit<Todo, "description">;

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