728x90
class 함수
- Javascript에서 class는 함수의 한 종류이다.
- class는 단순한 편의 문법이 아니다.
(더 자세한 내용은 추후에 살펴보자)
constructor( )
- 클래스의 생성자 함수이다.
- 모든 함수의 프로토타입은 'constructor' 프로퍼티를 기본으로 갖고 있기 때문에 constructor 프로퍼티를 명시적으로 만들 필요가 없다.
class student{
constructor(age, phone, city){
this.age = age;
this.phone = phone;
this.city = city;
}
getInfo(){
return "나이는 : " + this.age + "살이고 핸드폰 번호는 " + this.phone + " 사는 곳 : " + this.city + "이야"
}
}
let st = new student(30,"010-0000-0000","서울");
console.log(st); //키값 접근
/*결과
student
age: 30
city: "서울"
phone: "010-0000-0000"
*/
console.log(st.age); //키값 접근
//결과: 30
console.log(st.phone); //키값 접근
//결과: 010-0000-0000
console.log(st.getInfo());
//결과: 나이는 : 30살이고 핸드폰 번호는 010-0000-0000 사는 곳 : 서울이야
static
- static 키워드는 정적 메소드를 정의한다.
- 정적 메서드는 클래스의 인스턴스 없이 호출이 가능하며 클래스가 인스턴스화되면 호출할 수 없다.
- 정적 메소드는 일반적으로 공용함수를 만들기 위해 사용한다.
- 클래스를 동적할당할 때마다 생성되지 않는다.
- 인스턴스를 생성할 때 더 생성되지 않는다.
class Character{
constructor(hp, mp, atk){
this.hp = hp;
this.mp = mp;
this.atk = atk;
}
getState(){
return this.hp + this.mp + this.atk;
}
static getAtk(n){
return n.atk;
}
}
let ca = new Character(100,100,100);
console.log(ca);
/*결과
Character
atk: 100
hp: 100
mp: 100
*/
//이렇게 생성한 인스턴스에서 호출하면 안된다.
//console.log(ca.getAtk(1));// 결과가 불러와지지 않는다.
console.log(Character.getAtk(ca));
//결과: 100
getter와 setter
- class함수도 getter나, setter를 지원한다.
- 클래스의 값을 가져오거나 설정할 때 getter와 setter를 제공해준다.
- 클래스의 값에 접근할 때 직접 변수에 접근하는 형태가 아닌, get과 set을 통한 접근방법의 장점
- 내부구조를 캡슐화 하는데 좋다.
- 전역적으로 데이터가 사용되지 않게 위험성을 방지해준다.
class Product{
constructor(name, price){
this.name = name;
this.price = price;
}
get getName(){
return "제품이름 : " + this.name;
}
set setPrice(price){
this.price = price;
}
}
let pr = new Product("갤럭시 노트", 1000000);
console.log(pr);
/*결과
Product
name: "갤럭시 노트"
price: 1000000 //setter로 price 가격을 수정하기 전의 결과값
getName: (...)
*/
//getter를 확인해보자
console.log(pr.getName);
//결과: 제품이름 : 갤럭시 노트
//setter를 확인해보자
pr.setPrice = 2000; //price 값이 수정된다.
console.log(pr);
/*결과
Product
name: "갤럭시 노트"
price: 2000
getName: (...)
*/
extends
- 클래스를 상속할 수 있다.
- 자식 클래스가 부모 클래스를 상속받아서 부모 클래스의 기능을 사용할 수 있다.
class Mother{
constructor(name, age){ //생성자 함수
this.name = name;
this.age = age;
}
getInfo(){
return console.log(`이름은 : ${this.name} 나이는 : ${this.age} 입니다.`)
}
}
let temp = new Mother("아무개", 30);
temp.getInfo();
//결과: 이름은 : 아무개 나이는 : 30 입니다.
class Child extends Mother{
//비워놓자
//비워놓으면 자동으로 생성자가 만들어진다.
//constructor 자동으로 생성된다.
}
let temp2 = new Child('나는 자식', 30);
temp2.getInfo();
//결과: 이름은 : 나는 자식 나이는 : 30 입니다.- 부모의 함수를 받아서 오버라이딩(재정의) 할 수 있다.
class Animal{ //동물이라는 클래스
constructor(name){ //생성자 함수
this.name = name //초기화
this.speed = 0; //초기화
this.age = 20; //기본값 지정
}
run(speed){
this.speed += speed;
console.log(`${this.name}은 ${this.speed}로 달리는 중 나는 부모의 함수야`);
}
stop(){
this.speed = 0;
console.log(`${this.name}이 멈춤`)
}
}
let ani = new Animal("동물");
ani.run(10); //결과: 동물은 10로 달리는 중 나는 부모의 함수야
ani.stop(); //결과: 동물이 멈춤
class Cat extends Animal{
//부모의 함수를 받아서 오버라이딩
//run이라는 함수가 없으면 부모에서 상속받은 run함수를 실행하고
//run이라는 함수가 재정의 되면 재정의된 함수를 사용할 수 있다.(함수 오버라이딩)
run(speed){
this.speed = speed;
console.log(`${this.name}은 ${this.speed}로 달리는 중 나는 자식의 오버라이딩 함수야`);
}
speak(){
console.log("야옹");
}
stop(){
//재정의 했음
//부모의 stop을 실행 -> 재정의해서 사용할 수는 있는데
//상속받은 부모의 클래스 키워드로 부모의 함수를 실행시킬 수 있다.
//상속받은 부모의 클래스 키워드는 super
super.stop();
//본인을 참조해서 본인의 함수 실행
this.speak(); //결과: 야옹
}
}
let cat = new Cat("때껄룩");
cat.run(20); //결과: 때껄룩은 20로 달리는 중 나는 자식의 오버라이딩 함수야
cat.stop(); //결과: 때껄룩이 멈춤- 상속 클래스는 반드시 부모 클래스의 생성자 함수를 호출해서 사용하여야 한다.
- 상속 클래스의 생성자에서 super(...)을 호출하여 사용할 수도 있다.
- 일반 클래스가 new와 함께 실행되면, 빈 객체가 만들어지고 this에 이 객체를 할당한다.
- 반면, 상속 클래스의 생성자 함수가 실행되면, 일반 클래스에서 일어난 일이 일어나지 않는다.
- 상속 클래스의 생성자 함수는 빈 객체를 만들고 this에 이 객체를 할당하는 일을 부모 클래스의 생성자가 처리해주길 기대한다.
class Human{
constructor(name, age){
this.name = name;
this.age = age;
}
}
class Man extends Human{
constructor(name, age){
this.name = name;
this.age = age;
}
}
let ma = new Man("ㅎㅎ", 30);
console.log(ma); //결과: 에러728x90
