TypeScript에서 "keyof 확장"과 "keyof 입력"은 무엇을 의미합니까?
TypeScript 에서는 다음과 같이 정의되는 타입이 있습니다.extends keyof
또는in keyof
나는 그들이 무엇을 의미하는지 이해하려고 노력했지만, 지금까지 성공하지 못했다.
내가 얻은 건keyof
onely는 모든 이름을 가능한 한 뒤에 지정한 유형의 속성 이름으로 포함하는 유니언 유형을 반환합니다.keyof
.
type T = keyof string;
T
그에 상당하다startsWith | endsWith | trim | substring | ...
.
이거 맞는건가요?
자, 내가 생각해보면extends keyof
그리고.in keyof
내 직감은 다음과 같다.
extends keyof
에서 유래하는 모든 타입입니다.T
즉, 가능한 모든 값을 가지고 있지만, 그 이상일 수도 있습니다.in keyof
에서의 값을 취득하는 타입입니다.T
그러나 반드시 모든 것은 아닙니다(가능성은 있지만 그 이하일 수도 있습니다).
그래서 이 POV에서extends keyof
에 대해 설명할 수 있다>=
관계.in keyof
에 대해 설명할 수 있다<=
관계.이거 맞는건가요?그렇지 않다면 무엇이 맞을까요?
모든 유형의 경우T
,keyof T
이미 알려진 공공재산명의 조합입니다.T
.
예:
interface Person {
age: number;
name: string;
}
type PersonKeys = keyof Person; // "age" | "name"
라고 하는 당신의 가정keyof string
수율startsWith | endsWith | trim | ...
이므로 정확합니다.자세한 내용은 룩업 유형 릴리스 노트를 참조하십시오.
확장 키
extends
이 경우 범용 파라미터의 유형을 제한하기 위해 사용됩니다.예:
<T, K extends keyof T>
K
따라서 공공재산명이 될 수 밖에 없다T
인터페이스의 확장과는 달리 타입의 확장이나 상속과는 관계가 없습니다.
의 사용법extends keyof
다음과 같은 경우가 있습니다.
function getProperty<T, K extends keyof T>(obj: T, key: K): T[K] {
return obj[key];
}
const person: Person = {
age: 22,
name: "Tobias",
};
// name is a property of person
// --> no error
const name = getProperty(person, "name");
// gender is not a property of person
// --> error
const gender = getProperty(person, "gender");
인덱스 타입에 관한 문서와는 별개로 이 기사가 도움이 되었습니다.
에 맞추어
in
문자열, 숫자 또는 기호 리터럴을 조합하여 입력할 인덱스 서명을 정의할 때 사용됩니다.와 조합하여keyof
이를 사용하여 원래 유형의 모든 속성을 다시 표시하는 소위 매핑 유형을 만들 수 있습니다.
의 사용법in keyof
다음과 같은 경우가 있습니다.
type Optional<T> = {
[K in keyof T]?: T[K]
};
const person: Optional<Person> = {
name: "Tobias"
// notice how I do not have to specify an age,
// since age's type is now mapped from 'number' to 'number?'
// and therefore becomes optional
};
맵 타입에 관한 문서와는 별도로, 나는 다시 이 유익한 기사를 발견했다.
재미있는 사실:그
Optional<T>
방금 만든 타입은 공식 유틸리티 타입과 동일한 시그니처를 가지고 있습니다!
언급URL : https://stackoverflow.com/questions/57337598/in-typescript-what-do-extends-keyof-and-in-keyof-mean
'bestsource' 카테고리의 다른 글
참조 콩을 유형별로 목록에 자동 연결 (0) | 2023.04.04 |
---|---|
앱 렌더링 html 엔티티(예: 앰퍼샌드)를 이스케이프로 응답 (0) | 2023.03.25 |
스프링 부트에서의 HTTP OPTIONS 요청 처리 방법 (0) | 2023.03.25 |
WordPress 플러그인이 설치되어 활성화되었는지 확인하는 방법 (0) | 2023.03.25 |
새 사용자가 생성/등록될 때 트리거되는 액션 후크는 무엇입니까? (0) | 2023.03.25 |