TypeScript에서 함수의 매개변수로 쉽게 유형을 만드는 방법은 무엇입니까?

Originally posted here!

TypeScript에서 함수의 매개변수로부터 쉽게 유형을 만들려면 Parameters 유틸리티 유형을 사용하고 첫 번째 유형 인수로 매개변수 유형을 가져와야 하는 함수 유형 선언을 전달할 수 있습니다.

TL;DR

// a simple function
function sayGreeting(name: string, greeting: string) {
  return `${greeting}, ${name}`;
}

// make type from function's parameters
// using the `Parameters` utility type
type OnlyFunctionParameters = Parameters<typeof sayGreeting>; // [name: string, greeting: string]

sayGreeting라는 2개의 매개변수를 받는 name라는 함수가 있고 둘 다 다음과 같은 string 유형을 갖는 인사말이 있다고 가정해 보겠습니다.

// a simple function
function sayGreeting(name: string, greeting: string) {
  return `${greeting}, ${name}`;
}

이제 sayGreeting 함수에서 매개변수 유형을 가져오려면 Parameters 유틸리티 유형을 사용한 다음 sayGreeting 함수의 유형을 전달할 수 있습니다.

이제 typeof라는 멋진 연산자를 사용하고 함수 이름을 쓸 수 있기 때문에 어떻게 함수의 유형을 얻을 수 있는지 물을 수 있습니다. 이렇게 하면 매개변수와 반환 유형을 포함한 함수 전체 유형이 자동으로 유추됩니다. 그런 다음 이것을 Parameters 유틸리티 유형에 대한 첫 번째 유형 인수로 전달할 수 있습니다.

다음과 같이 할 수 있습니다.

// a simple function
function sayGreeting(name: string, greeting: string) {
  return `${greeting}, ${name}`;
}

// make type from function's parameters
// using the `Parameters` utility type
type OnlyFunctionParameters = Parameters<typeof sayGreeting>; // [name: string, greeting: string]

이제 OnlyFunctionParameters 위로 마우스를 가져가면 array of types 를 볼 수 있습니다. TypeScript에서 배열 유형인 변수의 유형으로 사용할 수 있습니다.

TypeScript의 함수 매개변수에서 유형을 성공적으로 만들었습니다. 예이 🥳!

codesandbox에 있는 위의 코드를 참조하십시오.

그게 다야 😃!

이 정보가 유용하다고 생각되면 자유롭게 공유하세요 😃.