자바스크립트(javascript)/개념
class - 자바스크립트 class
Doo Hee
2023. 8. 24. 23:16
📝정리
클래스
객체지향 프로그래밍에서 특정 객체(인스턴스)를 생성하기 위한 변수와 메소드를 정의하는 일종의 틀을 의미한다.
쉽게 이름과 그룹 이름을 가진 아이브 객체를 생성해 보기로 하자. (많으니까 3명만..)
let yuJin = {
name: '안유진',
group: '아이브',
};
let wonYoung = {
name: '장원영',
group: '아이브',
};
let ray = {
name: '레이',
group: '아이브',
};
위의 코드처럼 객체를 생성하면 name과 group이라는 속성이 겹친다. 즉, 코드가 중복되면서 가독성이 떨어질뿐더러 효율성이 떨어진다. 이런 중복을 없애기 위해 class를 생성한다고 볼 수 있다.
클래스는 공통된 성질이나 함수를 묶어 일종의 틀을 정의한 것이다. 즉 빵을 찍어내는 빵틀이다. 빵틀 하나만 있으면 여러개의 빵을 찍을 수 있듯이 클래스를 만들면 객체를 여러번 생성할 수 있다.
클래스를 선언할 땐 class 키워드를 붙여주며 클래스 이름은 대문자로 시작해야한다. { } 안에 공통된 속성들을 정의해주면 된다.
class 클래스 이름 {
// 속성 = 값;
// 속성 = 값;
}
클래스를 만들었다면 객체를 생성해보자. 객체는 new 키워드를 이용하여 생성할 수 있다.
const 변수명 = new 클래스명();
이때, 한가지 문제가 발생한다. new 키워드를 통해 객체를 여러개 생성할 수 있지만 생성한 객체는 모두 속성과 값이 똑같은 객체라는 점이다.
속성은 같지만 각각의 값은 다른 인스턴스를 생성하기 위해선 어떻게 해야할까?
생성자(constructor)를 이용하면 된다. 생성자는 클래스 내부에 선언하며 속성값이 다른 여러 인스턴스를 생성하게 해준다.
class 클래스명 {
// 속성만 정의;
// 속성만 정의;
constructor(파라미터) {
this.속성 = 파라미터로 받은 값;
}
}