TypeScript #3

타입스크립트의 함수

타입스크립트에서 함수를 선언할때는 아래와 같은 방식으로 선언한다.
기존 자바스크립트 함수 선언 방식에서 매개변수와 반환값에 타입을 추가한다.

function sum(a: number, b: number) : number { // 각각 인자의타입과 return의 타입이다.
  return a + b;
}

타입스크립트에서는 함수의 인자를 모두 필수값으로 간주한다. 따라서 함수의 매개변수를 설정하면 undefined나 null이라도 꼭 인자로 넘겨야한다.
타입스크립트에서 인자를 필수값이 아닌 선택적으로 넘기고 싶다면 아래와 같이 사용할 수 있다.

function sum(a: number, b?: number): number {
	return a + b;
}
sum(10, 20) // 30
sum(10); // 10

Rest 문법 (...spread)는 타입스크립트에서는 다음과 같이 사용할 수 있다.

function sum(a: number, ...nums: number[]): number {  //또는 number[] 대신 Array<number>
  const totalOfNums = 0;
  for (let ket in nums) {
    totalOfNums += nums[key];
  }
  return a + totalOfNums;
}

this

타입스크립트에서는 this가 잘못 사용되었을 때 타입을 지정하여 감지할 수 있다.

interface Abc {
  el: string;
  count: number;
  init(this: Abc): () => {};
}

let vm: Abc = {
  el: '#app', // string
  count: 10, // number
  init: (this: Abc) => { // () => {};
      return this.count;
  }
}

let getCount = vm.init();
let count = getCount();
console.log(count); // 10