티스토리 뷰

 

 

 

안녕하세요 동기 여러분! 오늘은 Optional Type Members에 대해 알아봅시다!

 

 

 

 

 

Optional Type Members

예전에 Optional Parameters를 포스팅할 때 이미 한 번 알아본 적이 있는 내용입니다. 

 

바로!!!

물음표를 사용하는 것입니다!!!

 

 

스타크래프트의 유닛을 보면 이름, 체력, 공격력, 방어력은 반드시 가지고 있습니다. 하지만 마나나 스킬이 없는 경우는 있죠. (물론... 공격력이 없는 경우도 있는데 제외하겠습니다... ㅈㅅ 코드 다 쓰고 나니까 생각나서 ㅠㅠ ㅋㅋㅋ)

 

그래서 코드를 아래와 같이 써주었습니다.

interface StarcraftUnit {
    name: string;
    hp: number;
    mp?: number;
    skill?: string;
    damage: number;
    armour: number;
}

function infoUnit(info: StarcraftUnit): void {
    if(info.mp == undefined){
        console.log(`이름: ${info.name}
체력: ${info.hp}
기술: ${info.skill}
공격력: ${info.damage}
방어력: ${info.armour}`);
    } else if(info.skill == undefined){
        console.log(`이름: ${info.name}
체력: ${info.hp}
마나: ${info.mp}
공격력: ${info.damage}
방어력: ${info.armour}`);
    } else if(info.skill && info.mp == undefined){
        console.log(`이름: ${info.name}
체력: ${info.hp}
공격력: ${info.damage}
방어력: ${info.armour}`);
    } else {
        console.log(`이름: ${info.name}
체력: ${info.hp}
마나: ${info.mp}
기술: ${info.skill}
공격력: ${info.damage}
방어력: ${info.armour}`)
    }
}
let marine = {name: 'marine', hp: 40, skill: 'steam pack', damage: 6, armour: 0};
infoUnit(marine);

 

인터페이스

  • StarcraftUnit이라는 인터페이스(타입)를 만들고
  • 이름은 string으로
  • 체력은 number로
  • 마나와 스킬은 없을 수 도 있으니까 프로퍼티 이름 바로 뒤에 ? (Question Mark)를 붙여주고 각각 number와 string으로
  • 공격력은 number로
  • 방어력은 number로 타입을 설정해줍니다.

 

함수

  • infoUnit이라는 함수를 만들어 매개 변수를 info로 두고 타입은 StarcraftUnit으로 선언하고 리턴값이 없으니까 void로 타입을 선언해줍니다.
  • if문을 사용해 info.mp가 없을 경우 마나를 제외한 나머지 정보를 출력하게 하고
  • info.skill이 없을 경우 기술을 제외한 나머지 정보를 출력하게 하고
  • 둘다 없을 경우 마나와 기술을 제외한 나머지 정보를 출력하게 하고
  • 나머지의 경우 모든 정보를 출력하게 코드를 짜주었습니다.

 

호출

  • 변수 marine에 프로퍼티 어사인먼트로 마나를 제외한 모든 정보를 넣고 
  • 독립변수가 marine인 함수 infoUnit을 호출했습니다.

 

컴파일링과 출력문

짠! 잘 작동합니다.

 


 

오늘의 느낌

초밥이 도착했기 때문에 저는 밥 먹으러 갑뉘닼ㅋㅋㅋㅋ!!!

맞다 타입스크립트 기초는 끝이 났습니다!!! 다음 시간부터는 파이썬 복습하겠습니당

'TypeScript' 카테고리의 다른 글

[TypeScript] Index Signatures  (0) 2022.01.25
[TypeScript] Extending Interfaces  (0) 2022.01.24
[TypeScript] Composed Types  (0) 2022.01.24
[TypeScript] Deep Types  (0) 2022.01.23
[TypeScript] Interfaces and Classes  (0) 2022.01.23
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
«   2024/06   »
1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30
글 보관함