Unit2 - [JS] Class 와 Instance
2022. 7. 22. 12:24ㆍ코드스테이츠/Section02 - TIL
자바스크립트는 객체 지향 패턴으로 작성할 수 있다.
객체 지향 프로그래밍 OOP(Object-Oriented-Programming) ↔ 절차 지향 프로그래밍
: 데이터와 기능을 한 곳에 묶어서 처리
Class (ex 붕어빵을 제작하는 틀)
: 청사진(blueprint), template
Object (ex 붕어빵) => instance
: 청사진을 바탕으로 객체를 만드는 프로그래밍 패턴
class 붕어빵 {
constructor (밀가루종류,재료)
}
Instance (ex 각각의 붕어빵 - 팥 붕어빵, 슈크림 붕어빵, 피자붕어빵 )
각각의 붕어빵을 만들기 위해서는
“붕어빵 틀”에 “붕어빵”을 만들어야 한다. → 인스턴트화 한다.
// 붕어빵이 만들어질 떄 =인스턴트가 만들어질 때
let 팥붕어빵 = new 붕어빵 ('일반밀가루','팥')
let 슈크림붕어빵 = new 붕어빵 ('통밀밀가루','슈크림')
let 피자붕어빵 = new 붕어빵 ('일반밀가루','치즈')
methiod (ex 굽는다 )
// 붕어빵 틀로 붕어빵을 만드려면 "구워야"한다.
class 붕어빵 {
constructor (밀가루종류,재료) {...각각의 object}
bake();
}
Codestates. unit 02
예시) Class - Car
Instance - hyundai, bmw
용어 | 정의 |
prototype | 모델의 청사진을 만들 때 원형 객체 (original form) |
constructor | 인스턴트가 초기화될 떄 실행하는 생성자 함수 |
this | 함수가 실행 될 때. 해당 scope마다 생성되는 고유한 실행 contect(execution context) new키워드로 인스턴스를 생성했을 때에는, 해당 인스턴스가 바로 this의 값이 된다. |
Class 문법을 이용하여 만든 코드
class Counter {
constructor() {
this.value = 0; // 생성자 호출을 할 경우, this는 new 키워드로 생성한 Counter의 인스턴스입니다
}
increase() {
this.value++
}
decrease() {
this.value--
}
getValue() {
return this.value
}
}
let counter1 = new Counter() // 생성자 호출
counter1.increase()
counter1.getValue() // 1
'코드스테이츠 > Section02 - TIL' 카테고리의 다른 글
Unit2 - [JS] Prototype 프로토타입 (0) | 2022.07.22 |
---|---|
Unit2 - [JS] 객체 지향 프로그래밍 (0) | 2022.07.22 |