정의되지 않은 값 처리하기

아래는 속성이나 링크에 접근하여 반환될 수 있는 undefined 값들을 처리하는 데 유용한 두 가지 패턴입니다.

명시적 확인

Copied!1
2
3
4
5
6
7
8
9
10
@Function()
// 고용인의 전체 이름을 반환하는 함수입니다.
public getFullName(employee: Employee): string {
    // 만약 고용인의 이름 또는 성이 정의되지 않았다면, 오류를 발생시킵니다.
    if (!(employee.firstName && employee.lastName)) {
        throw new UserFacingError("Cannot derive full name because either first or last name is undefined.");
    }
    // 고용인의 이름과 성을 결합하여 전체 이름을 반환합니다.
    return employee.firstName + " " + employee.lastName;
}

firstName와 lastName 필드가 모두 정의되어 있는지 확인함으로써, TypeScript 컴파일러는 return문이 포함된 마지막 줄이 올바르게 컴파일될 수 있다는 것을 알 수 있습니다. 이 접근법의 이점은 타입 검사가 더 명시적이며, undefined 값이 존재하는 경우 무엇이 잘못되었는지에 대해 더 명확한 오류를 발생시킬 수 있다는 것입니다.

Non-null 단언 연산자

TypeScript non-null 단언 연산자 (!)를 사용하여 undefined 경우를 무시할 수 있습니다.

Copied!1
2
3
4
5
6
7
@Function()
// 'getFullName'이라는 이름의 공용 함수를 선언합니다. 이 함수는 'Employee' 객체를 인자로 받아 해당 직원의 전체 이름을 반환합니다.
public getFullName(employee: Employee): string {
    // 직원의 firstName과 lastName을 가져와서 공백을 사이에 두고 합친 문자열을 반환합니다.
    // '!'는 해당 속성이 null이거나 undefined가 아니라는 것을 보장하는 TypeScript의 Non-null assertion 연산자입니다.
    return employee.firstName! + " " + employee.lastName!;
}

이 접근 방식은 TypeScript 컴파일러를 단순히 재정의하고 접근하려는 필드가 정의되어 있다고 주장합니다. 이는 더 간결한 코드를 제공하지만, 필드 중 하나가 undefined로 판명되는 경우에는 암호화된 오류를 일으킬 수 있습니다. 가능한 경우 명시적인 검사를 하는 것을 권장합니다.