Getters и Setters

Тренажер по TypeScript для пользователей с начальным уровнем подготовки.

Тренажер по TypeScript

В объектно-ориентированном программировании на TypeScript важно контролировать доступ к свойствам объекта. Для этого используются аксессоры: геттеры (get) и сеттеры (set). Это специальные методы, которые работают как свойства.

Геттер позволяет выполнить код при чтении значения (например, вычислить полное имя из имени и фамилии), а сеттер — при записи (например, проверить, что возраст не отрицательный). Это основа инкапсуляции. Ваш код становится безопаснее, а использование классов — гибким. В этом уроке мы разберем синтаксис get и set, научимся валидировать данные при присваивании и создавать вычисляемые свойства.

Список тем

1. Выбор ключевого слова

id: 40708_ts_class_get_set_01

В данном задании представлен фрагмент кода класса TypeScript с приватным свойством `_name`. Вам необходимо заполнить пропуски, выбрав из выпадающего списка правильные ключевые слова для объявления методов доступа (геттера и сеттера). Обратите внимание на синтаксис TypeScript для get и set. Код состоит из 8 строк, включая объявление класса, конструктор и методы.

Нужно правильно расставить в пропуски предложенные варианты
class Person {
  private _name: string;

  constructor(name: string) {
    this._name = name;
  }

  input1S name(): string {
    return this._name;
  }

  input2S name(newName: string) {
    this._name = newName;
  }
}
Сообщения
Проверить
Показать решение на 3 сек.
Показать подсказку

2. Синтаксис сеттера

id: 40708_ts_class_get_set_02

В этом задании вам нужно дополнить объявление сеттера в классе `User`. В коде уже есть приватное свойство `_age` и геттер для него, но сеттер объявлен не полностью. Вам необходимо вписать ключевое слово, которое начинается объявление сеттера, и имя свойства, которое будет использоваться для установки значения. После правильного заполнения пропусков код должен корректно создавать экземпляр класса, устанавливать возраст через сеттер и выводить его значение в консоль.

Заполните пропуски
class User {
  private _age: number = 0;

  get age(): number {
    return this._age;
  }

  input1S input2S(value: number) {
    if (value > 0) {
      this._age = value;
    }
  }
}

const user = new User();
user.age = 25;
console.log(user.age);
Сообщения
Проверить
Показать решение на 3 сек.
Показать подсказку

3. Ошибка в логике присваивания

id: 40708_ts_class_get_set_03

В данном фрагменте кода TypeScript представлен класс User с геттером и сеттером для свойства password. Сеттер должен проверять длину пароля и присваивать его приватному полю. Однако в коде допущена логическая ошибка: в сеттере происходит некорректное обращение к полю, что может привести к непредсказуемому поведению (например, бесконечной рекурсии). Найдите и исправьте одну строку, чтобы сеттер корректно сохранял значение в приватное поле при выполнении условия.

Найдите ошибку и исправьте
class User {
    private _password: string = '';
 
    set password(value: string) {
        if (value.length >= 8) {
            this.password = value;
        } else {
            console.log('Пароль должен содержать не менее 8 символов');
        }
    }
 
    get password(): string {
        return this._password;
    }
}
Сообщения
Проверить
Показать решение на 3 сек.
Показать подсказку

4. Вывод вычисляемого свойства

id: 40708_ts_class_get_set_04

Дан класс Rectangle с приватными полями для ширины и высоты, а также геттером area для вычисления площади. В коде создается экземпляр класса, после чего значения его свойств изменяются через сеттеры. Проанализируйте приведенный код и определите, какое значение будет выведено в консоль при обращении к геттеру area после всех изменений. Обратите внимание на то, как геттер вычисляет значение на основе текущих данных объекта.

Выберите правильный вариант ответа
class Rectangle {
  private _width: number;
  private _height: number;

  constructor(width: number, height: number) {
    this._width = width;
    this._height = height;
  }

  get area(): number {
    return this._width * this._height;
  }

  set width(value: number) {
    this._width = value;
  }

  set height(value: number) {
    this._height = value;
  }
}

const rect = new Rectangle(10, 5);
rect.width = 20;
rect.height = 10;
console.log(rect.area);
Сообщения
Проверить
Показать подсказку

5. Сборка класса с валидацией

id: 40708_ts_class_get_set_05

Из предложенных строк соберите корректный класс TypeScript `BankAccount`, который включает приватное поле для баланса, геттер для его получения и сеттер с проверкой на отрицательное значение. Игнорируйте лишние строки, которые не должны входить в решение. Класс должен быть собран в правильном порядке: объявление класса, приватного поля, геттера и сеттера (или сеттера и геттера — порядок этих двух методов между собой не важен).

Перетяните в правильном порядке строки из одного блока в другой
class BankAccount {
  private _balance: number = 0;
  get balance(): number {
    return this._balance;
  }
  set balance(newBalance: number) {
    if (newBalance >= 0) {
      this._balance = newBalance;
    } else {
      console.log("Баланс не может быть отрицательным");
    }
  }
}
  private balance: number = 0;
  set balance(newBalance: number) { this._balance = newBalance; }
  getBalance(): number { return this._balance; }
  console.log(this._balance);
Сообщения
Проверить
Показать решение на 3 сек.
Показать подсказку

6. Порядок работы сеттера

id: 40708_ts_class_get_set_06

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

class Person {
  private _age: number;

  set age(value: number) {
    if (value >= 0) {
      this._age = value;
    } else {
      console.log("Возраст не может быть отрицательным");
    }
  }

  get age(): number {
    return this._age;
  }
}

const person = new Person();
person.age = 25;
console.log(person.age);
Расположите элементы в логичном порядке
Проверка условия value >= 0 внутри сеттера
Создание объекта класса Person
Завершение работы сеттера (возврат управления)
Присваивание значения 25 приватному полю _age
Вызов сеттера age с аргументом 25
Условие истинно, выполняется ветка if
Сообщения
Проверить
Показать подсказку

7. Поиск использования геттера

id: 40708_ts_class_get_set_07

Внимательно изучите приведённый код на TypeScript, содержащий класс с геттерами, сеттерами и обычными методами. Ваша задача — найти и отметить все места в коде, где происходит именно чтение значения через геттер. Обратите внимание, что геттеры выглядят как свойства (обращение без скобок) и используются для получения данных. Не отмечайте вызовы обычных методов, присваивание значений через сеттеры или прямые обращения к приватным полям.

Кликните по всем фрагментам, которые подходят под условие задания.
class Employee {
  private _firstName: string;
  private _lastName: string;
  private _birthYear: number;
  private _salary: number;

  constructor(firstName: string, lastName: string, birthYear: number, salary: number) {
    this._firstName = firstName;
    this._lastName = lastName;
    this._birthYear = birthYear;
    this._salary = salary;
  }

  // Геттер для полного имени
  get {{fullName~|~t1}}(): string {
    return `${this._firstName} ${this._lastName}`;
  }

  // Геттер для вычисления возраста
  get {{age~|~t2}}(): number {
    const currentYear = new Date().getFullYear();
    return currentYear - this._birthYear;
  }

  // Сеттер для зарплаты с проверкой
  set salary(value: number) {
    if (value >= 0) {
      this._salary = value;
    }
  }

  // Геттер для форматированной зарплаты
  get {{formattedSalary~|~t3}}(): string {
    return `$${this._salary.toFixed(2)}`;
  }

  // Обычный метод для вывода информации
  printInfo(): void {
    console.log(`Employee: {{this.fullName~|~t4}}, Age: {{this.age~|~t5}}, Salary: {{this.formattedSalary~|~t6}}`);
  }

  // Метод для проверки пенсионного возраста
  isRetirementAge(): boolean {
    return {{this.age~|~t7}} >= 65;
  }
}

// Использование класса
const emp = new Employee("John", "Doe", 1985, 75000);

console.log({{emp.fullName~|~t8}});
console.log(`Age is: ${ {{emp.age~|~t9}} }`);

{{emp.salary~|~t10}} = 80000; // сеттер
console.log(`New salary: ${ {{emp.formattedSalary~|~t11}} }`);

const info = {{emp.printInfo~|~t12}}(); // вызов метода
const canRetire = emp.isRetirementAge();

// Прямое обращение к приватному полю (не геттер)
// console.log(emp._firstName); // ошибка доступа
Сообщения
Проверить
Показать подсказку

TypeScript: компиляция и запуск

id: 40708_compiler

Этот пример научит вас контролировать доступ к свойствам объекта с помощью геттеров и сеттеров. Попробуйте изменить логику проверки в сеттере — например, установите свои границы допустимых температур или добавьте логгирование. Поэкспериментируйте: добавьте новый геттер для перевода значений в другие единицы или создайте новое приватное поле с валидацией. Не бойтесь менять условия и смотреть, как TypeScript помогает защитить данные от записи некорректных значений!

TS
Запустить тренажёр (TypeScript)
НайтиКурс.Ру