JavaScript 클래스 기본 사항:ES6 클래스 소개

JavaScript 클래스는 객체를 만들기위한 청사진입니다. 클래스는 데이터를 조작하는 데이터와 함수를 캡슐화합니다.

Java 및 C++와 같은 다른 프로그래밍 언어와 달리 JavaScript 클래스는 프로토 타입 상속에 대한 구문 론적 설탕입니다. 즉,ES6 클래스는 특수 함수 일뿐입니다.

클래스 ES6 이전에 재검토

ES6 이전에는 JavaScript 에 클래스의 개념이 없었습니다., 를 모방하는 클래스를,우리가 자주 사용되어 생성 기능으로 다음 예제와 같이

출력:

이 어떻게 작동합니다.

먼저Person라는 속성 이름을 가진 생성자 함수로name를 만듭니다. getName()기능에 할당된prototype그는 그것을 공유할 수 있습의 모든 인스턴스Person유형입니다.

그런 다음new연산자를 사용하여Person유형의 새 인스턴스를 만듭니다., john체,따라서,의 인스턴스Person및Object통해 prototypal 상속입니다.,

다음 문을 사용하는instanceof연산자를 확인하려면john의 인스턴스Person및Object유형:


Code language: JavaScript (javascript)

ES6 도입되는 새로운 구문을 선언하는 클래스와 같이 이 예에서는 다음과 같습니다.


Code language: JavaScript (javascript)

이것은Person등과 마찬가지로 동작Person유형에서 이전의 예입니다. 그러나 생성자 함수를 사용하는 대신class키워드를 사용합니다.,

Person등의constructor()입할 수 있는 속성을 초기화 인스턴스의. JavaScript 는 클래스의 객체를 인스턴스화 할 때 자동으로constructor()메소드를 호출합니다.

다음과 같은 새로 만들어집Person체,자동으로 전화constructor()Person클래스:


Code language: JavaScript (javascript)

getName()이라는 방법을Person클래스입니다., 처럼 생성 함수를 호출할 수 있습 방법을 사용하여 클래스의 구문은 다음과 같습니다.


Code language: CSS (css)

예를 들어,


Code language: JavaScript (javascript)

을 확인하다는 사실 클래스는 특수 함수, 사용할 수 있습니다typeof운영자의 유형을 확인Person클래스입니다.


Code language: JavaScript (javascript)

반환하는function으로 예상된다.,

john개체도의 인스턴스Person및Object유형


Code language: JavaScript (javascript)

에도 불구하고 사이에 유사성이 클래스고 사용자 지정 유형의 정의를 통해 생성자 기능 거기에 몇 가지 중요한 차이점이 있습니다.먼저 클래스 선언은 함수 선언과 같이 게양되지 않습니다.

경우,예를 들어,다음 코드는 위의Person클래스 선언 섹션에서,당신은 당신을 얻을 것이ReferenceError.,


Code language: JavaScript (javascript)

오류가:


Code language: JavaScript (javascript)

두 번째,모든 코드가 내부에는 클래스가 자동으로 실행되는 엄격한 모드입니다. 그리고 당신은이 행동을 바꿀 수 없습니다.

셋째,클래스 메소드는 열거 할 수 없습니다. 생성자 함수를 사용하는 경우Object.defineProperty()메서드를 사용하여 속성을 열거 할 수 없도록해야합니다.

넷째,new연산자없이 클래스 생성자를 호출하면 다음 예제와 같이 오류가 발생합니다.,


Code language: JavaScript (javascript)

오류가:


Code language: JavaScript (javascript)