인프런 커뮤니티 질문&답변
작성한 질문수
class와 constructor를 이용한 객체 지향 프로그래밍
해결된 질문
작성
·
30
0
안녕하세요 강사님
바닐라 자바스크립트로 프로젝트를 진행할때 class를 이용해서
이를테면,
export default class SearchFormView extends View {
constructor(){
super(qs("#search-form-view"))
this.resetElement = qs("[type=reset]", this.element)
this.showResetButton(false)
console.log(this.element, "111")
}
showResetButton(visible = true){
this.resetElement.style.display = visible ? "block" : "none"
}
}
와 같이 필요한 속성을 객체의 형태로 저장하고
class를 통해 만들어낸 객체에서 필요한 속성을 꺼내는 방식으로 프로그래밍을 진행하셨는데
이렇게 코딩을 해야하는 이유가 무엇인가요?
직관적으로 와닿지가 않아서 그렇습니다 ㅠㅠ
답변 2
0
일종의 추상화 입니다. 우리가 어떤 사물이나 현상을 언급할 때 때 특성과 동작을 모두 설명할 수 있는데요. 간단히 이름을 사용해 표현할 수 있습니다. 가령 "코가 길고 귀가 크고 덩치가 큰 네 발 달린 초식 동물" 보다는 "코끼리"라는 이름을 사용하는 것처럼 말이죠.
리셋 버튼을 표시하고 사용자 입력을 처리하는 것을 SearchFormView라는 클래스로 추상화했습니다. 이러한 역할을 사용할 때 매번 해당 코드를 직접 작성하는 것보다는 이 역할을 담당하는 객체를 사용하면 훨씬 효율적입니다. 사람은 구현된 코드 보다는 추상화된 이름을 사용할수 있어서 좀 더 큰 규모의 로직을 다룰 수 있는 이점이 생깁니다.
관련되서는 절차지향 프로그래밍과 객체지향 프로그래밍에 대해 공부하시면 도움이 되실 겁니다.
0
안녕하세요, 인프런 AI 인턴입니다. 이재은님께서 질문하신 내용은 객체 지향 프로그래밍(OOP) 접근 방식에 대한 것입니다.
클래스를 사용하여 객체를 만들고 해당 객체를 통해 속성과 메소드를 관리하는 이유는 코드의 재사용성과 유지보수성을 높이기 위함입니다. 이는 다음과 같은 이점을 제공합니다:
코드의 모듈화: 각각의 클래스는 특정한 역할을 맡고, 관련 기능과 속성을 묶어놓음으로써 코드가 명확해지고 정리됩니다. 예를 들어,
SearchFormView클래스는 검색 폼에 관련된 속성과 메소드를 관리하는 역할을 합니다.재사용성: 클래스를 통해 만든 객체는 필요에 따라 동일한 구조와 기능을 갖고 반복적으로 사용될 수 있습니다. 새로운 검색 폼이 필요할 때마다
SearchFormView클래스를 기반으로 객체를 생성하면 됩니다.유지보수 용이: 기능에 변화가 필요할 때 클래스 내부만 수정하면 되며, 객체가 사용되는 모든 곳에서 자동으로 변경 사항이 반영됩니다.
상속을 통한 기능 확장: 클래스는 상속을 통해 기능을 확장할 수 있습니다.
SearchFormView클래스가View클래스를 상속받는 경우, 부모 클래스의 속성과 메소드를 그대로 사용하면서 추가적인 기능을 구현할 수 있습니다.
이러한 방식이 처음엔 다소 어렵게 느껴질 수 있지만, 프로젝트가 커지고 복잡해질수록 객체 지향적인 접근 방식의 장점이 크게 드러납니다.
추가적으로, 아래의 기존 답변 게시판 내용이 도움이 될 수 있을 것 같습니다:
View.js 에서 작성하신 Class에 관해 질문 있습니다.: 클래스 메소드에서
return this;의 활용과 랩핑의 이점에 대한 내용이 설명되어 있습니다.안녕하세요 2가지 질문드립니다!:
Object.create와 프로토타입 패턴, 및 예외 처리 기법 등 클래스와 객체 생성과 관련된 내용이 포함되어 있습니다.
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.