В TypeScript часто важно гарантировать, что массив не будет изменен после создания. Для этого существуют Readonly массивы. Они предотвращают добавление, удаление или изменение элементов по индексу.
Объявить такой массив можно двумя способами: используя тип readonly Type[] или дженерик ReadonlyArray. Попытка вызвать методы мутации, такие как push, pop или splice, приведет к ошибке компиляции. Это способствует написанию более предсказуемого и функционального кода.
В этом блоке обучения вы узнаете, как защитить данные от случайных изменений. Интерактивные упражнения покажут разницу между обычными и readonly массивами, а также научат вас правильно типизировать параметры функций, которые только читают данные, но не меняют их.
- Модуль 1: Введение в TypeScript
- Модуль 2: Примитивные типы
- Модуль 3: Специальные типы
- Модуль 4: Массивы
- Модуль 5: Кортежи (Tuples)
- Модуль 6: Объекты
- Модуль 7: Функции
- Модуль 8: Union типы
- Модуль 9: Литеральные типы
- Модуль 10: Type Aliases
- Модуль 11: Интерфейсы
- Модуль 12: Type Guards и Narrowing
- Модуль 13: Enums
- Модуль 14: Классы
- Модуль 15: Generics — основы
- Модуль 16: Generics — ограничения
- Модуль 17: Utility Types — базовые
- Модуль 18: Utility Types — работа с Union
- Модуль 19: Utility Types — функции
- Модуль 20: Type Assertions
- Модуль 21: Keyof и Typeof операторы
- Модуль 22: Mapped Types
- Модуль 23: Conditional Types
- Модуль 24: Discriminated Unions
- Модуль 25: Модули и типы
- Модуль 26: Declaration Files
- Модуль 27: Типизация асинхронного кода
- Модуль 28: Практические паттерны
1. Модификатор readonly
В TypeScript для создания массивов, которые нельзя изменять после инициализации, используется модификатор `readonly`. Это позволяет предотвратить случайные изменения данных и повысить надёжность кода. Дополните приведённый фрагмент кода, объявив массив `coordinates` как доступный только для чтения. Вставьте пропущенное ключевое слово в указанное место, чтобы код успешно компилировался и соответствовал требованию неизменяемости массива.
// Объявите массив координат как неизменяемый
let coordinates: input1S number[] = [10, 20, 30];
// Теперь массив coordinates нельзя изменять2. Разрешенные и запрещенные методы
Перед вами список методов и свойств, которые используются при работе с массивами в TypeScript. Ваша задача — распределить их по двум категориям: 'Разрешено для Readonly массивов' и 'Запрещено (изменяющие)'. Обратите внимание, что ReadonlyArray в TypeScript предназначен для представления массивов, которые нельзя изменять после создания. Поэтому методы, изменяющие исходный массив, для него недопустимы.
pushmapfiltersplicepoplength3. Попытка мутации
В этом фрагменте TypeScript-кода объявлен readonly массив чисел, но затем предпринимается попытка изменить его содержимое через присваивание по индексу. Это приведёт к ошибке компиляции, поскольку readonly массивы не могут быть изменены после инициализации. Найдите строку с ошибкой и исправьте её, чтобы код мог выполниться без ошибок.
const numbers: readonly number[] = [1, 2, 3];numbers[0] = 10;console.log(numbers);4. Выбор правильного типа
В данном упражнении представлена функция, которая принимает массив чисел и возвращает их сумму, гарантируя, что исходный массив не будет изменён. Вам нужно выбрать из выпадающего списка подходящий тип для параметра функции, который обеспечит неизменяемость массива. Обратите внимание на синтаксис типов TypeScript для массивов только для чтения.
function sumArray(arr: input1S): number {
let total = 0;
for (let i = 0; i < arr.length; i++) {
total += arr[i];
}
return total;
}5. Чтение данных
В данном задании рассматривается чтение данных из readonly массива в TypeScript. Код ниже объявляет массив чисел с модификатором readonly, затем задаётся индекс и выводится значение элемента по этому индексу. Ваша задача — определить, какое число будет выведено в консоль, и ввести его в поле ответа. Введите только одно число без дополнительных символов.
const scores: readonly number[] = [85, 92, 78, 95, 88];
const idx = 1;
console.log(scores[idx]);6. Безопасная функция
Из предложенных строк соберите корректную функцию на TypeScript, которая принимает readonly массив строк и выводит каждый элемент в консоль. Функция не должна изменять исходный массив. Лишние строки в решение включать не нужно.
function printArray(arr: readonly string[]): void { for (const item of arr) { console.log(item); }} arr.push('new item');function printArray(arr: string[]): void {7. Синтаксис Generic Readonly
В данном задании вам нужно разметить синтаксис объявления Readonly массива в TypeScript. Обратите внимание на строку кода и выделите два элемента: имя типа-обертки (обобщённый тип, делающий массив доступным только для чтения) и тип содержимого массива (тип элементов, которые будут храниться внутри). Для разметки используйте доступные категории: «Тип-обёртка» и «Тип содержимого».
let a: {{ReadonlyArray~|~t1}}<{{number~|~t2}}>;