본문 바로가기
웹/JavaScript

ES6. Class 클래스

by void pattern 2021. 1. 19.

자바스크립트 Class

ES6이전에는 class 대신 함수(function)으로 생성자를 만든 후 프로토타입(prototyp)으로 메서드를 할당하는 방식으로 사용해왔다.

ES6에서는 class 키워드(keyword)가 추가됐다.

 

class를 만드는 방법

class Person{	//class 선언
	constructor(name, age, gender){	//constructor 생성자 메서드
    	this.name = name;
        this.age = age;
        this.gender = gender;
    }
    showName(){	//클래서 Person에서 정의한 메서드
    	alert(this.name);
    }
}

let person = new Person('hun', 20, 'male');
person.showName();
console.log(toString.call(Person));	//object Function

객체의 상태를 설정하는 생성자 메서드 constructor()는 new에 의해 자동으로 호출된다.

class를 만들고 new Person()을 호출하게 되면 class에서 정의한 메서드에 있는 객체가 생성된다.

class의 Person의 타입(type)을 찍어보면 function으로 출력된다는 점을 보면 결국 함수(function)와 크게 다르지 않다.

 

 

 

class 특징

  • 호이스팅(hoisting)안 됨.
    class 선언은 실행이 선언에 도달할 때까지 TDZ(temporal dead zone)에 존재함
    * 호이스팅) 변수가 선언되기 전에 사용 가능함
    * TDZ) 미리 초기화하지 않은 바인딩에 접근 시 오류남(선언 전 변수 접근 금지)
  • class의 모든 코드는 strict 모드로 실행됨.

댓글