제네릭이있는 Typescript 화살표 함수의 구문은 무엇입니까?

타이프 스크립트 핸드북에는 현재 화살표 기능이 없습니다. 일반 함수는 다음과 같은 구문으로 일반적으로 입력 할 수 있습니다.

function identity<T>(arg: T): T {
    return arg;
}

화살표 함수의 구문은 무엇입니까?

Robin이 참조한 구문을 설명하는 전체 예제 는 나를 위해 집으로 가져 왔습니다.

일반 함수

다음과 같은 것이 잘 작동합니다.

function foo<T>(x: T): T { return x; }

그러나 화살표 일반 기능을 사용하면 다음이 수행되지 않습니다.

const foo = <T>(x: T) => x; // ERROR : unclosed `T` tag

해결 방법 : generic 매개 변수에서 extends를 사용하여 컴파일러가 일반 매개 변수임을 암시하십시오. 예 :

const foo = <T extends unknown>(x: T) => x;

위의 예제가 혼란 스러웠습니다. React와 JSX를 사용하고 있으므로 시나리오가 복잡하다고 생각합니다.

화살표 제네릭을 나타내는 TypeScript Deep Dive 에서 설명을 얻었습니다 .

해결 방법 : 제네릭 매개 변수에 extends를 사용하여 컴파일러가 제네릭임을 암시하십시오.

    const identity = < T extends {} >(arg: T): T => { return arg; }

.tsx파일 에 있다면 쓸 수 <T>는 없지만 작동합니다.

const foo = <T, >(x: T) => x;

받는 반대로 extends {}해킹, 적어도이 해킹 의도를 유지합니다.

p.64f의 언어 사양

<T> (...) => {...} 형식의 구문은 형식 매개 변수가있는 화살표 함수 식 또는 형식 매개 변수가없는 화살표 함수에 적용된 형식 어설 션으로 구문 분석 될 수 있습니다. 전자로서 해결된다.

예:

// helper function needed because Backbone-couchdb's sync does not return a jqxhr
let fetched = <
           R extends Backbone.Collection<any> >(c:R) => {
               return new Promise(function (fulfill, reject) {
                   c.fetch({reset: true, success: fulfill, error: reject})
               });
           };

이것은 나를 위해 작동

const Generic = <T> (value: T) => {
    return value;
} 

와 인기 대답하면서 extends {}작품보다 더 extends any, 그것은이 강제 T객체로

const foo = <T extends {}>(x: T) => x;

이것을 피하고 타입 안전을 유지하려면 extends unknown대신 사용할 수 있습니다

const foo = <T extends unknown>(x: T) => x;

이 유형의 선언을 사용합니다.

const identity: { <T>(arg: T): T } = (arg) => arg;

필요에 따라 함수에 추가 소품을 정의 할 수 있으며 경우에 따라 함수 본문을 일반 정의에서 깨끗하게 유지하는 데 도움이됩니다.

추가 소품 (네임 스페이스 종류)이 필요하지 않은 경우 다음과 같이 단순화 할 수 있습니다.

const identity: <T>(arg: T) => T = (arg) => arg;

너무 늦었지만 ES6으로 확장 할 필요는 없지만 여전히 나를 위해 작동합니다 .... :)

let getArray = <T>(items: T[]): T[] => {
    return new Array<T>().concat(items)
}

let myNumArr = getArray<number>([100, 200, 300]);
let myStrArr = getArray<string>(["Hello", "World"]);
myNumArr.push(1)
console.log(myNumArr)