Javascript에서 빌더 패턴의 실용적인 사용
설명을 시작하기 전에 아래 코드를 살펴보겠습니다.
class User {
constructor(firstName, lastName) {
this.firstName = firstName;
this.lastName = lastName;
}
}
const tonyStark = new User('Tony', 'Stark')
위의 코드에서
User
클래스가 있고 User
객체를 만든 다음 변수 tonyStark
에 저장합니다. 두 가지 속성을 가진 개체만 있기 때문에 이 접근 방식에는 아무런 문제가 없습니다. 하지만 객체 생성 과정에서 제공해야 하는 속성이 많은 객체를 생성한다면 어떨까요?class User {
constructor(firstName, middleName, lastName, suffix, phone, email, isActive, lastSeen) {
this.firstName = firstName;
this.middleName = middleName;
this.lastName = lastName;
this.suffix = suffix;
this.phone = phone;
this.email = email;
this.isActive = isActive;
this.lastSeen = lastSee;
}
}
const tonyStark = new User('Tony', 'Mc', 'Stark', 'Mr', '+620382931232', '[email protected]', true, '01-01-2021')
const johnDoe = new User('John', 'Mc', 'Doe', 'Mr', '+623123232323', '[email protected]', true, '02-01-2021')
위의 코드에서 볼 수 있듯이 개체를 인스턴스화하는 프로세스는 매우 지루하고 오류가 발생하기 쉽습니다. 제공하는 매개변수의 순서에 주의해야 합니다. 잘못된 순서를 제공하면 애플리케이션에서 버그의 원인이 될 수 있습니다. 우리는 인간이고 인간은 실수하는 경향이 있습니다. 🐞
이것이 빌더 패턴이 생성되는 이유입니다. 빌더 패턴은 복잡한 객체의 표현부터 구성을 단순화하여 다양한 객체 생성 문제에 대한 유연한 솔루션을 제공하는 것을 목표로 하는 디자인 패턴입니다.
class UserBuilder {
constructor(firstName, middleName, lastName) {
this.firstName = firstName;
this.middleName = middleName;
this.lastName = lastName;
}
setSuffix(suffix) {
this.suffix = suffix;
return this;
}
setPhone(phone) {
this.phone = phone;
return this;
}
setEmail(email) {
this.email = email;
return this;
}
setIsActive(isActive) {
this.isActive = isActive;
return this;
}
setLastSeen(lastSeen) {
this.lastSeen = lastSeen;
return this;
}
build() {
if (!('firstName' in this)) {
throw new Error('First Name is missing')
}
if (!('lastName' in this)) {
throw new Error('Last Name is missing')
}
if (!('phone' in this)) {
throw new Error('Phone is missing')
}
if (!('email' in this)) {
throw new Error('Email is missing')
}
if (!('isActive' in this)) {
throw new Error('isActive is missing')
}
if (!('lastSeen' in this)) {
throw new Error('lastSeen is missing')
}
return new User(this.firstName, this.middleName, this.lastName, this.suffix, this.phone, this.email, this.isActive, this.lastSeen)
}
}
const tonyStark = new UserBuilder('Tony', null, 'Stark')
.setSuffix('Mr')
.setPhone('620382931232')
.setEmail('[email protected]')
.setIsActive(true)
.setLastSeen('01-01-2021')
.build();
const johnDoe = new UserBuilder('John', 'Mc', 'Stark')
.setPhone('623123232323')
.setEmail('[email protected]')
.setIsActive(true)
.setLastSeen('02-01-2021')
.build();
빌더 패턴을 활용하여 이제 User 인스턴스를 생성할 때 어떤 일이 발생하는지 명확하게 확인할 수 있습니다. 그 결과 작성하기 쉽고 읽고 이해하기 매우 쉬운 코드가 생성됩니다.
firstName
, middleName
및 lastName
만 제공하여 매개 변수를 단순화했습니다. 이렇게 하면 이해하기 쉬울 뿐만 아니라 객체를 초기화할 때 사람의 실수를 최소화할 수 있습니다. 빌더 내에 오류 처리기를 추가하고 필수 또는 선택 매개변수를 지정할 수 있습니다. setter 메서드를 연결하여 객체를 생성하고 마지막으로 build()
메서드를 호출하여 객체 생성을 완료합니다.이 짧은 기사가 빌더 패턴과 언제 사용하는지 이해하는 데 도움이 되기를 바랍니다.✨
Reference
이 문제에 관하여(Javascript에서 빌더 패턴의 실용적인 사용), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/yohanesss/practical-use-of-builder-pattern-in-javascript-4hg4텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)