JavaScript 공부 - 클래스와 인스턴스

객체지향 프로그래밍이란?

하나의 모델이 되는 청사진(blueprint)을 만들고, 그 청사진을 바탕으로 한 객체를 만드는 프로그래밍

여기서 말하는 청사진을 '클래스' 라고 하고, 그 청사진을 바탕으로 한 객체를 '인스턴스' 라고 한다.
청사진, 즉 틀을 이야기하는데, 이 말만 들어보면 클래스만 만들어 놓으면, 객체를 무한적으로 찍어내어 생성할 수 있을 것처럼 보인다. 과연 그런지 한번 보겠다!

클래스는 어떻게 만들 수 있을까? 바로 생성자 함수를 통해 생성할 수 있다. ES5버전과 ES6버전 두가지 버전이 있는데, ES6버전 사용을 권장한다👍

function 클래스이름(속성1, 속성2, 속성3){
	//여긴 ES5 버전
}

Class 클래스이름{
	construct(속성1, 속성2, 속성3){
    	//여긴 ES6 버전
    }
}

그렇다면 위 틀로 찍어내는 객체들은 어떻게 만들 수 있을까?

let 변수명 = new 클래스이름(속성1값, 속성2값, 속성3값);

객체(인스턴스)의 속성값들은 this를 이용하여 생성한다.

Class 클래스이름{
	construct(속성1, 속성2, 속성3){
    	this.속성1 = 속성1;
        this.속성2 = 속성2;
        this.속성3 = 속성3;
    }
}

여기서 this는 인스턴스 객체를 의미한다. parameter로 넘어온 속성값은 인스턴스 생성 시 지정하는 값이며, 위와 같이 this에 할당한다는 것은 만들어진 인스턴스에 해당 속성을 부여하겠다는 의미이다.

속성 설정 다음에는 메서드를 알아야 하는데, 메서드는 쉽게 말하면 "객체에 딸린 함수"이다.
자동차 제작으로 예를 들면, 속성에는 [색상, 차종, 제조사, 최고속력]등이 있고, 메서드로는 [연료주입, 속력설정, 기어설정, 운전] 등을 예로 들 수 있다.

메서드의 정의는 다음과 같다.

function 클래스이름(속성1, 속성2, 속성3){ 

//클래스내용~~~~

}
클래스이름.prototype.함수이름 = function(){
   //이건 ES5버전 
}

Class 클래스이름{
	construct(속성1, 속성2, 속성3){
    	//클래스 내용~~
    }
    함수이름(){
    	//이건 ES6 버전
    }
}

ES5에서는 prototype 키워드를 사용하여 바깥에 선언하고, ES6에서는 construct 뒤에서 일반적인 함수선언처럼 선언한다.

위와 같이 선언한 함수 사용은

변수명.함수이름();

두 버전 모두 이렇게 사용하면 된다.

화이팅~