타입스크립트에서 object
타입은 인터페이스와 클래스의 상위 타입입니다.
object
타입으로 선언된 변수는 number, boolean, string 등 다른 타입의 값을 가질 수 없지만, 속성 이름이 다른 객체를 모두 담을 수 있습니다.
let user: object = {name: "hoon", age: 26};
위 코드에서 object 타입은 객체를 대상으로 하는 any 타입처럼 동작합니다. 즉, object 안에 있는 속성들의 타입을 검사하지 않습니다. 이를 타입스크립트스럽게 동작하게 하기 위해 인터페이스 구문이 사용됩니다.
타입스크립트는 객체의 타입을 정의할 수 있게 해주는 interface
라는 키워드를 제공합니다.
interface 인터페이스 이름{
속성 이름: 속성 타입
속성 이름: 속성 타입
}
interface IPerson{
name: string
age: number
}
IPerson 인터페이스를 자세히 보겠습니다.
IPerson 인터페이스의 목적은 name과 age라는 속성이 둘 다 있는 객체만 유효하도록 하는 것 입니다.
interface IPerson{
name: string
age: number
}
let user1: IPerson = {name: 'hoon', age: 26} // 통과
let user2: IPerson = {name: 'nam'} // age 속성이 없으므로 error
let user3: IPerson = {age: 27} // name 속성이 없으므로 error
let user4: IPerson = {} // name과 age 속성이 모두 없으므로 error
let user5: IPerson = {name: 'young', age: 30, gender: 1}
// gender 속성이 있어서 error
인터페이스를 설계할 때 어떤 속성은 필수적으로 존재하여야 하지만, 어떤 속성은 선택적으로 존재하게 설계하고 싶을 때가 있습니다. 이러한 속성을 선택 속성
(optional property)이라고 합니다.
interface IPerson{
name: string
age: number
gender?: number
}
let user1: IPerson = {name: 'hoon', age: 26} // 통과
let user5: IPerson = {name: 'young', age: 30, gender: 1} // 통과
타입스크립트에서는 interface
속성을 사용하지 않고 인터페이스의 이름조차 없는 인터페이스를 만들 수 있습니다. 이를 익명 인터페이스
(anonymous interface)라고 합니다.
let user: {
name: string
age: number
gender?: number
} = {name: 'hoon', age: 26}
이러한 익명 인터페이스는 주로 함수를 구현할 때 사용합니다.
let user: {
name: string
age: number
gender?: number
} = {name: 'hoon', age: 26}
function callMe(me: {name: string, age: number, gender?: number}){
console.log(
me.gender ?
`${me.name} ${me.age} ${me.gender}` :
`${me.name} ${me.age}`
)
}
callMe(user); // hoon 26