class 인스턴스 argument 사용/ optional 다루기/ union 타입/ interface 상속

# class 인스턴스가 매개변수로 적용된 함수

class

• class Student는 생성자 함수(constructor)를 통해 3가지 변수 및 타입을 선언한다. 
• 실행 부분에서 this를 통해 fullName이라는 변수를 앞서 선언한 매개변수로 표현한다.
• new Student() 인스턴스를 만들 때, 3개 변수를 넣어준다.
• greeter함수에 user라는 인스턴스를 넣었을 때, 함수에 사용되지 않은 middleIntitial 속성은 제외하고 리턴값이 출력된다.
  • user는 인터페이스 Person 타입의 속성을 충족하므로 함수는 정상 동작한다. 

class Student {
    fullName: string;
    constructor(
        public firstName: string,
        public middleIntitial: string,
        public lastName: string
    ){
        this.fullName = firstName + " " + middleIntitial + " " + lastName
    }
}

let user = new Student(
    "Jane", "M.", "User"
)

interface Person {
    firstName: string
    lastName: string
}

function greeter(person: Person){
    return "Hello, " + person.firstName + " " + person.lastName;
}


console.log('user:', user)
console.log(greeter(user))

 

# optional 속성 동작

• optional 속성인 last는 명시한 string 과 undefined의 유니언으로 고려된다.
• 따라서 둘 중 어떤 타입인지 확실하게 정해진 경우(narrowing)가 아니라면 관련된 메서드는 사용 불가하다.
• 이때는 last 뒤에 물음표를 붙여서 해당 메서드 또한 optional하다는 것을 명시한다.
• 함수를 실행했을 때, optional 속성을 기재하지 않았다면 undefined로 명시된다.

function printName(obj:{first:string, last?:string}){
    console.log(obj.first.toUpperCase(), obj.last?.toUpperCase())
}

printName({first: 'first'})

# 유니언 타입의 적용

• 유니언 타입에 기재된 것을 입력하면 타입스크립트의 타입추론이 알아서 잘 적용된다. 

type ID = number | string;

function printId (id: ID){
    console.log('what is the type of ', typeof id, id)
}

printId(2)
printId('5')

# 인터페이스 상속과 속성 변경

• extends 로 인터페이스를 상속받고
• bear 라는 변수에 Bear 타입에 맞는 값을 대입하고 콘솔을 출력하면 해당 값이 출력된다.
• 이후, 속성에 집접 값을 변경해주고 다시 출력을 하면 변경된 값이 출력됨을 확인 가능하다.

interface Animal {
    name:string;
}

interface Bear extends Animal {
    honey: boolean
}

const bear:Bear = {name:'sample', honey: false,}

console.log('before:', bear)

bear.name = 'changed'
bear.honey = true

console.log('after:', bear)

인터페이스가 아니라 타입으로 접근한다면 & 연산자로 다른 타입의 속성을 추가할 수 있다.

type Animal = {
    name: string;
}

type Bear = Animal & {
    honey: boolean
}