타입스크립트

기본적인 타임스크립트 함수표현식

 

// 이름 있는 함수 표현식
const sum = function sum( a: number, b: number ): number {
	return a + b;
};

// 이름 없는 함수 표현식
const sum = function ( a: number, b: number ) : number {
	return a + b;
};

// 크게보면 위 문장도 실행문이다. 때문에 세미콜론 붙음

// 화살표 함수
const sum = ( a: number, b: number ): number => {
	return a + b;
};

// return 생략
const sum = ( a: number, b: number ): number => a+b;

// 객체의 리턴 생략은 중괄호를 구분하기 위해서 괄호 ()가 필요
const sum = ( a: number, b: number ) : { result : number } => ({ result : a+b })

// 변수 옆에 타입 어노테이션을 추가하고 함수 스스로 타입을 추론할 수 있게 한다.
const sum: ( a: number, b: number ) => number = ( a, b ) => a+b;
// 위에서 타입 어노테이션은 ( a:number, b:number ) => number

// 타입 어노테이션을 분리할 수도 있음, 화살표 함수
type MathFn = ( a: number, b: number ) => number;
const sum : MathFn = ( a, b ) => a + b;

// 아니면 객체 타입 문법을 사용할 수도 있다.
type MathFn = {
	( a: number, b: number ) : number;
};
const sum: MathFn = (a,b) => a + b;

// 사용예시
type MathFn = {
	( a: number, b: number): number;
    operator: string;
};

const sum: MathFn = ( a,b ) => a+b;
sum.operator = '+';

실행문과 표현식

 

실행문 statement

let x: number = 10;

// 값을 반환하지 아니함

console.log('hello world');

// 실행하고 끝남

 

표현식 expression 

let y:number = 5+3

// 8이라는 값을 반환한다

let z:number = Math.max(2,5,8)

// 8을 반환한다

 

1. 실행문은 어떤 작업을 수행하고 끝나는데, 표현식은 값을 반환

2. 실행문은 세미콜론을 붙이지만 표현식은 세미클론을 붙이지 아니함

3. 실행문은 변수에 할당할 수 없지만 표현식은 변수에 할당할 수 있다

 

클로져 ( Closure )

함수와 함수가 선언된 어휘적 환경 ( 렉시컬 환경 )의 조합이다.

간단하게 말하면, 함수가 자신이 선언될 당시의 환경을 기억하고 이를 기반으로 나중에

실행될 때 자신의 동작을 수행하는 것

function outer(){
	let count = 0;
    
    function inner(){
    	count++;
        console.log(count);
    }
    
    return inner;
    }
    
const incrementCount = outer();

incrementCount(); //1
incrementCount(); //2
incrementCount(); //3

incrementCount 함수가 호출될 때마다 카운트 값이 증가하고 출력되는데, 이것은 inner 함수가 자신이

선언될 당시의 count 변수의 상태를 기억하고 있기 때문이다.

이렇게 카운트 변수가 inner 함수 내부에서 계속해서 사용되고 있는 것이 클로저의 예시이다.

 

 

고차함수 (higher-order function)

다른 함수를 인수로 받거나 함수를 반환하는 함수

 

const add = ( a : number ) : ( number ) => number => ( b: number ) : number => a+b

 

간결한 건 알겠지만, 읽기 쉽지 않다. 이게 맞는 것일까