Вопросы с собеседований по TypeScript

TypeScript – это надмножество JavaScript, предоставляющее строгую типизацию, поддержку классов и интерфейсов на этапе разработки. Применение TypeScript способствует повышению надёжности программ за счёт недопущения ряда ошибок на этапе кодирования. TypeScript компилируется в JavaScript, так что во время выполнения кода в браузере его уже не существует.

/* .d.ts */ declare class Vector { readonly x: number; readonly y: number; static readonly zero: Vector; constructor(x: number, y: number); add(vector: Vector): Vector; } .d.ts файлы - это файлы декларации типов. Они содержат описание типов без реализации. Например, сигнатуры функций без тела, название и тип глобальных переменных без значений. В основном файлы декларации типов нужны для написания библиотек или при их использовании.

Файлы с расширением .map хранят карты кода (source map), которые содержат данные о соответствии кода, написанного на TypeScript, JavaScript-коду, созданному на его основе. С этим файлами могут работать многие отладчики (например, Visual Studio и инструменты разработчика Chrome). Это позволяет в ходе отладки работать с исходным кодом программ на TypeScript, а не с их JS-эквивалентами.

class CRUD { @cache get() {} post() {} @log delete() {} put() {} } Декораторы используются для расширения поведения функций. Самые распространённые примеры - добавление декоратором возможности логирования или кэширования функции.

class Foo { myMethod(a: string); myMethod(a: number); myMethod(a: number, b: string); myMethod(a: any, b ? : string) { alert(a.toString()); } } TypeScript поддерживает перегрузку функций, но её реализация отличается от той, которую можно видеть в других языках. А именно, описывается лишь одна функция и некоторое количество её объявлений с разными параметрами. Когда такой код компилируется в JavaScript, в нём остаётся лишь одна функция. Этот механизм работает благодаря тому, что JS-функции можно вызывать с любым количеством параметров.

interface X { a: number b: string } type X = { a: number b: string }; В ряде случаев они взаимозаменяемы. Однако, различия присутствуют: - с типами можно использовать пересечение и объединение - интерфейс можно расширять, строя цепочку наследований - интерфейс может быть использован для описания класса - интерфейс может быть использован для описания функции - в случае, если в одной области видимости объявлено несколько одноимённых интерфейсов, они будут объединены в один - если в нескольких одноимённых интерфейсах будут описаны одноимённые методы с разными сигнатурами, они будут расценены, как описание перегрузки. В целом, можно сказать, что ключевое слово type больше подходит для типизации примитивных значений или объектных значений, не являющихся звеньями сложной цепочки. interface же необходим и удобен при осознанном построении объектно-ориентированной архитектуры.

Nullish Coalescing (оператор ??) помогает проверить, является ли переменная null или undefined. С оператором ?? вместо длинной проверки: message = undefined; getMessage() { if (this.message !== null && this.message !== undefined) { return "default message"; } return this.message; } можно написать так: message = undefined; getMessage() { return this.message ?? 'Default message'; }

В TypeScript при объявлении свойств классов нельзя использовать ключевое слово const. Начиная со второй версии TS, можно использовать модификатор readonly, позволяющий объявлять свойства класса, предназначенные только для чтения.

Пространства имен в TypeScript — это способ организации и группировки связанного кода. Они помогают избежать столкновения имен и способствуют модульности, инкапсулируя связанный код. Пространства имен могут содержать классы, интерфейсы, функции, переменные и другие пространства имен. Определение пространств имен Чтобы определить пространство имен, используйте ключевое слово namespace, за которым следует имя пространства имен. Затем можно добавить любой связанный код внутри фигурных скобок. namespace MyNamespace { export class MyClass { constructor(public value: number) {} displayValue() { console.log(`The value is: ${this.value}`); } } } В этом примере определяем пространство имен MyNamespace и добавляем в него класс MyClass. Учтите, что ключевое слово export используется, чтобы сделать класс доступным за пределами пространства имен. Применение пространств имен Чтобы применить код из пространства имен, можно либо использовать полностью определенное имя, либо импортировать код с помощью импорта пространства имен. // Использование полностью определенного имени const instance1 = new MyNamespace.MyClass(5); instance1.displayValue(); // Вывод: Значение - 5 // Использование импорта пространства имен import MyClass = MyNamespace.MyClass; const instance2 = new MyClass(10); instance2.displayValue(); // Вывод: Значение - 10 Этот пример демонстрирует два способа использования класса MyClass из пространства имен MyNamespace. В первом случае используем полностью определенное имя MyNamespace.MyClass. Во втором — применяем оператор импорта пространства имен, чтобы импортировать класс MyClass и использовать его с более коротким именем. Вложенные пространства имен Пространства имен могут быть вложенными для создания иерархии и дальнейшей организации кода. namespace OuterNamespace { export namespace InnerNamespace { export class MyClass { constructor(public value: number) {} displayValue() { console.log(`The value is: ${this.value}`); } } } } // Использование полностью определенного имени const instance = new OuterNamespace.InnerNamespace.MyClass(15); instance.displayValue(); // Вывод: Значение - 15 В этом примере определяем вложенное пространство имен InnerNamespace внутри OuterNamespace. Затем определяем класс MyClass внутри вложенного пространства имен и используем его с полным именем OuterNamespace.InnerNamespace.MyClass.