반응형
안녕하세요! 오늘은 자바스크립트에서 클래스가 무엇인지 아주 쉽게 설명해 드릴게요. 클래스를 알면, 자바스크립트로 사람, 강아지, 자동차 같은 물건을 만들고 표현할 수 있어요. 그럼 차근차근 알아볼까요?
1. 클래스란 무엇인가요?
클래스는 자바스크립트에서 물건이나 사람을 만드는 설계도라고 생각하면 돼요. 예를 들어, 강아지를 만들려면 강아지의 이름, 나이 같은 정보를 정해줘야겠죠? 그걸 클래스에서 미리 정해두는 거예요.
2. 클래스를 왜 사용할까요?
클래스를 사용하면 비슷한 물건을 쉽게 여러 개 만들 수 있어요. 한 번 클래스를 만들어 놓으면, 그걸 바탕으로 새로운 강아지나 사람 같은 여러 객체를 만들 수 있어요.
3. 클래스의 기본 구조
클래스는 두 가지를 정해줘요:
- 속성: 물건이 가지고 있는 정보예요. (예: 이름, 나이)
- 행동: 물건이 할 수 있는 일이에요. (예: 짖기, 달리기)
class Dog {
constructor(name, age) {
this.name = name; // 강아지 이름
this.age = age; // 강아지 나이
}
bark() { // 강아지가 짖는 행동
console.log(`${this.name}가 멍멍 짖어요!`);
}
}
위 예시는 강아지의 이름과 나이를 가지고 있고, 짖는 행동을 할 수 있는 클래스를 만든 거예요.
4. 클래스로 새로운 객체 만들기
클래스를 만들면, 그걸 바탕으로 **새로운 객체(실제 물건이나 사람)**를 만들 수 있어요. 예를 들어, Dog 클래스로 강아지 객체를 만들 수 있어요.
const myDog = new Dog("Charlie", 3); // 이름이 Charlie인 3살 강아지 만들기
이렇게 만들면 Charlie라는 이름의 3살짜리 강아지가 만들어져요.
5. 객체의 행동 사용하기
객체는 클래스에서 정해진 행동도 할 수 있어요. Charlie라는 강아지가 짖는 행동을 하도록 할 수 있어요.
myDog.bark(); // 결과: "Charlie가 멍멍 짖어요!"
이렇게 클래스로 만든 객체는 **속성(이름, 나이)**과 **행동(짖기)**을 모두 가질 수 있어요.
6. 클래스의 장점
- 비슷한 객체 여러 개 만들기: 클래스를 한 번 만들면, 비슷한 객체를 쉽게 여러 개 만들 수 있어요.
- 코드가 깔끔해져요: 객체가 할 수 있는 행동과 속성을 한곳에 모아서 관리할 수 있어요.
결론 : 클래스는 객체를 만드는 설계도!
- 클래스는 사람, 강아지, 물건 같은 객체를 만들기 위한 설계도예요.
- 이름, 나이 같은 정보와 할 수 있는 행동을 클래스로 정해줄 수 있어요.
- 이 설계도를 바탕으로 새로운 객체를 만들고, 그 객체가 할 수 있는 일을 정해줄 수 있어요.
이제 자바스크립트에서 클래스가 무엇인지 잘 알겠죠? 😊
반응형
'기획자・디자이너를 위한 넓고 얕은 개발 지식 > Javascript' 카테고리의 다른 글
7화. 자바스크립트 화살표 함수란? (0) | 2024.10.28 |
---|---|
6화. 자바스크립트의 함수란? (0) | 2024.10.28 |
5화. 자바스크립트 연산자 완벽정리! (0) | 2024.10.28 |
4화. 자바스크립트의 데이터 타입 (0) | 2024.10.28 |
3화. 자바스크립트의 상수란? (0) | 2024.10.28 |