{"type":"doc","content":[{"type":"heading","attrs":{"textAlign":null,"level":2},"content":[{"type":"text","text":"🧩 1. Что делает "},{"type":"text","marks":[{"type":"code"}],"text":"Readonly"}]},{"type":"blockquote","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"code"}],"text":"Readonly"},{"type":"text","text":" делает "},{"type":"text","marks":[{"type":"bold"}],"text":"все свойства объекта только для чтения"},{"type":"text","text":" —"},{"type":"hardBreak"},{"type":"text","text":"т.е. их "},{"type":"text","marks":[{"type":"bold"}],"text":"нельзя изменять, переопределять или удалять"},{"type":"text","text":" после создания объекта."}]}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":3},"content":[{"type":"text","text":"🔹 Пример"}]},{"type":"codeBlock","attrs":{"language":"javascript"},"content":[{"type":"text","text":"interface User {\n id: number;\n name: string;\n}\n\nconst user: Readonly = {\n id: 1,\n name: \"Тим\",\n};\n\nuser.name = \"Макс\"; // ❌ Ошибка: нельзя изменить свойство \"name\"\n"}]},{"type":"blockquote","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"✅ Можно читать "},{"type":"text","marks":[{"type":"code"}],"text":"user.name"},{"type":"text","text":", но нельзя изменять."},{"type":"hardBreak"},{"type":"text","text":"TypeScript выдаёт ошибку ещё "},{"type":"text","marks":[{"type":"bold"}],"text":"на этапе компиляции"},{"type":"text","text":", до запуска кода."}]}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":2},"content":[{"type":"text","text":"⚙️ 2. Как "},{"type":"text","marks":[{"type":"code"}],"text":"Readonly"},{"type":"text","text":" устроен внутри"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Тип "},{"type":"text","marks":[{"type":"code"}],"text":"Readonly"},{"type":"text","text":" реализован через "},{"type":"text","marks":[{"type":"bold"}],"text":"mapped type"},{"type":"text","text":":"}]},{"type":"codeBlock","attrs":{"language":"javascript"},"content":[{"type":"text","text":"type Readonly = {\n readonly [P in keyof T]: T[P];\n};\n"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"🔍 Объяснение:"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"code"}],"text":"keyof T"},{"type":"text","text":" — берёт все ключи типа "},{"type":"text","marks":[{"type":"code"}],"text":"T"},{"type":"text","text":";"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"code"}],"text":"readonly"},{"type":"text","text":" — добавляет модификатор “только для чтения”;"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"code"}],"text":"T[P]"},{"type":"text","text":" — сохраняет оригинальный тип свойства."}]}]}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":2},"content":[{"type":"text","text":"🧠 3. Чем "},{"type":"text","marks":[{"type":"code"}],"text":"Readonly"},{"type":"text","text":" отличается от "},{"type":"text","marks":[{"type":"code"}],"text":"const"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Отличный вопрос — очень часто их путают."},{"type":"hardBreak"},{"type":"text","text":"Смотри различия 👇"}]},{"type":"table","content":[{"type":"tableRow","content":[{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Особенность"}]}]},{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"code"}],"text":"Readonly"}]}]},{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"code"}],"text":"const"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Применяется к"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"типу (объекту, интерфейсу, generic)"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"переменной"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Проверяется"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"на уровне "},{"type":"text","marks":[{"type":"bold"}],"text":"свойств"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"на уровне "},{"type":"text","marks":[{"type":"bold"}],"text":"ссылки"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Защищает"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"внутренние поля объекта"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"только саму переменную"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Место действия"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"в системе типов (TypeScript)"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"в рантайме (JavaScript)"}]}]}]}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":3},"content":[{"type":"text","text":"🔸 Пример сравнения"}]},{"type":"codeBlock","attrs":{"language":"javascript"},"content":[{"type":"text","text":"const user = { id: 1, name: \"Тим\" };\n\nuser.name = \"Макс\"; // ✅ Разрешено!\n"}]},{"type":"blockquote","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"code"}],"text":"const"},{"type":"text","text":" не позволяет "},{"type":"text","marks":[{"type":"bold"}],"text":"переназначить переменную"},{"type":"text","text":" "},{"type":"text","marks":[{"type":"code"}],"text":"user = ..."},{"type":"text","text":","},{"type":"hardBreak"},{"type":"text","text":"но изменять поля объекта можно."}]}]},{"type":"horizontalRule"},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"А вот с "},{"type":"text","marks":[{"type":"code"}],"text":"Readonly"},{"type":"text","text":":"}]},{"type":"codeBlock","attrs":{"language":"javascript"},"content":[{"type":"text","text":"const user: Readonly<{ id: number; name: string }> = {\n id: 1,\n name: \"Тим\",\n};\n\nuser.name = \"Макс\"; // ❌ Ошибка — свойство readonly\n"}]},{"type":"blockquote","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"💡 "},{"type":"text","marks":[{"type":"code"}],"text":"Readonly"},{"type":"text","text":" защищает "},{"type":"text","marks":[{"type":"bold"}],"text":"содержимое"},{"type":"text","text":","},{"type":"hardBreak"},{"type":"text","text":"а "},{"type":"text","marks":[{"type":"code"}],"text":"const"},{"type":"text","text":" — "},{"type":"text","marks":[{"type":"bold"}],"text":"саму переменную"},{"type":"text","text":" (ссылку)."}]}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":3},"content":[{"type":"text","text":"🔹 Объединённое использование"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Можно совместить "},{"type":"text","marks":[{"type":"code"}],"text":"const"},{"type":"text","text":" и "},{"type":"text","marks":[{"type":"code"}],"text":"Readonly"},{"type":"text","text":" для полной защиты:"}]},{"type":"codeBlock","attrs":{"language":"javascript"},"content":[{"type":"text","text":"const user: Readonly<{ id: number; name: string }> = {\n id: 1,\n name: \"Тим\",\n};\n"}]},{"type":"blockquote","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Теперь:"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"code"}],"text":"user"},{"type":"text","text":" нельзя переназначить (из-за "},{"type":"text","marks":[{"type":"code"}],"text":"const"},{"type":"text","text":");"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"code"}],"text":"user.name"},{"type":"text","text":" нельзя изменить (из-за "},{"type":"text","marks":[{"type":"code"}],"text":"Readonly"},{"type":"text","text":")."}]}]}]}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":2},"content":[{"type":"text","text":"⚡️ 4. Что произойдёт, если попытаться изменить свойство "},{"type":"text","marks":[{"type":"code"}],"text":"Readonly"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"TypeScript "},{"type":"text","marks":[{"type":"bold"}],"text":"заблокирует изменение на этапе компиляции"},{"type":"text","text":" —"},{"type":"hardBreak"},{"type":"text","text":"выдаст ошибку вроде:"}]},{"type":"codeBlock","attrs":{"language":"javascript"},"content":[{"type":"text","text":"Cannot assign to 'property' because it is a read-only property.\n"}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":3},"content":[{"type":"text","text":"🔹 Пример"}]},{"type":"codeBlock","attrs":{"language":"javascript"},"content":[{"type":"text","text":"interface Config {\n port: number;\n host: string;\n}\n\nconst cfg: Readonly = {\n port: 8080,\n host: \"localhost\",\n};\n\ncfg.port = 3000; // ❌ Ошибка: свойство только для чтения\n"}]},{"type":"blockquote","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"⚠️ В скомпилированном JavaScript это "},{"type":"text","marks":[{"type":"bold"}],"text":"не блокируется на уровне исполнения"},{"type":"hardBreak"},{"type":"text","text":"(TypeScript удаляет типы),"},{"type":"hardBreak"},{"type":"text","text":"но IDE и компилятор "},{"type":"text","marks":[{"type":"bold"}],"text":"не позволят тебе допустить ошибку в коде"},{"type":"text","text":"."}]}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":2},"content":[{"type":"text","text":"🧱 5. Readonly для массивов"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Можно сделать массив неизменяемым:"}]},{"type":"codeBlock","attrs":{"language":"javascript"},"content":[{"type":"text","text":"const nums: ReadonlyArray = [1, 2, 3];\n\nnums.push(4); // ❌ Ошибка\nnums[0] = 10; // ❌ Ошибка\n"}]},{"type":"blockquote","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"✅ Можно только читать элементы, но не изменять структуру."}]}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":2},"content":[{"type":"text","text":"🧩 6. Глубокая неизменяемость (Deep Readonly)"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Обычный "},{"type":"text","marks":[{"type":"code"}],"text":"Readonly"},{"type":"text","text":" защищает "},{"type":"text","marks":[{"type":"bold"}],"text":"только верхний уровень"},{"type":"text","text":"."},{"type":"hardBreak"},{"type":"text","text":"Вложенные объекты "},{"type":"text","marks":[{"type":"bold"}],"text":"остаются изменяемыми"},{"type":"text","text":"."}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":3},"content":[{"type":"text","text":"🔹 Пример:"}]},{"type":"codeBlock","attrs":{"language":"javascript"},"content":[{"type":"text","text":"interface User {\n id: number;\n profile: {\n name: string;\n city: string;\n };\n}\n\nconst u: Readonly = {\n id: 1,\n profile: { name: \"Тим\", city: \"Москва\" },\n};\n\nu.profile.city = \"Париж\"; // ✅ Разрешено! (Readonly только верхний уровень)\n"}]},{"type":"horizontalRule"},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Чтобы запретить изменения "},{"type":"text","marks":[{"type":"bold"}],"text":"внутри вложенных объектов"},{"type":"text","text":","},{"type":"hardBreak"},{"type":"text","text":"используй "},{"type":"text","marks":[{"type":"bold"}],"text":"DeepReadonly"},{"type":"text","text":":"}]},{"type":"codeBlock","attrs":{"language":"javascript"},"content":[{"type":"text","text":"type DeepReadonly = {\n readonly [P in keyof T]: T[P] extends object\n ? DeepReadonly\n : T[P];\n};\n\nconst deepUser: DeepReadonly = {\n id: 1,\n profile: { name: \"Тим\", city: \"Москва\" },\n};\n\ndeepUser.profile.city = \"Париж\"; // ❌ Ошибка\n"}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":2},"content":[{"type":"text","text":"✅ Итог"}]},{"type":"table","content":[{"type":"tableRow","content":[{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Вопрос"}]}]},{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Ответ"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"🔹 Что делает "},{"type":"text","marks":[{"type":"code"}],"text":"Readonly"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Делает все свойства типа только для чтения ("},{"type":"text","marks":[{"type":"code"}],"text":"readonly"},{"type":"text","text":")"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"🔹 Чем отличается от "},{"type":"text","marks":[{"type":"code"}],"text":"const"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"code"}],"text":"Readonly"},{"type":"text","text":" защищает "},{"type":"text","marks":[{"type":"bold"}],"text":"внутренние поля"},{"type":"text","text":", "},{"type":"text","marks":[{"type":"code"}],"text":"const"},{"type":"text","text":" — "},{"type":"text","marks":[{"type":"bold"}],"text":"саму переменную"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"🔹 Что произойдёт при попытке изменить"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"TypeScript выдаст ошибку “Cannot assign to '...' because it is a read-only property”"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"🔹 Работает ли глубоко"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Нет, только верхний уровень (для глубокой защиты — "},{"type":"text","marks":[{"type":"code"}],"text":"DeepReadonly"},{"type":"text","text":")"}]}]}]}]},{"type":"paragraph","attrs":{"textAlign":null}}]}

Что делает Readonly<T>?

Комментарии