실무에서 사용하는 자바스크립트의 기초적인 문법들을 차근차근 정리해보려고 합니다.
// 실무에서 어떻게 사용하고 있나?
클래스
class ?!
클래스는 templete (틀) 이고 메모리에 올라가지 않고… 등등의 이야기는 뒤쪽에 정리하도록 하겠습니다.
먼저.. class 는 언제 쓰는 가?
중요한 건, 어떤 경우에 class를 쓰는 가 / 왜 쓰는 가 가 class 문법이 만들어진 중요한 포인트인 것 같습니다.
class 는 1. “연관” 있는 데이터 / 함수 들을 한 덩어리로 2. “묶어” (그 묶은 데이터를 field (속성 - 데이터) 이라고 하고, 함수를 method (행동)라고 합니다) 3. “틀” 을 만들어 데이터 마다 다른 결과물을 만들고 싶을 때 사용할 수 있습니다.
예를 들어, 삼각형의 가로, 삼각형의 세로, 삼각형의 넓이를 구하는 함수, 사각형의 가로, 사각형의 세로, 사각형의 넓이를 구하는 함수 등등의 데이터 / 함수들이 있다고 가정해 봅니다. 당연히 삼각형은 삼각형끼리 사각형은 사각형끼리 묶어서 관리하면 편리 할 것 입니다. 추가로 실제 값을 가지지 않은 삼각형 / 사각형의 틀을 가지고 있다면, 여러가지 값들을 가진 삼각형 / 사각형을 만들기 편할 것 입니다.
코드로 확인해 보겠습니다.
1 | class 사각형 { |
이제 삼각형이라는 틀을 완성했습니다.
그럼 이 틀을 이용해 가로 10, 세로 10, 빨간색 이라는 데이터를 넣은 사각형을 만들어 보겠습니다.
1 | const rectangle = new 사각형(10, 10, 'red'); |
원하는 데이터를 이 틀(class)에 넣어서 다양한 결과물을 만들어 낼 수 있습니다.
- 빨간(데이터) 사각형
- 파란(데이터) 사각형
- 가로, 세로 길이가 같은 (데이터) 사각형
(클래스를 붕어빵틀, 그리고 그 결과물을 팥 붕어빵, 크림 붕어빵 이라는 유명한 예시들이 있습니다….)
그리고, 그 결과물을 조금더 전문 용어로 표현 하면, 이것을 class 의 instance 또는 object 라고 합니다.
class 정의
- 연관된 데이터와 함수를 묶는 틀
- 묶인 데이터를
field(속성), 묶인 함수를method(행동) 이라 함 - 그 틀에 의해 실제 데이터로 만들어진 결과물을 인스턴스 라고 함
class 특징
클래스는 한번만 선언 됨 - https://developer.cdn.mozilla.net/en-US/docs/Web/JavaScript/Reference/Classes#re-running_a_class_definition
안에 실제 데이터가 들어있지 않은 단순한 틀이기 때문에 메모리에 올라가지 않음 <- 조금 더 확인해보아야
