객체3. class 개념

목차

1. 클래스란?
2. 클래스 정의하기
3. 클래스 body와 method

 

 

클래스란?

• 객체를 생성하는 템플릿
• 클래스는 데이터와 데이터를 조작하기 위한 코드를 캡슐화
• JS에서의 클래스는 프로토타입에 의해 작성되지만, ES5와는 다른 문법과 의미를 가짐
• 특별한 함수

 

1. 클래스 정의하기

• 클래스를 정의하기 위한 두 가지 방법

• Class 선언
• Class 표현식

 

1-1. 클래스 선언(class declaration)

• 클래스명과 함께 class 키워드 사용

class Classmates{
    constructor(name,heights,gender,dob){
        this.name = name;
        this.heights = heights;
        this.gender = gender;
        this.dob = dob;
    }
}

 

 

끌어올리기(hoisting)

• 함수 선언과 클래스 선언의 중요한 차이점

• 함수는 정의 이전에 호출 가능
• 반면 클래스는 반드시 정의 후 사용되어야 함
• <>클래스 정의는 끌어올려지지만, 값은 초기화 되지 않기 때문에 참조 에러 발생하기 됨

 

 

1-2. 클래스 표현식

• 클래스 표현식은 명명되거나 익명일 수 있다.
• 명명된 클래스 표현식은 class의 바디에 지역적으로 적용된다. (코드 블럭 안에서 사용 가능하단 뜻)

(1) 명명된 경우

let Classmates = class Classmates2{
    constructor(name,heights,gender,dob){
        this.name = name;
        this.heights = heights;
        this.gender = gender;
        this.dob = dob;
    }
}

console.log(Classmates.name);	//Classmates2

 

 

(2) 익명인 경우

let Classmates = class {
    constructor(name,heights,gender,dob){
        this.name = name;
        this.heights = heights;
        this.gender = gender;
        this.dob = dob;
    }
}

console.log(Classmates.name);	//Classmates

 

 

2. Class 바디와 메서드 정의

• 클래스의 바디 부분은 중괄호 내부
• 클래스의 바디인 코드 블럭 내부에, 메서드나 생성자와 같은 class의 멤버를 정의함

 

생성자(Constructor)

• 생성자 메서드는 클래스로 생성된 객체를 생성하고 초기화하는 특수 메서드
• 생성자 메서드는 클래스 안에서 오직 한번만 사용 가능
• <>생성자 메서드 2회 이상 호출 시, 문법 에러 발생
• super class의 생성자를 호출하기 위해서 super 키워드 사용 가능