타입스크립트에서 함수 선언문은 자바스크립트 함수 선언문에서의 매개 변수와 함수 반환값에 타입을 붙이는 형태이다
function 함수 이름( 매개변수1 : 타입1, 매개변수2, 타입2[,...]): 반환값 타입{
함수 몸통
}
function add(a: number, b: number): number {
return a + b
}
변수와 마찬가지로 함수 선언문에서도 타입 주석을 생략할 수 있으나, 타입이 생략되면 함수의 구현 의도를 알기 어렵다.
void 타입
값을 반환하지 않는 함수의 반환타입이다.
function print(name: string, age: number): void {
console.log(`name: ${name}, age: ${age}`)
}
함수의 타입을 함수 시그니처라고 하는데, 아래와 같이 표현 될 수 있다.
let print:( string, number) => void = function (name: string, age: number): void {}
type 키워드 활용
타입스크립트에는 type이라는 키워드를 제공하며, 기존 존재하는 타입을 이름을 바꿔서 타입 별칭 기능을 제공한다.
type 새로운 타입 = 기존 타입
type strNumFunc = (string, number) => void
let f = strNumFunc = function( a: string, b: number): void {}
타입 별칭을 통해 간단하게 타입 주석을 붙일 수 있다.
undefined의 경우 매개변수로 호출해도 자식타입으로 간주되어 구문 오류가 발생하지 않지만,
코드를 실행하면 'Cannot read property ' 속성이름 ' of undefined' 라는 오류가 발생한다.
오류를 방지하기 위해 매개변수 값이 indefined인지 판별하는 코드를 작성해야 한다.
interface IName{
name: string
}
function getName(o : IName) {
return o != undefined ? o.name : 'unkown name'
}
let n = getName(undefined)
console.log(n) // unkown name
console.log(getName({name:'Jack'})) // Jack
인터페이스 선택 속성 처럼 선택정 매개변수의 지정이 가능하다.
function fn(name: string, age?: number): void{}
콜백함수를 표현할 때에는 다음과 같이 사용한다.
const f = (callback: () => void): void => callback()
매개변수 기본값 지정하기
선택적 매개변수는 항상 그 값이 undefined로 고정되기 때문에 어떤 값을 설정하고 싶다면 매개변수 기본값을 지정할 수 있다.
이를 디폴트 매개변수(default parameter)라고 한다
(매개변수: 타입 = 매개변수 기본값)
export type Person = {name: string, age: number}
export const makePerson = (name: string, age: number = 10): Person => {
const person = { name: name, age: age}
return person
}
console.log(makePerson('Jack')) // { name: 'Jack', age: 10}
console.log(makePerson('Jack',33)) // { name: 'Jack', age: 33}
위를 간결하게 구현하기 위해 다음과 같이 하면 된다.
export type Person = {name: string, age: number}
export const makePerson = (name: string, age: number = 10): Person => ({name, age})
console.log(makePerson('Jack')) // { name: 'Jack', age: 10}
console.log(makePerson('Jack',33)) // { name: 'Jack', age: 33}
매서드
매서드란 function으로 만든 함수 표현식을 담는 속성이다.
method는 () => void 타입의 함수 표현식을 설정한다.
class A {
value: number = 1
method: () => void = function(): void{
console.log(`${this.value}`)
}
}
let a: A = new A
a.method() // 1
위의 코드를 간결하게 구현하면 아래와 같다.
class A {
constructor(public value: number = 1){}
method(): void{
console.log(`${this.value}`)
}
}
let a: A = new A
a.method() // 1
'언어의 기초 > 타입스크립트(Typescript)' 카테고리의 다른 글
[Typescript] 객체와 타입 (0) | 2020.12.29 |
---|---|
[Typescript] 타입스크립트 시작하기 (0) | 2020.12.23 |