제네릭을 사용한 타입스크립트 화살표 함수의 구문은 무엇입니까?

제네릭을 사용한 타입스크립트 화살표 함수의 구문은 무엇입니까?

타이프스크립트 핸드북에는 현재 화살표 기능이 없습니다.일반 함수는 일반적으로 다음 구문을 사용하여 입력할 수 있습니다. 예:

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

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

편집

@Thomas의 코멘트에 의하면, 새로운 TS 컴파일러에서는, 다음의 조작을 간단하게 실시할 수 있습니다.

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

원답

로빈이 언급한 구문을 설명하는 완전한 예시는... 나를 집으로 데려왔다:

범용 함수

다음과 같은 것이 올바르게 동작합니다.

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

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

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

회피책:범용 파라미터의 extensions를 사용하여 컴파일러가 범용임을 암시합니다.예를 들어 다음과 같습니다.

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

에 있는 경우.tsx 쓸 수 <T> 됩니다.

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

as as as 와는 달리extends {}해킹, 이 해킹은 적어도 의도는 보존하고 있어

나는 위의 예가 혼란스럽다는 것을 알았다.리액트와 JSX를 사용하고 있기 때문에 시나리오를 복잡하게 만든 것 같습니다.

TypeScript Deep Dive에서 다음과 같이 화살표 제네릭에 대해 설명합니다.

회피책:범용 파라미터의 확장을 사용하여 컴파일러가 범용임을 암시합니다.이것은 나에게 도움이 되는 간단한 예에서 나온 것입니다.

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

난 이거면 돼

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

언어 사양에는 페이지 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})
               });
           };

너무 늦었지만 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)

난 이거면 돼

 const logSomething = <T>(something:T): T => {
       return something;
    }

있는 은 「」입니다만, 「」입니다.extends {}가 있어 extends any 「」를 합니다.T이 되다

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

의 안전성을 '유형 안전'을 할 수 .extends unknown 대신에

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

I: 이 유형의 선언을 사용하려면:

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

필요할 때 기능에 추가 소품을 정의할 수 있으며, 경우에 따라서는 일반적인 정의에서 기능 본체를 깨끗하게 유지하는 데 도움이 됩니다.

추가 소품(네임스페이스 등)이 필요 없는 경우 다음과 같이 단순화할 수 있습니다.

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

내가 이 대답에 늦은 거 알아.일반어를 사용하는 않습니다.async화살표 기능

여기 있습니다.

const example = async <T> (value: T) => {
    //awaiting for some Promise to resolve or reject;
     const result = await randomApi.getData(value);

} 

2021년, Ts 4.3.3

const useRequest = <DataType, ErrorType>(url: string): Response<DataType, ErrorType> 
   => {
      ...
   }

여러 개의 종속 범용 유형에 대한 예 추가:

이 함수는 다음과 같이 화살표 함수로 변환되었습니다.

http.get = function <T = any, R = AxiosResponse<T>>(url: string, config?: AxiosRequestConfig): Promise<R> {
            config.withCredentials = true;
            ....
          };

등호 대신 내선번호에 주의해 주세요.

http.get = async <T extends any, R extends unknown = AxiosResponse<T>>(url: string, config?: AxiosRequestConfig): Promise<R> => {
            config.withCredentials = true;
            ...
          };

화살표가 아닌 함수 방식입니다.OP에서 예제를 확장합니다.

function foo<T>(abc: T): T {
    console.log(abc);
    return abc;
}

const x = { abc: 123 };
foo(x);

const y = 123;
foo<number>(y);

모든 것에 대한 답변은 다음과 같이 하십시오.

const yar = <T,>(abc: T) => {
    console.log(abc);
    return abc;
}

다른 접근 방식은 중간 유형을 갖는 것입니다.

type XX = <T>(abc: T) => T;

const bar: XX = (abc) => {
    console.log(abc);
    return abc;
}

놀이터.

<T를 사용하여 {}>를) 사용하여 null을 수 있습니다.저는 <T,>> 그리고 그 문제는 지워집니다.왜 그런지 알아요?하지만 이것은 나에게 일을 했다.

여기서 화살표 기능을 갖춘 화살표는 다음과 같습니다.

• 직접 전화하려면 다음과 같이 하십시오.

const foo = <T>(value: T): void => {
    console.log(value);
foo('hello') // hello
}

• 나중에 사용할 유형을 만들려면:

type TFoo<S> = (value: S) => boolean;
const foo: TFoo<number> = (value) => value>0;
console.log(foo(1)) // true
console.log(foo(-1)) // false

이게 도움이 됐으면 좋겠네요!

언급URL : https://stackoverflow.com/questions/32308370/what-is-the-syntax-for-typescript-arrow-functions-with-generics