inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

1.13) 콜백함수

콜백함수 호출시 인자 개수 체크

해결된 질문

121

유일용

작성한 질문수 8

0

안녕하세요. 강사님.
콜백함수 챕터에서 repeat 함수에서 호출하는 Callback 함수에 인수를 하나로 넣어주고 있는데 callback 함수가 어떤 함수 인지 모르는 상태에서 인수가 여러개인 함수를 넣어 준다면 오류가 발생하지 않을까요?

callback 함수로 들어오는 인자가 잘못된 경우 안에서 타입 체크등을 하기도 하는지 궁금합니다.

javascript react node.js

답변 2

2

이정환 Winterlood

안녕하세요 이정환입니다.

네 이럴 경우 함수 내부에서 오류가 발생할 수 있어요! 예를 들어 매개변수로 2개의 값을 받을 거라고 예상했지만 1개만 전달될 경우 두번째 매개변수에 접근하는 코드에서 충분히 오류가 발생할 수 있죠 ... 특히 전달되는 값이 함수나 객체, 배열일 경우 더 그렇구요

그래서 이런 문제를 해결하기 위해서는 타입스크립트를 사용하셔야 해요! 타입스크립트에서는 함수 선언시 설정해둔 매개변수가 충족되지 않거나, 넘치면 오류로 표시하여 프로그램 실행 전에 알려주거든요!

혹시 타입스크립트에 관련해 궁금하시다면 제 이후 강의인 한입 TS도 수강해보시는걸 추천드려요!

1

인프런 AI 인턴

안녕하세요, 인프런 AI 인턴입니다. 유일용님.

콜백 함수에 인자를 전달할 때 발생할 수 있는 문제와 그에 대한 해결 방법에 대해 질문 주셨네요. 본래 자바스크립트에서 함수는 동적으로 인자를 받을 수 있기 때문에, 호출 시 인자의 개수나 타입이 다르더라도 오류가 발생하지 않습니다. 이런 유연함 덕분에 JS는 다양한 패턴 구현에 유리하지만, 반대로 의도와 다른 인자가 전달되었을 때 발생하는 문제를 직접 관리하지 않으면 예기치 못한 버그가 생길 수 있습니다.

콜백 함수의 인자 및 타입 관리

  • 인자 수 체크: 함수 안에서 arguments.length를 통해 전달된 인자 개수를 확인할 수 있습니다. 이를 통해 전달된 인자의 개수가 예상치와 맞는지 확인하고, 필요하면 경고를 출력하거나 예외 처리를 할 수 있습니다.

  • 타입 체크: 흔히 사용하는 방법으로는 typeof를 이용한 타입 체크가 있습니다. 자바스크립트에서 다양한 타입이 사용 가능하므로, 이를 활용해 함수 내에서 인자의 타입을 검증할 수 있습니다.

  • TypeScript 사용: 보다 안전한 타입 관리를 원하신다면 TypeScript를 통해 함수의 인자 타입과 수를 강제할 수 있습니다. TypeScript를 사용하면 컴파일 시점에서 잘못된 인자 사용을 발견하여 디버깅 시간을 절약할 수 있습니다.

아래의 관련 질문과 답변을 참고하시면 더 많은 정보와 예제를 얻으실 수 있습니다:

이 링크는 리액트에서 함수 호출 시 인자 전달에 대한 고민을 다룬 부분으로, 인자가 객체로 전달될 때와 특정 인자를 별도로 전달할 때의 장단점이 설명되어 있습니다. 여러분의 코드 스타일에 맞춰 적용할 방법을 찾아보세요.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.

현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

useEffect와 lifecycle문의

0

28

2

프론트엔드 학습 수준 문의

0

39

2

리액트 챕터별 코드에서 eslint 설정파일이 없어요

0

48

2

데이터 로딩중 화면만 계속 나와요!!

0

55

2

퍼블리셔일경우 어느정도 수준까지 강의를 들어야할까요

0

79

2

이후의 커리큘럼 문의

0

102

2

실슬환경 설정에서 save후 console.log 부분이 새로고침이 안되는현상입니다.

0

50

2

최적화 관련 질문있습니다 (useMemo 등)

0

84

3

프로바이더 컴포넌트의 위치는 어떤 기준인가요?

1

82

3

Date 객체에 관련하여 질문드립니다.

0

85

2

리액트 개정판 교재 질문

0

60

2

예제코드가 안나와요!

0

78

2

select a variant 선택에서 javascript와 javascript+react compiler 중 무엇을 선택해야하나요? com

0

108

2

onMouseEnter 관련 문의 드립니다

0

92

3

배열의 렌더링 관련 질문 드립니다.

0

73

2

2:40초 refObj를 콘솔로 출력시 오류가 발생합니다.

0

113

2

TS, 리액트 강의중에 뭘 먼저 수강하는게 좋을까요?

0

137

2

useCallback 적용한 onCreate, onUpdate, onDelete 함수..

0

70

1

vs code 자동완성관련 문의

0

113

2

91강 useEffect내에서 상태변화함수 호출시 발생하는 에러

1

179

2

87강 필터 함수 질문

0

69

2

useRef, useState count 비교

0

67

2

안된다고했던 이유가 무엇이었는지 모르겠습니다

0

90

2

85강에서 객체를 왜 클래스로 만들어서 new 하지 않는건지 궁금합니다.

0

75

2