타입스크립트의 함수

✔ 함수의 파라미터(매개변수) 타입

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

sum(10,20);

 

✔ 함수의 반환 값 에 타입을 정의하는 방식

function add(): number{
    return 10;
}

 

✔ 함수의 기본적인 타입 선언

// JS
function sum(a, b) {
  return a + b;
}

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

 

✔ 함수의 옵셔널 파라미터 (선택적 파라미터)

• 타입스크립트에서는 함수의 인자를 모두 필수 값으로 간주합니다.
• 즉, 정의된 매개변수 값만 받을 수 있고 추가로 인자를 받을 수 없다는 의미입니다.
• 하지만 필요에 따라서 선택적으로 사용하고 싶은 인자 앞에 ? 을 사용 합니다.

function log(a: string, b?: string){

}  
log('hello world'); // b에 ?을 뺴면 2개를 넘겨야 되는데 하나만 넘겼다고 에러가 뜬다.  
log('hello ts', 'abc')

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

 

자바스크립트와 다른 점

자바스크립트는 ❓

function sum(a,b) {  
	return a + b;  
}

// 10과 20은 각각 a와 b에 들어갑니다.  
// 추가적으로 나머지 인자들에 대해서는 반응을 하지 않습니다. <= 자바스크립트의 유연함  
sum(10, 20, 30, 40);

타입스크립트는 ❓

function sum(a: number, b: number): number{  
	return a + b;  
}
sum(10, 20, 30, 40); // 2개의 인수가 필요한데 4개를 가져왔다고 에러가 발생합니다.

 

참고

• 인프런
• 캡틴판교