codestates / codestates/BanThing

[Error Handling] TypeScript 에서 return 의 undefined 값 배제 관련 오류

Open
#93 0 comments 0 reactions 1 assignee Claimed by @slight-snow View on GitHub
client error solved
Dominant language
TypeScript
Stars
0
Forks
2
PR merge metrics
No merged PRs in 30d

Description

### 어떤 에러인가요?
- 이전 Error Handling 과 이어집니다.
- Introduction 컴포넌트에 imagePosition, image, title 이 props 로 전달되게 되는데,
다음과 같이 조건문이 작성되어 있었습니다.
```javascript
export default function Introduction(props: propsType): JSX.Element {
if (props.imagePosition === 'left') {
//사진이 왼쪽에 배치되어 있는 구조
} else if (props.imagePosition === 'right') {
//사진이 오른쪽에 배치되어 있는 구조
}
}
```
- 여기서 `JSX.Element` 아래에 빨간 밑줄이 나타나며 에러가 발생했습니다.
```
Function lacks ending return statement and return type does not include 'undefined'.
```

### 에러 핸들링 방법
- 해당 문제는 조건문 내의 결함성 문제였습니다.
- props.imagePosition 이 'left' 인 경우와 'right' 인 경우를 제외하고는 undefined 한 값을 리턴하게 된다는 것입니다.
- 따라서, 모든 조건이 다 포함될 수 있도록 작성되어야 합니다.
```javascript
export default function Introduction(props: propsType): JSX.Element {
if (props.imagePosition === 'left') {
//사진이 왼쪽에 배치되어 있는 구조
} else if (props.imagePosition === 'right') {
//사진이 오른쪽에 배치되어 있는 구조
} else {
return <>;
}
}
```
- 이렇게 모든 경우의 수를 조건문 상에 넣어두자 에러가 사라지며 정상적으로 작동했습니다.


Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.