답변.

문제의 역사:

콜백 함수는 비동기 프로그래밍 및 책임 위임을 위한 JS 및 TS의 일반적인 관행입니다. TypeScript에서 이러한 함수의 타입 정의는 특히 매개변수가 옵션이거나 기본값을 가질 수 있을 때 안전성을 확보하는 중요한 부분입니다.

문제:

동적 JS에서 콜백 인수에 대한 타입 정의가 없으면 값 전달 오류, undefined 혼란 및 매개변수 순서 문제로 이어집니다. TypeScript에서는 이러한 문제를 피하기 위해 타입 정의가 필요하지만, 외부에서는 옵션성, 순서 및 기본값 관련 모든 세부사항을 준수하기 어렵습니다.

해결 방법:

모든 매개변수의 타입을 명시하고, 옵션 매개변수에는 물음표를 표시하며, 기본값은 함수 선언 시 직접 지정하고, 이를 타입에서 올바르게 설명하는 것을 잊지 말아야 합니다.

코드 예:

function fetchData(
  url: string,
  callback: (data: any, error?: Error) => void
) {
  // ...
}

// 옵션 매개변수 error가 있는 콜백
fetchData('/api', (data, error) => {
  if (error) {
    // 처리
  } else {
    // 성공
  }
});

// 기본값 매개변수가 있는 콜백
function process(
  cb: (x: number, y?: number) => void = (x, y = 10) => { /* ... */ }
) { /* ... */ }

주요 특징:

옵션 매개변수에는 "?" 기호를 사용합니다.
기본값은 함수 정의 내에서 기본값을 설정합니다.
타입 정의는 코드 유지 관리를 용이하게 하고 오류 수를 줄입니다.

트릭 질문들.

콜백 소비자는 모든 매개변수, 옵션 매개변수를 포함하여 명시적으로 고려해야 하나요?

아니요, 옵션 매개변수는 생략할 수 있으며 TypeScript는 오류를 발생시키지 않습니다. 물음표 синтаксис 덕분에 처리가 올바르게 진행됩니다.

콜백의 첫 번째 매개변수를 옵션으로 만들고 두 번째를 필수로 만들 수 있나요?

아니요. 옵션 매개변수는 항상 인수 목록의 끝에 위치해야 합니다. 순서 위반은 타입 오류로 이어집니다.

매개변수의 옵션성을 표시하지 않았는데 호출 시 해당 매개변수를 전달하지 않으면 어떻게 되나요?

TypeScript는 오류를 발생시킵니다 — 필수 매개변수는 전달되어야 하며, 오직 옵션 매개변수나 기본값을 가진 것만 생략할 수 있습니다.

일반적인 오류 및 안티 패턴

옵션 매개변수와 필수 매개변수의 순서 위반(먼저 필수, 그리고 옵션).
타입 또는 "any"의 명시적인 지시의 부족 — TypeScript의 이점을 잃게 만듭니다.
값을 대신해 undefined를 전달하려고 시도하고 기본값 작동을 기대하는 것(인수가 없을 때만 작동).

실생활 예시

부정적인 케이스

콜백의 두 번째 인수를 필수로 지정했으나 호출 시 전달하지 않았습니다. 컴파일 오류를 발생시켰습니다.

장점:

명확한 설명 없이 빠르고 쉽게 작성된 코드.

단점:

컴파일되지 않음.
유연성 상실 및 혼란스러운 책임.

긍정적인 케이스

옵션 매개변수가 있는 콜백을 타입 지정했습니다:

(cb: (x: number, y?: number) => void)

또는 기본값을 설정했습니다:

f = (x: number, y = 10) => { ... }