06. 함수.md

06. 함수

6.1. 타입스크립트 함수 사용

함수는 애플리케이션의 코드를 구성하는 기본 요소이다. 타입스크립트에서 함수는 클래스나 네임스페이스 내에 선언할 수 있고, 때론 모됼로서 사용된다. 타입스크립트는 자바스크립트에서 함수를 선언했던 것과 동일한 방식으로 선언해 사용자가 원하는 단위 기능을 수행할 수 있다.

타입스크립트와 다른 점이 있다면 함수의 매개변수나 반환값에 타입을 지정해 타입 안정성을 강화할 수 있다.

6.1.1. 자바스크립트 함수

기명 함수와 익명 함수의 선언

function myFunction(a, b)
{
	
}

let resultMultiplication = function(a, b) {return a * b};

자바스크립트 함수의 불안전성

• 함수의 매개변수에 대한 타입 검증(타입이 일치하지 않으면 타입 캐스팅)
• 함수의 연산을 수행한 후에 반환값에 대한 타입 캐스팅
• 함수 호출 결과에 대한 타입 캐스팅

6.1.2. 타입 안전성을 갖춘 타입스크립트 함수

function max(x: number, y: number): number{ }

6.2. 매개변수의 활용

6.2.1. 기본 초기화 매개변수

기본 초기화 매개변수는 함수의 특정 매개변수에 인수가 전달되지 않으면 매개변수에 설정된 초기값으로 값을 초기화 하는 기능이다.

y: number = 2

6.2.2. 나머지 매개변수

나머지 매개변수 (rest parameter)는 ES6에서 제안된 특징. 개수가 정해지지 않은 인수를 배열로 받을 수 있는 기능

function concat(...restParameter) {}

6.2.3. 선택 매개변수

선택 매개변수는 전달할 인수의 개수가 0개 이상 1개 미만으로 제한할 때 사용.

function sum(a: number, b?: number): number {}

기본 초기화 매개변수를 이용해 인수가 생략돼 있을 때 매개변수의 초기값을 설정할 수 있었다. 하지만 선택 매개변수와 초깃값설정은 같이 사용할 수 없다.

6.2.4. 함수 오버로드

함수명은 같지만, 매개변수와 반환 타입이 다른 함수를 여러 개 선언할 수 있는 특징.

function add(a: string, b: string): string;
function add(a: number, b: number): number;
function add(a: any, b: any): any {
    return a + b;
}

function pick(x: {name: string}): number;
function pick(x: {month: number}): string;
function pick(x: number): numer;
function pick(x: any): any;

를 유니언 타입 형태로 표현하면

function pick(x: number | {month: number} | {name: string}) : string | number;
function pick(x: any): any;

로 표현할 수 있다.

6.3. 익명 함수의 이해와 활용

6.3.1. 익명 함수와 화살표 함수

() => {};

화살표 함수는 익명 함수로서 매개변수 목록, 뚱뚱한 화살표, 함수 블록으로 구성된다.

매개변수가 하나도 없을 때는 ()로 표현한다. 매개변수가 1개일 때는 소괄호를 생략할 수 있다.

화살표 함수를 호출할 때는 화살표 함수가 할당된 변수를 이용해 호출한다.

중괄호를 사용한 경우 반환값이 있으면 return 키워드를 이용해 반환해야 한다. 만약 중괄호를 사용할 때 return 키워드를 생략하면 화살표 함수의 반환값이 존재하지 않게 된다.

즉시 호출 함수(IIF)

코드를 실행하면 별도의 외부 호출없이 자체적으로 호출되는 함수이다.

(x => {x;})(3);

let iif = (x => {return x;})(3);

화살표 함수를 필터 메서드에 적용

화살표 함수는 필터 메서드에 적용할 수 있다.

필터 메서드는 배열에서 조건에 맞는 요소를 추출하는데 사용한다. 필터 메서드를 사용한 방법은 for문을 순회해 조건에 맞는 요소를 추출하는 방법보다 편리하고 유지보수에 좋다.

let numberList = [1, 2, 3, 4, 5];
numberList = numberList.filter(n => {
    return n % 2 === 0;
});

화살표 함수를 리듀스 메서드에 적용

배열 값의 합을 손쉽게 구할 때는 리듀스 메서드(reduce method)를 이요할 수 있다. 리듀스 메서드는 누산기의 원리처럼 배열의 요소를 왼쪽에서 오른쪽으로 더해나가면서 누산된 값을 처리할 수 있는 함수이다.

[1, 2, 3, 4, 5].reduce((a, b) => { return a + b;});
//a 는 누적값
//b 는 카운터 값

이저 누적값은 화살표 함수가 반환한 값을 누적해 놓은 값이고, 현재 값은 배열을 순회하면서 현재 위치를 가리키는 카운터 값이다.

객체 리터럴의 선언과 객체 리터럴 타입의 선언

객체 리터럴(object literal)은 여러 속성과 값을 한 단위로 묶어서 표현할 수 있는 객체이다. 객체 리터럴의 속성은 키가 되고, 값은 숫자만 문자열 뿐만 아리나 사용자가 정의한 객체도 할당할 수 있다

함수는 객체이므로 함수도 속성값을 할당할 수 있다.

let person = {
    name: "Happy",
    hello: function (name2: string) {
        console.log("Hello, " + this.name + name2);
    }
};
person.hello("World");

// 실행 결과 : Hello, HappyWorld