[JavaScirpt] class 생성자 / 매개변수

자바스크립트에서 클래스는 생성자(constructor)를 사용하여 객체가 생성될 때 초기값을 받아옵니다. 만약에 클래스에서 다른 형식의 정보를 받을 수 있도록 하려면, 생성자에서 매개변수를 유연하게 설정하거나 조건부 로직을 추가하는 방법을 사용할 수 있습니다.

1. 매개변수에 기본값 설정하기

먼저, 클래스 생성자에서 매개변수로 받는 값을 유연하게 설정할 수 있어요. 예를 들어, 매개변수의 개수나 형식이 다르더라도 기본값을 설정하거나, 조건에 따라 다른 값을 처리할 수 있습니다.

예시: 다양한 형식의 데이터를 받는 생성자

class Info {
  constructor(a, b, c = '기본값', d = '추가값') {
    this.a = a;  // 필수값
    this.b = b;  // 필수값
    this.c = c;  // 선택값 (기본값: '기본값')
    this.d = d;  // 선택값 (기본값: '추가값')
  }

  display() {
    console.log(`a: ${this.a}, b: ${this.b}, c: ${this.c}, d: ${this.d}`);
  }
}

const obj1 = new Info('a값', 'b값');  
obj1.display();  // a: a값, b: b값, c: 기본값, d: 추가값

const obj2 = new Info('a값', 'b값', 'c값');
obj2.display();  // a: a값, b: b값, c: c값, d: 추가값

const obj3 = new Info('a값', 'b값', 'c값', 'd값');
obj3.display();  // a: a값, b: b값, c: c값, d: d값

여기서 **c와 d**는 기본값이 있기 때문에, 매개변수가 주어지지 않으면 기본값이 사용됩니다. 그래서 다양한 형식으로 객체를 만들 수 있습니다.

2. 객체 속성의 조건에 따라 다른 값을 설정하기

클래스의 생성자 내에서 조건부 로직을 추가하여 매개변수의 값을 다르게 처리할 수도 있습니다. 예를 들어, 어떤 값이 없으면 다른 값을 넣도록 하거나, 받은 데이터를 처리해서 다른 형태로 설정할 수 있습니다.

예시: 조건에 따라 다른 값 설정하기

class FlexibleInfo {
  constructor(a, b, c) {
    this.a = a;  // 필수값
    this.b = b;  // 필수값

    // c 값에 따라 다르게 처리
    if (c === undefined) {
      this.c = '기본값';
    } else if (typeof c === 'string') {
      this.c = `문자열: ${c}`;
    } else {
      this.c = `숫자: ${c}`;
    }
  }

  display() {
    console.log(`a: ${this.a}, b: ${this.b}, c: ${this.c}`);
  }
}

const obj1 = new FlexibleInfo('a값', 'b값');
obj1.display();  // a: a값, b: b값, c: 기본값

const obj2 = new FlexibleInfo('a값', 'b값', '문자');
obj2.display();  // a: a값, b: b값, c: 문자열: 문자

const obj3 = new FlexibleInfo('a값', 'b값', 123);
obj3.display();  // a: a값, b: b값, c: 숫자: 123

3. 배열이나 객체로 여러 값을 받기

만약 여러 값을 하나의 매개변수로 받고 싶다면, 배열이나 객체를 사용하여 여러 값을 한번에 전달할 수도 있습니다.

예시: 배열을 받아 여러 값을 처리하기

class MultiInfo {
  constructor(a, b, ...args) {
    this.a = a;
    this.b = b;
    this.additionalInfo = args;  // 여러 값들을 배열로 처리
  }

  display() {
    console.log(`a: ${this.a}, b: ${this.b}, 추가 정보: ${this.additionalInfo.join(', ')}`);
  }
}

const obj = new MultiInfo('a값', 'b값', 'c값', 'd값', 'e값');
obj.display();  // a: a값, b: b값, 추가 정보: c값, d값, e값

위처럼 **...args**를 사용하면, 나머지 값들을 배열로 받을 수 있습니다. 따라서 입력되는 정보의 수가 다를 때 유용하게 사용할 수 있습니다.

 

결론

• 클래스의 생성자를 사용하면 유연하게 매개변수를 받아 다양한 형식의 객체를 만들 수 있습니다.
• 기본값이나 조건문을 활용하여 입력되는 값에 따라 다른 처리 방식을 선택할 수 있습니다.
• 배열이나 객체를 매개변수로 받아 여러 정보를 한 번에 받을 수도 있습니다.