IT이야기

TypeScript - 올바른 버전의 setTimeout 사용(노드 대 창)

cyworld 2021. 10. 7. 21:03
반응형

TypeScript - 올바른 버전의 setTimeout 사용(노드 대 창)


최신 컴파일러 버전을 사용하기 위해 일부 오래된 TypeScript 코드를 업그레이드하는 중이며 setTimeout. 코드는 setTimeout숫자를 반환하는 브라우저의 함수 를 호출할 것으로 예상합니다 .

setTimeout(handler: (...args: any[]) => void, timeout: number): number;

그러나 컴파일러는 이를 대신 노드 구현으로 해결하여 NodeJS.Timer를 반환합니다.

setTimeout(callback: (...args: any[]) => void, ms: number, ...args: any[]): NodeJS.Timer;

이 코드는 노드에서 실행되지 않지만 노드 유형은 다른 것에 대한 종속성으로 가져옵니다(무엇인지 확실하지 않음).

setTimeout내가 원하는 버전을 선택하도록 컴파일러에 지시하려면 어떻게 해야 합니까?

문제의 코드는 다음과 같습니다.

let n: number;
n = setTimeout(function () { /* snip */  }, 500);

이렇게 하면 컴파일러 오류가 발생합니다.

TS2322: '타이머' 유형은 '숫자' 유형에 할당할 수 없습니다.


변수 선언에 영향을 주지 않는 다른 해결 방법:

let n: number;
n = <any>setTimeout(function () { /* snip */  }, 500);

또한 다음 window없이 명시적으로 개체 를 사용할 수 있어야 합니다 any.

let n: number;
n = window.setTimeout(function () { /* snip */  }, 500);

x: ReturnType<typeof setTimeout>;실제로 사용되는 플랫폼과 독립적으로 작동하므로 사용 하는 것이 좋습니다 .


나는 같은 문제에 직면했고 우리 팀이 사용하기로 결정한 해결 방법은 타이머 유형에 "임의"를 사용하는 것이었습니다. 예:

let n: any;
n = setTimeout(function () { /* snip */  }, 500);

setTimeout/setInterval/clearTimeout/clearInterval 메서드의 두 구현 모두에서 작동합니다.


코드를 실행할 위치에 따라 다릅니다.

런타임 대상이 서버 측 Node JS인 경우 다음을 사용하십시오.

let timeout: NodeJS.Timeout;
global.clearTimeout(timeout);

런타임 대상이 브라우저인 경우 다음을 사용하십시오.

let timeout: number;
window.clearTimeout(timeout);

  • 타이머에 대한 typescript에 대한 실제 솔루션을 원하면 여기로 이동합니다.

    버그는 반환 유형 '숫자'에 있으며 타이머 또는 다른 것이 아닙니다.

    이것은 typescripts 버전 ~ >2.7 솔루션용입니다.

export type Tick = null | number | NodeJS.Timer;

이제 모든 황마 선언을 다음과 같이 수정했습니다.

 import { Tick } from "../../globals/types";

 export enum TIMER {
    INTERVAL = "INTERVAL",
    TIMEOUT = "TIMEOUT", 
 };

 interface TimerStateI {
   timeInterval: number;
 }

 interface TimerI: TimerStateI {
   type: string;
   autoStart: boolean;
 }

     class myTimer extends React.Component<TimerI, TimerStateI > {

          private myTimer: Tick = null;
          private myType: string = TIMER.INTERVAL;

          constructor(args){
             super(args);
             this.setState({timeInterval: args.timeInterval});

             if (args.autoStart === true){
               this.startTimer();
             }
          }

          private myTick = () => {
            console.log("Tick");
          }    

          private startTimer = () => {
            if (this.myType === TIMER.INTERVAL) {
              this.myTimer = setInterval(this.myTick, this.timeInterval);
            } else if (this.myType === TIMER.TIMEOUT) {
               this.myTimer = setTimeout(this.myTick, this.timeInterval);
            }



          }

     ...
     }

ReferenceURL : https://stackoverflow.com/questions/45802988/typescript-use-correct-version-of-settimeout-node-vs-window

반응형