본문 바로가기
패스트캠퍼스/자습

자바스크립트 복습(클래스, Module)

by sunnykim91 2019. 10. 10.

모든 선언문은 런타임 이전에 먼저 실행되기 때문에 클래스 선언문 또한 호이스팅이 발생하여

일시적 사각지대에 빠져, 호이스팅이 발생하지 않는것처럼 동작(let, const와 비슷)

즉, 선언문 이전에 참조 불가!

 

 

new 연산자와 함께 클래스 이름을 호출하면 클래스의 인스턴스가 생성됨!

 

constructor 는 인스턴스를 생성하고 클래스 필드를 초기화하기 위한 특수한 메소드!

 

클래스 필드 : 클래스 내부의 캡슐화된 변수(= 데이터 멤버 or 멤버 변수)

                  인스턴스의 프로퍼티 또는 정적 프로퍼티가 될 수 있다.

 

constructor 클래스 내에 한개만 존재 할 수 있다

constructor는 생략이 가능하다.

constructor 내부에서 선언한 클래스 필드는 클래스가 생성할 인스턴스를 가르키는 this에 바인딩 함

클래스의 인스턴스를 통해 클래시 외부에서 언제나 참조할 수 있다 .(= public하다.)

 

getter

getter 클래스 필드에 접근할때마다 클래스 필드의 값을 조작하는 행위가 필요할때 사용

메소드 이름 앞에 get 키워드를 사용해 정의

반드시 무언가를 반환해야함

 

setter

클래스 필드 값을 할당할 때마다 클래스 필드의 값을 조작하는 행위가 필요할때 사용

 

 

정적 메소드

 

static 키워드를 사용해서 사용

정적 메소드는 this를 사용할 수 없다.

정적 메소드 내부에서 this는 클래스의 인스턴스가 아닌 클래스 자신을 카리킨다.

클래스 이름으로 호출이 가능하고 인스턴스로는 호출이 불가능하다.

 

클래스 상속

 

extends 키워드로 부모클래스를 상속받는 자식 클래스를 정의할 때 사용한다. 

 

오버라이딩은 상위클래스가 가지고 있는 메소드를 자식이 다시 재정의

오버로딩은 매개변수의 타입이나 개수가 다른 이름의 메소드를 구현하고 메개변수에 의해 메소드를 구별하여 호출하는 방식(자바스크립트는 지원 x)

 

super키워드는 부모클래스를 참조할때 또는 부모클래스의 constructor를 호출할때 사용

super 메소드를 호출하기 이전에는 this를 참조할 수 없음.

 

 

모듈

 

애플리케이션을 구성하는 개별적 요소로서 재사용 가능한 코드조각을 말한다.

세부사항을 캡슐화하고 공개가 필요한 API만을 외부에 노출한다. 

 

파일 단위로 분리 되어 있으며 애플리케이션 은 필요에 따라 명시적으로 모듈을 로드하여 재사용.

 

script 태그에 type="module" 어트리뷰트를 추가하면 로드된 자바스크립트 파일은 모듈로서 동작한다

 

IE를 포함한 구형 브라우저는 ES6모듈을 지원하지 않음.

브라우저의 ES6모듈 기능을 사용하더라도 트랜스파일링이나 번들링이 필요하다.

--> 이러한 이유 때문에 Webpack 등의 모듈 번들러를 사용하는 것이 일반적이다.

 

모듈은 파일 스코프를 가짐. 

모듈 내에서 var키워드로 선언한 변수는 더 이상 전역 변수가 아니며, window객체의 프로퍼티도 아니다.

 

export 키워드

모듈을 공개하기 위해서는 export키워드를 사용한다.

 

한번에 객체로 구성하여 한번에 export할 수 도있음.

 

모듈에서 하나만을 export 할때에는 default 키워드를 상요할 수 있다. 

 

import 키워드

export한 모듈을 로드하기  위해 사용

 

 

반응형