노마드코더 TypeScript #4.2~#4.4 (interface)

#4.2

• 위와 같은 방법으로 public이면서 접근 불가능하게 만들 수 있다

type에 대한 복습: 

type Food=string;
const kimchi:Food="delicious";

type Person={
    nickname:string, 
    healthBar:number,
}
const nico:Person={
    nickname:"nico",
    healthBar:10,
}

//새로운 것
type Team= "read"|"blue"|"yellow"

type Plyaer={
    nickname:string,
    team:Team,
}

• 위와 같이 다양한 방식으로 type을 사용할 수 있다!

Interface : 

type Team= "read"|"blue"|"yellow"

interface Plyaer {
    nickname:string,
    team:Team,
}

• 위 마지막 코드를 interface로 변경해도 동일하게 작동을 한다! 
  • type은 어떠한 형태로든 작성이 가능하지만, interface의 경우 object의 모양만을 특정해준다고 한다(React.js에서 많이 사용한다고 함!) 

interface User{
   readonly name:string,
}
interface Player extends User{

}
const nico :Player={
    name:"nico",
}

• 다른 언어(ex java 등)를 통해 OOP 개념을 학습했다면, interface는 그렇게 낯설지 않을 것이다 => 기본적으로 class의 원본? 기본틀?을 잡을 때 많이 사용된다

interface User{
    name:string,
}
interface User{
   lastname:string,
}
interface User{
    health:number,
}
const nico: User={
    name:"nico", 
    lastname:"n",
    health:10,
}

• interface를 여러개 사용해도 자체적으로 합쳐준다! 위와 같은 것은 type으로 구현 불가! 

---

#4.3:

abstract class User{
    constructor(
        protected fistName:string,
        protected lastName:string,
    ){}
    //마지막 string은 return string을 한다는 의미!
    abstract sayhi(name:string):string
    abstract fullName():string
}

class Player extends User{
    fullName(){
        return `${this.fistName} ${this.lastName}`;
    }
    sayhi(name: string){
        return `hi ${name} my name is ${this.fistName} ${this.lastName}`
    }

}

• abstract class는 new로 인스턴스 생성 불가
• abstract class는 이를 상속 받는 클래스가 무엇을 내부적으로 갖추어야 할지 강제하는 것과 같다! 
• 위와 같은 방식을 interface를 사용해서 진행을 할 것! 

interface User{
     firstName:string,
     lastName:string,
     sayhi(name:string):string
     fullName():string
}
interface Human{
    health:number,
}
class Player implements User,Human{
    constructor(
        public firstName:string, 
        public lastName:string,
        public health:number,
    ){}
    
    fullName(){
        return `${this.firstName} ${this.lastName}`;
    }
    sayhi(name: string){
        return `hi ${name} my name is ${this.firstName} ${this.lastName}`
    }

}

• interface에선  constructor 내에서 private/protected을 허용하지 않는다! => 오직 public만 허용함! 
• 물론 interace 또한 type으로 사용될 수 있다 => user:User(interface임)=

• class를 return할 때는 new 형식으로 진행하지만, interface의 경우 내용물만 return 하면 된다!

---

#4.4:

type PlayerA={
    name:string,
}
//새로운 것 type extend

type PlayerAA = PlayerA &{
    lastName:string
}
const playerA:PlayerA={
    name:"nico",
}

interface PlayerB{
    name:string
}
interface PlayerBB extends PlayerB{
    lastName:string
}
//interface는 밑과 같이 동일한 이름에 정보 추가가 가능하지만,
//type의 경우 밑과 같이 하는 것은 불가능하다!
interface PlayerBB{
    health:number
}
const playerB:PlayerB={
    name:"nico"
}

type PlayerA = {
    firstName:string
}

interface PlayerB{
    firstName:string
}

class User1 implements PlayerA{
    constructor(
        public firstName:string
    ){}
}
class User2 implements PlayerB{
    constructor(
        public firstName:string
    ){}
}

• type이든 interface이든 둘 다 abstract을 대체할 수 있음 =>  대체로, class의 형태/원형을 지정하고 싶은 것이면 interface를 사용하고, 그 외에는 type을 사용하는 것을 권장한다고 한다. interface의 경우 확장성이 좋음! => type보다

• 공식문서에 나와있는 해석을 보면, 둘이 거의 비슷비슷하지만, type은 새로운 property 추가가 안됨 =>따라서, 위에서 언급했듯이 interface에 비해 확장성이 떨어진다!