Дмитрий Нечаев
Интерфейсы в TypeScript
Интерфейсы в TypeScript позволяют определять структуру объектов, включая их свойства и методы, без предоставления конкретной реализации.
Определение интерфейсов
Интерфейсы определяются с помощью ключевого слова interface
. Они описывают, какие свойства и методы должен иметь объект.
Пример простого интерфейса
interface Person {
name: string;
age: number;
}
let user: Person = {
name: "John",
age: 30
};
console.log(user.name); // "John"
console.log(user.age); // 30
В этом примере интерфейс Person
определяет два свойства: name
и age
. Переменная user
соответствует этому интерфейсу, так как содержит оба свойства.
Необязательные свойства
Интерфейсы могут включать необязательные свойства. Такие свойства определяются с помощью знака вопроса (?
).
Пример интерфейса с необязательными свойствами
interface Person {
name: string;
age?: number; // свойство age необязательно
}
let user1: Person = {
name: "Alice"
};
let user2: Person = {
name: "Bob",
age: 25
};
console.log(user1.name); // "Alice"
console.log(user2.age); // 25
В этом примере свойство age
является необязательным, поэтому объект может его не содержать.
Интерфейсы для функций
Интерфейсы могут описывать сигнатуры функций, указывая типы параметров и возвращаемое значение.
Пример интерфейса для функции
interface SearchFunc {
(source: string, subString: string): boolean;
}
let mySearch: SearchFunc;
mySearch = function(source: string, subString: string): boolean {
return source.indexOf(subString) > -1;
}
console.log(mySearch("Hello, world", "world")); // true
В этом примере интерфейс SearchFunc
описывает функцию, которая принимает два строковых параметра и возвращает логическое значение. Переменная mySearch
реализует этот интерфейс.
Интерфейсы для массивов
Интерфейсы могут использоваться для описания типов массивов и других коллекций.
Пример интерфейса для массива
interface StringArray {
[index: number]: string;
}
let myArray: StringArray;
myArray = ["Bob", "Alice"];
console.log(myArray[0]); // "Bob"
console.log(myArray[1]); // "Alice"
В этом примере интерфейс StringArray
описывает массив строк, где каждый элемент имеет тип string
.
Интерфейсы для классов
Интерфейсы могут использоваться для описания структуры классов. Класс, реализующий интерфейс, должен содержать все свойства и методы, указанные в интерфейсе.
Пример интерфейса для класса
interface ClockInterface {
currentTime: Date;
setTime(d: Date): void;
}
class Clock implements ClockInterface {
currentTime: Date;
constructor(h: number, m: number) {
this.currentTime = new Date();
this.currentTime.setHours(h, m);
}
setTime(d: Date): void {
this.currentTime = d;
}
}
let clock = new Clock(12, 0);
console.log(clock.currentTime); // текущее время
clock.setTime(new Date());
console.log(clock.currentTime); // обновленное время
В этом примере класс Clock
реализует интерфейс ClockInterface
, что означает, что он должен содержать свойство currentTime
и метод setTime
.
Расширение интерфейсов
Интерфейсы могут расширять другие интерфейсы, создавая новые интерфейсы на основе существующих.
Пример расширения интерфейсов
interface Shape {
color: string;
}
interface Square extends Shape {
sideLength: number;
}
let square: Square = {
color: "blue",
sideLength: 10
};
console.log(square.color); // "blue"
console.log(square.sideLength); // 10
В этом примере интерфейс Square
расширяет интерфейс Shape
, добавляя новое свойство sideLength
.
Гибридные интерфейсы
Интерфейсы могут комбинировать описание свойств и методов, а также функции.
Пример гибридного интерфейса
interface Counter {
(start: number): string;
interval: number;
reset(): void;
}
function getCounter(): Counter {
let counter = <Counter>function (start: number): string {
return `Start from ${start}`;
};
counter.interval = 123;
counter.reset = function () {
console.log("Counter reset");
};
return counter;
}
let c = getCounter();
console.log(c(10)); // "Start from 10"
c.reset(); // "Counter reset"
console.log(c.interval); // 123
В этом примере интерфейс Counter
описывает функцию, которая принимает один параметр и возвращает строку, а также содержит свойство interval
и метод reset
.
Заключение
Интерфейсы в TypeScript являются мощным инструментом для определения структур объектов, описания сигнатур функций и классов. Они обеспечивают строгую типизацию и позволяют создавать более надежный и понятный код. Использование интерфейсов способствует повышению гибкости и расширяемости кода, облегчая его поддержку и развитие.
Карта развития разработчика
Получите полную карту развития разработчика по всем направлениям: frontend, backend, devops, mobile