[코딩애플] ts part 1-10. class types

class 만들 때 타입지정 가능

class 만들기

class Person {
    constructor(){
        this.name = 'kim'
    }
    
}

let 사람1 = new Person();
let 사람2 = new Person();

이제 Person 속성을 물려받은 사람 오브젝트들을 만들 수 있다.

class 필드값 (constructor와 똑같은 역할)

class 내에 대충 변수를 만들어서 집어넣을 수도 있다.

class Person {
	data = 0;
}

그리고 모든 자식들은 이 data 속성을 가져다 쓸 수 있다.

사람1.data; // 0
사람2.data; // 0

근데 이 필드값에 타입지정을 할 수도 있다. 생략하면 컴파일러가 알아서 data의 type을 number로 타입지정해준다.

TypeScript constructor()

class Person {
    constructor(){
        this.name = 'kim'; // 에러 발생. name 이라는 property가 없다!
    }
}

name에 property가 없다고 에러가 뜬다. **타입스크립트에서는 constructor에서 값을 만들 때 constructor 위에 타입 선언을 해줘야만 한다**.

• TypeSciprt constructor()는 필드값에 '어쩌구'가 미리 있어야 this.'어쩌구' 가능

class Person {
    name :string;
    constructor(){
        this.name = 'kim';
    }
}

constructor 파라미터 타입지정 가능

class에 파라미터를 넣는다고 하자. 파라미터에도 타입을 지정할 수 있다.

return 타입은 해줄 필요가 없다. 복제되는게 항상 object이라 return 타입지정할 이유가 없기 때문이다.

class Person {
    name :string;
    constructor(a :string){ // ⬅️
        this.name = a;
    }
}

let 사람1 = hnew Person('kim');
let 사람2 = new Person('park')

당연히 rest parameter, default parameter 사용도 가능하다.

prototype 함수 타입지정 가능

constructor에 prototype을 추가해주고 싶다면?

class Person {
	name :string;
    constructor(a :string) {
        this.name = a;
    }
}
Person.prototype.함수 = function(){}

constructor 아래에 넣으면 된다!

class Person {
	name :string;
    constructor(a :string) {
        this.name = a;
    }
    함수(a :string) :void {
        console.log('안녕' + a);
    }
}
Person.prototype.함수 = function(){}

이 함수도 똑같이 타입 지정이 가능하다. 얘는 return 타입도 지정해주면 좋다.

숙제

1) Car 클래스를 만들고 싶습니다.

1. 대충 { model : '소나타', price : 3000 } 이렇게 생긴 object를 복사해주는 class를 만들어보십시오.
2. 그리고 복사된 object 자료들은 .tax() 라는 함수를 사용가능한데 현재 object에 저장된 price의 10분의1을 출력해주어야합니다.
3. model과 price 속성의 타입지정도 알아서 잘 해보십시오. tax() 함수의 return 타입도요.

(동작 예시)

let car1 = new Car('소나타', 3000)
console.log(car1) //콘솔창 출력결과는 { model : '소나타', price : 3000 }
console.log(car1.tax()) //콘솔창 출력결과는 300

➡️

class Car {
    model :string;
    price :number;
    constructor(a :string, b :number) {
        this.model = a;
        this.price = b;
    }
    tax() :number {
        return this.price * 0.1;
    }
}

2) class인데 파라미터가 잔뜩 들어가는 class Word를 만들어봅시다.

1. object 만들 때 new Word() 소괄호 안에 숫자 혹은 문자를 입력하면
2. 숫자는 전부 object 안의 num 속성 안에 array 형태로 저장되고
3. 문자는 전부 object 안의 str 속성 안에 array 형태로 저장되는 class를 만들어봅시다.
4. class 만들 때 넣을 수 있는 숫자와 문자 갯수는 일단 제한은 없습니다. 그리고 타입 빼먹지 마셈

(동작 예시)

let obj = new Word('kim', 3, 5, 'park');
console.log(obj.num) //[3,5]
console.log(obj.str) //['kim', 'park']

➡️

class Word {
    num :number[];
    str :string[];
    constructor(...rest){
        let nums :number[] = [];
        let strings :string[] = [];
        
        rest.forEach(i => {
            if (typeof i === 'string') {
                strings.push(i);
            } else {
                nums.push(i);
            }
        });
        
        this.num = nums;
        this.str = strings;
    }
}

let obj = new Word('kim', 3, 5, 'park');
conosle.log(obj.num); // [3, 5]
conosle.log(obj.str); // ['kim', 'park']