Frontend/Typescript
[TS] 함수 타입 설정
rachel_13
2022. 9. 5. 00:09
1. 함수의 타입 설정
파라미터도 일종의 변수, 타입 설정이 가능하다
return 되는 값 의 타입 지정도 가능하다,
function multipleTwice(x:number) :number {
return x*2;
}
2. 함수의 특징 - void 타입
return이 없을 경우 void 타입 선언 가능
return 문이 없어야 하는데 return될 때, 이를 방지해준다.
function multipleTwice(x:number) :void {
}
3. 파라미터 옵션
파라미터를 지정해두고 함수 호출시 파라미터를 사용하지 않을 경우에는, 타입스크립트의 경우 에러를 뱉는다.
(자바스크립트에서는 상관없다.)
function multipleTwice(x?:number) :void {
}
multipleTwice() //에러 안남
❗️변수? 타입 의 의미는 변수: 타입 | undefined ~ union type 와 같다.
따라서 다음과 같은 경우, 타입스크립트에서 에러로 인식한다.
function multipleTwice(x?:number) :number {
reutrn x * 2;
}
왜냐하면, 파라미터인 x의 타입이 확실치 않기 때문이다. x 가 number 또는 undefined일 수 있기 때문에 엄격한 검사에 의해 위 함수는 에러로 인식한다.
4. Narrowing
타입에 대한 조건을 걸어줘서 엄격하게 검사한다.
👉 타입이 하나로 확정되지 않은 경우, Type Narrowing을 사용한다.
function multipleTwice(x?:number) :number {
if(typeof x === 'number'){
return x * 2;
} else {
return x + '1';
}
}