<JS> 클래스(class)

* 클래스 *

 

함수(메소드) 와 변수( 멤버변수 ) 의 집합

 

1) 리터널방식 ( literal ) : 객체형태. 자체가 인스턴스이다 ( 일회용 )

2) 함수방식 클래스 : 함수형태. new연산자 사용하여 인스턴스 만듬 ( 확장성 )

3) 프로토타입방식 클래스 :  함수형태.

- new연산자 사용하여 인스턴스 만들고(확장성) .prototype을 이용하여 데이터를 추가한다.

- 상속 가능( 관리 용의성 )

 

 

 

 

 

 

1. 전역변수, 전역함수는 협업할 때 합리적이지 않다 ( 이름이 겹치면 곤란해짐 )

-> 클래스 이용

 

 

- 전역변수와 전역함수로 이루어진 코드

 

 

 

 

- 위의 코드를 클래스(리터널클래스) 로 만들었을 때

 

 

 

 

 

 

 

 

 

 

 

 

 

* this *

 

현재 속해있는 객체, .. 영역

상황에 따라 다르다.

 

 

- 전역에서의 this

 

 

 

 

 

 

*

 

 

 

 

: 100의 값을 줬는데도 200으로 바꼈다.

(전역에서의 this == window)

 

 

 

 

 

 

 

 

 

 

 

 

 

1. 리터널방식 클래스 ( literal class)

: 객체로 나타낸다.

 

- 사용할 땐 . 을 사용해서 불러옴.

 

 

* 안의 this는 속해있는 객체 Exam이다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

2. 함수방식 클래스 ( 객체 아님 )

 

paramenter를 이용해 재활용 가능.

틀( 함수 )을 만들어서 인스턴스로 계속 찍어냄 .

 

 

1) 클래스 Func

 

 

 

 

- this.num 을 console에 찍으면

 

 

 

 

 

- 함수로 실행해서 Func안의 this가 어딘지 console을 찍으면

 

: window이다.

 

 

 

 

 

2) 연산자 new로 인스턴스 만들기

: 함수가 객체로 바뀐다. 객체로 바꼈기 때문에 Func안의 this는 윈도우가 아닌 Func가 된다.

 

Exam2, Exam3는 각각의 데이터 공간을 가진다.  

 

 

* new연산자로 바꾸는 순간 Func가 한번 실행된다. this콘솔에 찍힘 -> Func*

 

 

 

 

3) 멤버변수와 메소드 실행시키기.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

3. 프로토타입 클래스.

 

상속이 가능하기 때문에 객체지향 프로그래밍을 사용하기에 좋다.

 

 

1) 본체 - 초기화

 

 

2) 변수, 메소드 등 생성하기

클래스이름.prototype.메소드/변수이름 = ..

 

 

 

 

3) 인스턴스로 만들어내기.

( 한번 실행된다. )

 

 

* Cal을 아래처럼 바꾸고 나서 new연산자를 이용해 인스턴스 만들 경우 *

 

- 한번 실행되면서 찍힌다. num, sum도 같이 찍힌다.

 

 

 

4) 인스턴스 멤버변수, 메소드 실행 출력하기