JAN's History
🐶 JavaScript static 키워드: 개념과 실전 활용법! 본문
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 키워드는 클래스 기반 프로그래밍에서 객체를 보다 유연하고 효율적으로 생성할 수 있도록 도와주는 강력한 도구입니다. 이 점을 이해하고 잘 활용하면, 실무에서 보다 깨끗하고 유지보수하기 쉬운 코드를 작성할 수 있어요! ✨
'Javascript' 카테고리의 다른 글
화살표 함수 vs 일반 함수: this를 더 쉽게 이해하기! 🚀 (2) | 2024.10.17 |
---|---|
상속과 super 키워드 그리고 오버라이딩까지 쉽게 알아보기 🐶 (0) | 2024.10.16 |
자바스크립트의 Getter와 Setter (3) | 2024.10.09 |
클래스(Class) 기본기 다지기! (0) | 2024.10.05 |
실무에서 꼭 알아둬야할 try-catch문에 대해서 알아보자! (1) | 2024.10.03 |