유효성 검사와 부수 효과

Coddy JavaScript 여정의 객체 지향 프로그래밍 섹션에 포함된 레슨. 56개 중 45번째.

Getter와 setter는 속성을 읽고 쓰는 것 이상으로, 입력값을 검증하고 값이 변경될 때 부수 효과를 발생시킬 수도 있습니다.

유효성 검사를 포함한 User 클래스를 만들어 보겠습니다:

class User {
  constructor(name, age) {
    this._name = name;
    this._age = age;
  }
  get age() {
    return this._age;
  }
  set age(value) {
    // 나이가 숫자이고 합리적인 범위 내에 있는지 검증
    if (typeof value !== 'number') {
      throw new Error('Age must be a number');
    }
    if (value < 0 || value > 120) {
      throw new Error('Age must be between 0 and 120');
    }
    this._age = value;
    // 부작용: 나이가 변경될 때 로그
    console.log(`Age updated to ${value}`);
  }
}

이제 setter를 사용하면 유효성 검사가 자동으로 수행됩니다:

const user = new User('Alice', 25);
// 이것은 작동합니다
user.age = 30;  // 로그: "Age updated to 30"
// 이것은 오류를 발생시킵니다
user.age = -5;  // 오류: Age는 0과 120 사이여야 합니다
// 이것도 오류를 발생시킵니다
user.age = "thirty";  // 오류: Age는 숫자여야 합니다

유효성 검사 = 값을 저장하기 전에 유효한지 확인하는 것
부수 효과 = 속성이 변경될 때 발생하는 추가 작업

챌린지

기본 세터가 있는 BankAccount 클래스가 주어졌습니다. 여러분의 과제는 balance 세터를 완성하는 것입니다.

세터에 다음을 추가하세요:

유효성 검사: value가 숫자가 아니거나 0보다 작은지 확인하세요. 그렇다면 console.log("Invalid balance")를 실행하고 return을 사용하여 세터를 종료하세요.
부수 효과: 유효한 값을 저장한 후 console.log(\`Balance updated to $${value}\`)를 실행하세요.

직접 해보기

import { BankAccount } from './account.js';

// 테스트 케이스
const account = new BankAccount("Savings");

// 테스트 1: 유효한 잔액
account.balance = 100;
console.log(account.balance);

// Test 2: Invalid balance (negative)
account.balance = -50;
console.log(account.balance);

// Test 3: Invalid balance (not a number)
account.balance = "abc";
console.log(account.balance);