JAN's History

🐶 JavaScript static 키워드: 개념과 실전 활용법! 본문

Javascript

🐶 JavaScript static 키워드: 개념과 실전 활용법!

JANNNNNN 2024. 10. 12. 21:28

JavaScript를 공부하다 보면 static 키워드에 대해 자주 듣게 될 거예요. 특히 클래스와 함께 사용될 때 많이 볼 수 있는데요, static이 정확히 무엇이며, 어떤 상황에서 사용하면 좋을지 함께 알아보겠습니다!

🌟 static이란?

static 키워드는 클래스의 정적 메서드정적 프로퍼티를 정의할 때 사용해요. 이 말이 무슨 뜻이냐면, static으로 선언된 메서드나 프로퍼티는 클래스 자체에 귀속되며, 클래스의 인스턴스(객체)를 생성하지 않고도 바로 접근할 수 있다는 거예요.

📝 간단한 예시

class Dog {
  static isCute = true; // 정적 프로퍼티

  static typeName() {   // 정적 메서드
    return `typeName is...`;
  }
}

console.log(Dog.isCute);       // true
console.log(Dog.typeName());   // "typeName is..."

여기서 isCute와 typeName은 static으로 선언되어 있어요. 이 두 가지는 Dog 클래스의 인스턴스(예: new Dog())를 만들지 않고도 Dog.isCute 또는 Dog.typeName()으로 바로 접근할 수 있어요. 이게 바로 클래스 자체에 귀속되어있다는 의미랍니다!

 


🧐 실무에서 static을 어떻게 활용할까요?

static 키워드는 클래스와 연관된 유틸리티 메서드를 만들거나 팩토리 생성자를 만들 때 유용하게 사용됩니다. 여기서 팩토리 생성자(factory constructor)라는 개념은 클래스의 인스턴스를 더 쉽게 만들 수 있도록 도와주는 함수 같은 역할을 해요.

실전 예시: 팩토리 생성자 사용하기

일반적으로 클래스를 사용할 때는 new 키워드로 객체를 생성하지만, static을 사용하면 더 다양한 방식으로 객체를 만들 수 있습니다.

class Dog {
  type;
  size;

  constructor(type, size) {
    this.type = type;
    this.size = size;
  }

  // 객체로부터 클래스를 생성하는 정적 메서드
  static fromObject(object) {
    return new Dog(
      object.type,
      object.size,
    );
  }

  // 배열로부터 클래스를 생성하는 정적 메서드
  static fromList(list) {
    return new Dog(
      list[0],
      list[1],
    );
  }
}

const retriever = Dog.fromObject({  // new 키워드를 쓰지 않고도 객체 생성 가능!
  type: '골든리트리버',
  size: 'Big',
});

console.log(retriever); // Dog { type: '골든리트리버', size: 'Big' }

const maltese = Dog.fromList([
  '말티즈',
  'small'
]);

console.log(maltese); // Dog { type: '말티즈', size: 'small' }

📌 정적 메서드가 왜 유용할까요?

  • 객체 생성의 다양한 방식 제공: 정적 메서드를 사용하면 클래스로부터 객체를 생성하는 여러 가지 방식을 제공할 수 있어요. 위의 예시에서 fromObject와 fromList를 통해 객체를 쉽게 생성할 수 있었죠!
  • 유틸리티 함수: 클래스와 관련된 여러 기능을 클래스 내부에 모아둘 수 있어 코드의 가독성이 향상됩니다. 예를 들어, 데이터 변환, 값 검증 등 클래스와 직접적으로 관련된 기능을 정적 메서드로 만들어 관리할 수 있습니다.
    • 유틸리티 함수란 프로그램 내에서 자주 사용되는 일반적인 작업을 수행하는 함수입니다! 보통 객체나 인스턴스에 속하지 않고 클래스에 속하는데요. 데이터 변환이나 검증하는 함수들은 static으로 구현하면 코드의 가독성도 높이고 중복을 줄일 수 있습니다.

⭐ 중요: static을 사용한 객체 생성의 장점

정적 메서드를 사용해 객체를 생성하면, 코드를 간결하게 만들고 유연성을 높일 수 있습니다. 또한 new 키워드를 매번 사용하지 않고도 다양한 방식으로 객체를 생성할 수 있어요.

🛠 실무 팁!

  • static 메서드를 활용해 데이터 검증, 유효성 검사, 변환 등을 클래스 내부에 묶어두면 코드를 보다 구조적으로 관리할 수 있습니다.
  • 팩토리 생성자를 활용하면 외부 데이터(예: 서버에서 가져온 JSON 데이터)로부터 객체를 쉽게 만들 수 있어요.
  • 예를 들어, 서버에서 가져온 데이터를 Dog 클래스의 객체로 만들 때 Dog.fromObject(responseData)와 같은 방식을 사용하면 코드를 더 깔끔하게 유지할 수 있답니다.

❗ 주의: 언제 static을 사용하지 말아야 할까?

  • static은 인스턴스가 아니라 클래스 자체에 속해 있기 때문에, 인스턴스마다 다르게 동작해야 하는 로직에는 사용하지 않는 것이 좋습니다. 예를 들어, 각 개별 Dog 객체마다 상태를 관리해야 한다면 정적 메서드보다는 인스턴스 메서드로 정의하는 것이 맞습니다.

📝 간단한 예시 : static 메서드와 인스턴스 메서드

class Dog {
  constructor(type, size) {
    this.type = type;
    this.size = size;
  }

  // 인스턴스 메서드: 각 Dog 객체마다 상태를 관리할 때 사용
  bark() {
    return `${this.type}가 짖습니다. 멍멍!`;
  }

  // 정적 메서드: 특정 객체에 속하지 않고, 클래스와 관련된 동작을 수행
  static isCute() {
    return '모든 강아지는 귀엽다!';
  }
}

const maltese = new Dog('말티즈', 'small');
console.log(maltese.bark()); // "말티즈가 짖습니다. 멍멍!" - 인스턴스 메서드 호출
console.log(Dog.isCute()); // "모든 강아지는 귀엽다!" - 정적 메서드 호출

 

➡️정적 메서드와 인스턴스 메서드의 차이점

  • 정적 메서드(static)는 객체가 아닌 클래스에 속하므로, 클래스 전체와 관련된 일반적인 동작을 수행할 때 사용합니다. 예를 들어, 여러 곳에서 사용될 수 있는 유틸리티 함수나 객체를 생성하는 팩토리 함수처럼 특정 객체의 상태와는 무관한 기능을 수행할 때 유용합니다.
  • 인스턴스 메서드는 각 객체(인스턴스)마다 생성되며, 그 객체의 상태나 속성을 다루는 데 사용됩니다. 즉, 특정 객체의 상태를 변경하거나 조회하는 등 객체별로 관리되어야 하는 기능을 구현할 때 사용합니다.

static 키워드는 클래스 기반 프로그래밍에서 객체를 보다 유연하고 효율적으로 생성할 수 있도록 도와주는 강력한 도구입니다. 이 점을 이해하고 잘 활용하면, 실무에서 보다 깨끗하고 유지보수하기 쉬운 코드를 작성할 수 있어요! ✨