TypeScript Academy · Урок

ReadonlyArray и ReadonlyMap

Используйте встроенные типы неизменяемых коллекций

«ReadonlyArray и ReadonlyMap» — бесплатный урок TypeScript Academy на CoddyKit. Это урок 3 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения TypeScript Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс TypeScript Academy содержит 4 уроков всего.

Типы неизменяемых коллекций

Помимо массивов, TypeScript предоставляет неизменяемые варианты встроенных коллекций: ReadonlyArray<T>, ReadonlyMap<K, V> и ReadonlySet<T>. Каждый из них предоставляет только не изменяющие данные части своего программного интерфейса.

const arr: ReadonlyArray<number> = [1, 2, 3];
console.log(arr.length, arr.includes(2));

Повторение ReadonlyArray

ReadonlyArray<T> поддерживает перебор, доступ по индексу и такие методы, как map и filter, но не поддерживает push, pop или присваивание по индексу. Это массивный вариант семейства неизменяемых коллекций.

const tags: ReadonlyArray<string> = ['ts', 'js'];
console.log(tags.map((t) => t.toUpperCase()));
// tags.push('css'); // Error

ReadonlyMap

ReadonlyMap<K, V> позволяет искать значения, выполнять перебор и проверять ключи, но не предоставляет set, delete и clear. С точки зрения потребителя содержимое карты неизменно.

const ages: ReadonlyMap<string, number> = new Map([['Ada', 30], ['Sam', 25]]);
console.log(ages.get('Ada'), ages.has('Sam'));
// ages.set('Lee', 40); // Error

Чтение из ReadonlyMap

Все операции чтения сохраняются: get, has, size, keys, values, entries и перебор. Удаляются только изменяющие данные методы.

const m: ReadonlyMap<string, number> = new Map([['a', 1], ['b', 2]]);
for (const [k, v] of m) {
  console.log(k, v);
}
console.log('size:', m.size);

ReadonlySet

ReadonlySet<T> поддерживает проверку принадлежности и перебор, но не предоставляет add, delete и clear. Используйте его для фиксированных множеств разрешённых значений.

const allowed: ReadonlySet<string> = new Set(['read', 'write']);
console.log(allowed.has('read'), allowed.has('delete'));
// allowed.add('admin'); // Error

Перебор ReadonlySet

Вы можете выполнять перебор ReadonlySet и читать его size, но не можете изменять его содержимое. Поэтому он отлично подходит для белых списков и наборов разрешений.

const perms: ReadonlySet<string> = new Set(['view', 'edit']);
perms.forEach((p) => console.log('perm:', p));
console.log('count:', perms.size);

Передача неизменяемых коллекций в функции

Принимайте тип неизменяемой коллекции в функциях, которым нужно только читать данные. Это сообщает о намерении и не позволяет функции изменять данные, принадлежащие вызывающему коду.

function describe(set: ReadonlySet<string>): string {
  return 'has ' + set.size + ' items';
}
const s = new Set(['x', 'y']);
console.log(describe(s));

Изменяемые коллекции совместимы с неизменяемыми

Обычный Map или Set можно присвоить его неизменяемому аналогу, поскольку Вы сужаете возможности, а не расширяете их. Функция просто отказывается от права изменять данные.

function keys(m: ReadonlyMap<string, number>): string[] {
  return Array.from(m.keys());
}
const real = new Map([['a', 1]]);
console.log(keys(real));

Программные интерфейсы неизменяемых коллекций

Типы неизменяемых коллекций описывают неизменяемое представление. Сам объект в другом месте всё ещё может быть изменяемым; тип неизменяемой коллекции лишь ограничивает действия, доступные через эту ссылку.

const backing = new Set<number>([1, 2]);
const view: ReadonlySet<number> = backing;
// view.add(3); // Error through the readonly view
backing.add(3); // but the original can still mutate
console.log(view.size);

Выбор подходящего типа неизменяемой коллекции

Подбирайте тип неизменяемой коллекции под структуру данных: ReadonlyArray для упорядоченных списков, ReadonlyMap для поиска по парам «ключ — значение», ReadonlySet для уникальных элементов. Каждый тип обеспечивает неизменяемость своей структуры.

const roles: ReadonlySet<string> = new Set(['admin', 'user']);
const limits: ReadonlyMap<string, number> = new Map([['admin', 100]]);
console.log(roles.has('user'), limits.get('admin'));

Более безопасное общее состояние

Предоставление внутренних коллекций как неизменяемых типов не позволяет вызывающему коду повредить состояние Вашего модуля. Вызывающий код может свободно просматривать данные, но изменять их может только Ваша программа.

class Registry {
  private items = new Set<string>();
  add(name: string): void { this.items.add(name); }
  get all(): ReadonlySet<string> { return this.items; }
}
const r = new Registry();
r.add('a');
console.log(r.all.has('a'));

Быстрая проверка

Проверьте, насколько хорошо Вы поняли типы неизменяемых коллекций.

Итоги: неизменяемые коллекции

Вы изучили семейство неизменяемых коллекций:

ReadonlyArray<T>, ReadonlyMap<K, V> и ReadonlySet<T> предоставляют только операции чтения.
Изменяющие данные методы (set, add, delete, push) удалены.
Изменяемые коллекции можно присваивать их неизменяемым аналогам.
Они отлично подходят для типов параметров и возвращаемых значений, обеспечивая более безопасное общее состояние.

Наконец, мы рассмотрим способы глубокой неизменяемости.

function count(s: ReadonlySet<number>): number {
  return s.size;
}
console.log(count(new Set([1, 2, 3])));

Часто задаваемые вопросы

Урок «ReadonlyArray и ReadonlyMap» бесплатный?

Да — полный текст урока «ReadonlyArray и ReadonlyMap» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс TypeScript Academy, подпишись на CoddyKit PRO. Курс TypeScript Academy содержит 4 уроков всего.

Чему я научусь в уроке «ReadonlyArray и ReadonlyMap»?

Используйте встроенные типы неизменяемых коллекций Ты практикуешь TypeScript Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.

Нужен ли мне опыт, чтобы начать TypeScript Academy?

Предыдущий опыт не требуется. TypeScript Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 3 из 4.

Сколько времени занимает урок «ReadonlyArray и ReadonlyMap»?

Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.

Можно ли писать и запускать код в этом уроке TypeScript Academy?

Да. Каждый урок TypeScript Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.

Все уроки этого курса

← Назад к TypeScript Academy