2. 변수, 함수 타입 정의

2-1 기본 타입

기본 타입에는 크게 다음 12가지가 있음

• Boolean

  let show: boolean = true;

• Number

  const num: number = 10;

• String

  let str2: string = "hello";

• Object

  let obj: object = {};
  let person: { name: string; age: number } = {
    name: "capt",
    age: 100,
  };

• Array

  let arr: Array<number> = [1, 2, 3]; // array는 타입 정의 시 맨 앞의 글자가 대문자이다.
  let heroes: Array<string> = ["Capt", "Thor", "Hulk"];
  let items: number[] = [1, 2, 3]; // 배열 리터럴을 사용하여 정의 또한 가능

• Tuple

  // 튜플은 배열의 길이가 고정되고 각 요소의 타입이 지정되어 있는 배열 형식을 의미
  let address: [string, number] = ["gangnam", 100];

• Enum

  • 이넘은 C, Java와 같은 다른 언어에서 흔하게 쓰이는 타입으로 특정 값(상수)들의 집합을 의미

    enum Avengers { Capt, IronMan, Thor }
    let hero: Avengers = Avengers.Capt;

  • 이넘은 인덱스 번호로도 접근 가능

    enum Avengers { Capt, IronMan, Thor }
    let hero: Avengers = Avengers[0];

  • 만약 원한다면 이넘의 인덱스를 사용자 편의로 변경하여 사용할 수도 있다

    enum Avengers { Capt = 2, IronMan, Thor }
    let hero: Avengers = Avengers[2]; // Capt
    let hero: Avengers = Avengers[4]; // Thor

• Any

  • 기존에 자바스크립트로 구현되어 있는 웹 서비스 코드에 타입스크립트를 점진적으로 적용할 때 활용하면 좋은 타입. 단어 의미 그대로 모든 타입에 대해서 허용한다는 의미를 갖고 있다

    let str: any = 'hi';
    let num: any = 10;
    let arr: any = ['a', 2, true];

• Void

  • 변수에는 undefined와 null만 할당하고, 함수에는 반환 값을 설정할 수 없는 타입

    let unuseful: void = undefined;
    function notuse(): void {
      console.log('sth');
    }

• Never

  • 함수의 끝에 절대 도달하지 않는다는 의미를 지닌 타입

    // 이 함수는 절대 함수의 끝까지 실행되지 않는다는 의미
    function neverEnd(): never {
      while (true) {
    
      }
    }

• Null
• Undefined

2-2 함수 타입

• **함수의 기본적인 타입 선언**

  // js
  function sum(a, b) {
    return a + b;
  }
  
  // ts
  function sum(a: number, b: number): number {
    return a + b;
  }

  함수의 반환 값에 타입을 정하지 않을 때는 void라도 사용

• 함수의 인자

  js 에서는 함수에서 정의한 이자의 개수에 상관없이 호출 시 추가적인 인자를 넣을 수 있지만 타입 스크립트에서는 정의되지 않은 파라미터를 제한하는 특성이 있다

  타입스크립트에서는 함수의 인자를 모두 필수 값으로 간주한다. 따라서, 함수의 매개 변수를 설정하면 undefined나 null이라도 인자로 넘겨야하며 컴파일러에서 정의된 매개변수 값이 넘어 왔는지 확인한다. 달리 말하면 정의된 매개변수 값만 받을 수 있고 추가로 인자를 받을 수 없다는 의미이다

  function sum(a: number, b: number): number {
    return a + b;
  }
  sum(10, 20); // 30
  sum(10, 20, 30); // error, too many parameters
  sum(10); // error, too few parameters

  // 함수의 파라미터의 타입을 정의하는 방식
  function sum(a: number, b: number) {
    return a + b;
  }
  sum(10, 20);
  
  // 함수의 반환 값에 타입을 정의하는 방식
  function add(): number {
    return 10;
  }
  
  // 함수의 타입을 정의하는 방식
  function temp(a: number, b: number): number {
    return a + b;
  }

• 옵셔널 파라미터

  // 함수의 옵셔널 파라미터
  function log(a: string, b?: object, c?: string) {
  
  }
  log("hello world");
  log("hello ts", {});
  log('string', {}, 'test')

  ?를 사용하여 함수에 정의된 매개변수의 갯수 만큼 인자를 넘기지 않아도 되도록 할 수 있다

• REST 문법이 적용된 매개변수

  ES6 문법에서 지원하는 Rest 문법은 타입스크립트에서 다음과 같이 사용할 수 있다

  function sum(a: number, ...nums: number[]): number {
    const totalOfNums = 0;
    for (let key in nums) {
      totalOfNums += nums[key];
    }
    return a + totalOfNums;
  }