TypeScript Guidebook
  • TypeScript 가이드북
  • 소개
    • TypeScript를 사용하는 이유
  • 환경 구성 / CLI
    • 컴파일 설정
    • 린팅
    • IDE / 에디터
    • Google TypeScript Style
    • TSDX
  • 타입
    • primitive 타입
    • any 타입
    • array 타입
    • tuple 타입
    • enum 타입
    • function / union / void 타입
    • object 타입
    • null / undefined 타입
    • never 타입
    • 사용자 정의 타입
    • 타입 어설션
  • TS vs ES6
    • 블록 영역 변수, 상수 선언
    • 템플릿 리터럴
    • 화살표 함수
    • 전개 연산자 / 매개변수
    • 비구조화 할당
  • 클래스
    • 속성 with 접근 제어자
    • 메서드 with 접근 제어자
    • 상속
    • 게터 / 세터
    • 스태틱 속성, 메서드
    • 추상 클래스
    • 싱글턴
    • 읽기전용 속성
  • 네임스페이스와 모듈
    • 네임스페이스
    • 네임스페이스 멀티 파일
    • 네임스페이스 중첩
    • 모듈
    • 모듈 번들링
  • 인터페이스
    • 인터페이스와 클래스
    • 인터페이스와 매개변수
    • 인터페이스와 객체 리터럴
    • 인터페이스 옵션 속성
    • 인터페이스 읽기 전용 속성
    • 인덱스 시그니처 속성
    • 인터페이스와 함수타입
    • 인터페이스 확장
  • 제네릭
    • 제네릭과 클래스
    • 제네릭과 함수
    • 멀티 타입 설정
    • 타입 변수 상속
  • 데코레이터
    • 데코레이터 / 팩토리
    • 데코레이터 구성
    • 클래스 데코레이터
    • 메서드 데코레이터
    • 접근 제어자 데코레이터
    • 속성 데코레이터
    • 매개변수 데코레이터
Powered by GitBook
On this page
  • Default Parameters
  • Spread Operator
  • Rest Parameters
  1. TS vs ES6

전개 연산자 / 매개변수

Default Parameters

ES6부터 함수 매개 변수의 기본 값을 설정할 수 있습니다. TypeScript는 매개 변수 타입 설정 후 = 뒤에 기본 값을 할당하면 됩니다. 컴파일 된 코드를 살펴보면 기본 값으로 할당된 매개 변수는 void 0과 비교한 후 조건이 참일 경우 기본 값을 설정합니다. ( void 0은 undefined와 동일합니다)

작성 코드:

TypeScript
function countDown(start:number = 10): ()=>number {
  return () => start > 0 ? start-- : 0;
}

컴파일 코드:

JavaScript
function countDown(start) {
  if (start === void 0) { start = 10; }
  return function () { return start > 0 ? start-- : 0; };
}

Spread Operator

ES6부터 전개 연산자를 사용할 수 있습니다. 전개 연산자는 쓰임새가 다양합니다. TypeScript 역시 전개 연산자를 훌륭하게 지원합니다. 활용 방법을 살펴봅시다.

작성 코드:

TypeScript
let numbers:number[] = [101, 21, -12, 934, 87];

// 배열 내부 아이템으로 결합
numbers = [10, 31, 11, ...numbers, -2, 0];

// 배열 ⟹ 개별 아이템으로 순차적 제공
let min_number:number = Math.min(...numbers);
let max_number:number = Math.max(...numbers);

컴파일 코드:

JavaScript
var numbers = [101, 21, -12, 934, 87];

numbers = [10, 31, 11].concat(numbers, [-2, 0]);

var min_number = Math.min.apply(Math, numbers);
var max_number = Math.max.apply(Math, numbers);

Rest Parameters

ES6부터 나머지 매개 변수를 사용할 수 있습니다. 나머지 매개 변수는 함수에서 활용되며 전개 연산자를 매개변수 앞에 붙여 사용합니다. TypeScript에서 활용 방법 또한 동일합니다.

작성 코드:

TypeScript
function makeArray(...args:(number|string)[]): (number|string)[] {
  return args;
}

makeArray(11, 'eleven', 100, 'one hundred');

컴파일 코드:

JavaScript
function makeArray() {
  var args = [];
  for (var _i = 0; _i < arguments.length; _i++) {
    args[_i] = arguments[_i];
  }
  return args;
}

makeArray(11, 'eleven', 100, 'one hundred');
Previous화살표 함수Next비구조화 할당

Last updated 6 years ago