함수에서 타입 이용하기 (JS 💩 → TS ✨)

April·2022년 1월 19일
0

💫 Typescript

목록 보기
3/11
post-thumbnail

함수의 타입을 정의하기 위해서는 매개변수 타입반환 타입이 필요하다. 콜론(:)을 이용해서 매개변수 타입과 반환 타입을 정의할 수 있다.


함수에서 타입 이용하기: 기본

✔️ 예제1

// JavaScript 💩
function jsAdd(num1, num2) {
  return num1 + num2;
}

// TypeScript ✨
function add(num1: number, num2: number): number {
  return num1 + num2;
}

✔️ 예제2

// JavaScript 💩
function jsFetchNum(id) {
  // code ...
  // code ...
  // code ...
  return new Promise((resolve, reject) => {
    resolve(100);
  });
}

// TypeScript ✨
function fetchNum(id: string): Promise<number> {
  // code ...
  // code ...
  // code ...
  return new Promise((resolve, reject) => {
    resolve(100);
  });
}


함수 parameter 타입: spread, default, optional

✔️ optional parameter

// Optional parameter
function printName(firstName: string, lastName?: string) {
  console.log(firstName);
  console.log(lastName); // undefined
}
printName('Steve', 'Jobs');
printName('april');
printName('ving9');

✔️ Default parameter

// Default parameter
function printMessage(message: string = 'default message') {
  console.log(message);
}
printMessage();

✔️ Rest parameter

// Rest parameter
//                 인자를 숫자 타입의 배열로 받아온다 number[]
function addNumbers(...numbers: number[]): number { 
    return numbers.reduce((a, b) => a + b);
}
console.log(addNumbers(1, 2));
console.log(addNumbers(1, 2, 3, 4));
console.log(addNumbers(1, 2, 3, 4, 5, 0));



interface 사용해보기

interface클래스 또는 객체를 위한 타입을 지정 할 때 사용되는 문법

✔️ 일반 객체를 interface 로 타입 설정하기

벨로퍼트 참고 자료

profile
🚀 내가 보려고 쓰는 기술블로그

0개의 댓글