HTML Diff
0 added 0 removed
Original 2026-01-01
Modified 2026-02-26
1 <p>В этом уроке мы разберем использование интерфейсов. Их работа похожа на работу типов в TypeScript, однако есть и свои особенности.</p>
1 <p>В этом уроке мы разберем использование интерфейсов. Их работа похожа на работу типов в TypeScript, однако есть и свои особенности.</p>
2 <h2>Расширение интерфейса дополнительными полями</h2>
2 <h2>Расширение интерфейса дополнительными полями</h2>
3 <p>Если интерфейс необходимо расширить дополнительными полями после его инициализации, мы можем повторно объявить интерфейс с новыми свойствами. Такой способ называется "слиянием деклараций":</p>
3 <p>Если интерфейс необходимо расширить дополнительными полями после его инициализации, мы можем повторно объявить интерфейс с новыми свойствами. Такой способ называется "слиянием деклараций":</p>
4 <p>Здесь мы создали интерфейс IUser, а затем для демонстрационных целей расширили его новыми свойствами. После этого создали на его основе объект Sergey.</p>
4 <p>Здесь мы создали интерфейс IUser, а затем для демонстрационных целей расширили его новыми свойствами. После этого создали на его основе объект Sergey.</p>
5 <h2>Расширение интерфейса с помощью другого интерфейса</h2>
5 <h2>Расширение интерфейса с помощью другого интерфейса</h2>
6 <p>Также мы можем расширить интерфейс с помощью создания другого интерфейса, который наследуется от него:</p>
6 <p>Также мы можем расширить интерфейс с помощью создания другого интерфейса, который наследуется от него:</p>
7 <p>В этом примере мы создали на основе нашего предыдущего интерфейса IUser еще один - IStudent, в который добавили свойство group. Так интерфейс IStudent имеет все свойства IUser и все свойства, которые мы указали при его расширении от IUser, то есть дополнительно group.</p>
7 <p>В этом примере мы создали на основе нашего предыдущего интерфейса IUser еще один - IStudent, в который добавили свойство group. Так интерфейс IStudent имеет все свойства IUser и все свойства, которые мы указали при его расширении от IUser, то есть дополнительно group.</p>
8 <h2>Расширение нескольких интерфейсов</h2>
8 <h2>Расширение нескольких интерфейсов</h2>
9 <p>Еще интерфейсы могут расширять сразу несколько других интерфейсов:</p>
9 <p>Еще интерфейсы могут расширять сразу несколько других интерфейсов:</p>
10 <p>В примере выше мы создали экземпляр на основе интерфейса IAuthor, который был создан путем расширения интерфейсов IUser и IEditor. Этот экземпляр взял в себя все свойства данных интерфейсов и свойство, которое мы указали при создании самого интерфейса IAuthor.</p>
10 <p>В примере выше мы создали экземпляр на основе интерфейса IAuthor, который был создан путем расширения интерфейсов IUser и IEditor. Этот экземпляр взял в себя все свойства данных интерфейсов и свойство, которое мы указали при создании самого интерфейса IAuthor.</p>
11 <h2>Создание intersection types</h2>
11 <h2>Создание intersection types</h2>
12 <p>Также TypeScript позволяет нам создавать перекрестные типы (<em>intersection types</em>) из нескольких интерфейсов с помощью литерала &amp;:</p>
12 <p>Также TypeScript позволяет нам создавать перекрестные типы (<em>intersection types</em>) из нескольких интерфейсов с помощью литерала &amp;:</p>
13 <p>Здесь мы создали тип OneWayOrAnother на основе двух интерфейсов при помощи литерала &amp;. Данный тип включил в себя все свойства указанных интерфейсов.</p>
13 <p>Здесь мы создали тип OneWayOrAnother на основе двух интерфейсов при помощи литерала &amp;. Данный тип включил в себя все свойства указанных интерфейсов.</p>
14 <p>Между созданием перекрестных типов и расширением интерфейсов нет существенных отличий. Почти всегда эти действия будут взаимозаменяемыми, поэтому это скорее вопрос удобства. Но существуют исключения: иногда расширение интерфейса<a>ведет себя не так</a>, как создание перекрестного типа.</p>
14 <p>Между созданием перекрестных типов и расширением интерфейсов нет существенных отличий. Почти всегда эти действия будут взаимозаменяемыми, поэтому это скорее вопрос удобства. Но существуют исключения: иногда расширение интерфейса<a>ведет себя не так</a>, как создание перекрестного типа.</p>
15 <p>Иногда мы не знаем заранее всех свойств, которые будут содержаться в нашем интерфейсе, но нам известно их возможное содержание. В таком случае удобно использовать специальную индексную сигнатуру, которая позволяет описать типы возможных значений:</p>
15 <p>Иногда мы не знаем заранее всех свойств, которые будут содержаться в нашем интерфейсе, но нам известно их возможное содержание. В таком случае удобно использовать специальную индексную сигнатуру, которая позволяет описать типы возможных значений:</p>
16 <p>В примере выше мы создали телефонную книгу с помощью индексной сигнатуры. Это позволило нам не указывать множество свойств с именами, а всего лишь один раз указать тип ключа и тип его значения.</p>
16 <p>В примере выше мы создали телефонную книгу с помощью индексной сигнатуры. Это позволило нам не указывать множество свойств с именами, а всего лишь один раз указать тип ключа и тип его значения.</p>
17 <p>Так интерфейсы - это еще один мощный инструмент в TypeScript наряду с типами. Он позволяет гибко описать наши данные. Интерфейс удобно поддается расширению и объединению с другими типами или интерфейсами.</p>
17 <p>Так интерфейсы - это еще один мощный инструмент в TypeScript наряду с типами. Он позволяет гибко описать наши данные. Интерфейс удобно поддается расширению и объединению с другими типами или интерфейсами.</p>