15. 클래스
2024. 11. 2. 15:09ㆍ자바스크립트(Javascript)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>클래스</title>
</head>
<body>
<script>
//클래스를 이용한 객체 생성
const Student = class {
//private
#name
#hp
// static 정적 프러퍼티 및 메서드를 생성
static count_student =100
static makeStudent(){
return new Student(`반하나`, `010-2222-2222`, 25)
}
constructor(name, hp, age){
this.#name = name
this.#hp = hp
this.age = age
}
getName= () => {
return `이름은 ${this.name} 입니다.`
}
set name(value){
console.log(`set`, value) // 10. set 사과킴
this.#name = value;
}
set hp(value){
console.log(`set`, value)
this.#hp = value;
}
get name(){
console.log(`get 호출`) // 2. 4. 8, 11번 (get 호출)
return this.#name
}
get hp(){
return this.#hp
}
}
const apple = new Student(`김사과`, `010-1111-1111`, 20)
console.log(apple)
// 1.
// Student {age: 20, #name: '김사과', #hp: '010-1111-1111', getName: ƒ}
console.log(apple.name) // 3. 김사과
console.log(apple.getName()) // 5. 이름은 김사과 입니다.
console.log(`--------`)
console.log(Student.count_student); //6. 100
const banana = Student.makeStudent()
console.log(banana)
// 7. Student {age: 25, #name: '반하나', #hp: '010-2222-2222', getName: ƒ}
console.log(`--------`)
//get 프러퍼티가 실행
console.log(apple.name) // 9. 김사과
//set 프러퍼티가 실행
apple.name = `사과킴`
//get 프러퍼티가 실행
console.log(apple.name) // 12. 사과킴
/*
과제
카운터 만들기
카운터를 0으로 초기화 한뒤 하나씩 값이 증가, 하나씩 값이 감소하는 메서드를 구현한 클래스를 만들어보자
(단, 객체 생성시 전달한 값이 0보다 작을 결루 0으로 초기화 시키고 그 외의 값은
입력한 값으로 설정,. 또한 프러퍼티에 값을 직접 불러오거나 설정할 수 없으며 메서드를 통해 설정하거나 불러옴)
예)
const count = newCounter(10) //10
count.increment() // 11
count.decrement() // 10
const count = new Counter(-1) //10
count.increment() // 1
count.decrement() // 0
*/
</script>
</body>
</html>
728x90
LIST
'자바스크립트(Javascript)' 카테고리의 다른 글
17. Math 객체 (0) | 2024.11.04 |
---|---|
16. 프로토타입 (10) | 2024.11.04 |
14. 객체 (0) | 2024.11.02 |
13. 화살표 함수 (0) | 2024.11.02 |
12. 함수 (0) | 2024.11.02 |