초과 프로퍼티

타입 스크립트로 함수의 파라미터를 정의할때 가장 헷갈리는 부분이다. 다음 예제를 보자.

1
function printName(person: { first: string; last: string }) {
2
  console.log(`${person.first} ${person.last}`);
3
  console.log(person);
4
}
5

6
printName({ first: "Thomas", last: "Jenkins" });
7
printName({ first: "Mick", last: "Jagger", age: 473 }); // 개체 리터럴은 알려진 속성만 지정할 수 있으며 '{ first: string; last: string; }' 형식에 'age'이(가) 없습니다.ts(2353)
8

9
const singer = { first: "Mick", last: "Jagger", age: 473 };
10
printName(singer); // 에러가 나지 않는다.

위 예제의 6번째 줄을 보면 파라미터 타입으로 존재하지 않는 age라는 프로퍼티를 넣으려 하고 있다. 당연히 타입스크립트는 존재하지 않는 프로퍼티라고 하며 에러를 낸다. 그 다음 8번째 줄을 보면 age값이 포함된 객체를 변수에 따로 담아 그 다음에 할당된 변수 자체를 파라미터로 넘긴다. 그러면 이 때에는 에러가 발생하지 않는다.

변수에 담긴 객체가 올때 타입스크립트는 필요한 값이 있는지 확인만 한다.

출력 결과는 다음과 같다.

Thomas Jenkins
{ first: 'Thomas', last: 'Jenkins' }
Mick Jagger
{ first: 'Mick', last: 'Jagger', age: 473 }