Class란?
css에서 태그에 속성으로 사용되는 것과는 아예 다른 개념이다. 자주 반복적으로 사용되는 기능이나, 어떤 객체가 있다면 class의 생성을 통해서 반복적인 작업을 줄일 수 있다. 즉, class를 사용하는 이유는 '재사용성'이다.
어떻게 생성하는가?(코드는 어떻게 생겼나?)
기본적으론 위와 같은데, 생소해 보이는 부분들은 어떤 것들인지 살펴보자!(순서대로 살펴보며 해석해보기)
궁극적으론, Human이란 class를 사용하면 Human {} 내부에 있는 정보를 담은 객체를 반복적으로(재사용) 생성할 수 있다.
그럼 써놓은 코드를 순서대로 읽어보자.
- class Human { } : Human의 부분에는 원하는 이름을 지어주면 된다. 단, 첫글자는 대문자를 사용한다.
- constructor (name, age, city, favorite) {
this.name = name;
this.age = age;
this.city = city;
this.favorite = favorite; }
constuctor는 class와 함께 정의되는 부분이다. 쉽게 말해서, 생성될 객체의 가장 기본적인 정보이다.즉, 인간으로 치면 주민등록번호와 같은 것이다.
위에서 this는 생성될 객체를 말한다. this.name 은 생성될 객체의 name을 의미한다.
class 메서드
class의 constuctor 아래에 메서드를 쓸 수 있다.
constructor에서 쓴 것과 비슷하게 작성하되, 그 아래에 쭉 써주면 된다.
호출은 class이름.메서드이름() 으로 해주면 된다.
class 메서드 만들어주기.
constuctor 아래에 쭉 나열하면서 메서드를 만들 수도 있지만, class 바깥에서도 만들어 줄 수 있다.
바깥에서 만드는 방법은
class이름.메서드이름 = function () { } 으로 하면 된다.
기억하자!
class를 생성하는 이유는 반복되는 무언가를 해야할 때이다. 인터렉티브 웹의 경우에는, 클릭을 하면 어떠한 이미지나 캐릭터가 생성 된다면 매번 생성될 이미지나 캐릭터를 만들어 주는 것 보다 클릭을 했을 시 미리 만들어 놓은 class가 생성되게 하면 더욱 용이하기 때문이다.
안녕하세요!