TypeScript - setTimeout'un doğru sürümünü kullanın (düğüm vs pencere)

En son derleyici sürümünü kullanmak için bazı eski TypeScript kodunu yükseltmeye çalışıyorum ve bir çağrı ile sorun yaşıyorum setTimeout. Kod, tarayıcının setTimeoutbir sayı döndüren işlevini çağırmayı bekler :

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

Ancak, derleyici bunu bir NodeJS.Timer döndüren düğüm uygulamasına çözüyor:

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

Bu kod düğümde çalışmaz, ancak düğüm türleri başka bir şeye bağımlılık olarak çekilir (ne olduğundan emin değil).

Derleyiciye setTimeoutistediğim sürümü seçmesi için nasıl talimat verebilirim ?

İşte söz konusu kod:

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

Bu, derleyici hatasını oluşturur:

TS2322: "Zamanlayıcı" türü, "sayı" türüne atanamaz.

Değişken bildirimini etkilemeyen başka bir geçici çözüm:

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

Ayrıca, windownesneyi açık bir şekilde kullanmak mümkün olmalıdır.any :

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

let timer: ReturnType<typeof setTimeout> = setTimeout(() => { ... });

clearTimeout(timer);

Kullanarak ReturnType<fn>platformdan bağımsızlık kazanırsınız. Sen kullanmak zorunda olmayacak any, ne de window.setTimeouthangi olacaktır kodu hiçbir nodeJS sunucusu (ör. Sunucu tarafı render sayfası) çalıştırırsanız bölünürler.

İyi haber, bu da Deno ile uyumlu!

Sanırım kodunuzu nerede çalıştıracağınıza bağlı.

Çalışma zamanı hedefiniz sunucu tarafı Node JS ise, şunu kullanın:

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

Çalışma zamanı hedefiniz bir tarayıcıysa, şunu kullanın:

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

Bu muhtemelen eski sürümlerle çalışacaktır, ancak TypeScript sürümü ^3.5.3ve Node.js sürümü ile Düğüme ^10.15.3özgü işlevleri Zamanlayıcılar modülünden içe aktarabilmelisiniz , yani:

import { setTimeout } from 'timers';

Bu , geçebileceğiniz türdeki bir Zaman Aşımı örneğini döndürür :NodeJS.TimeoutclearTimeout

import { clearTimeout, setTimeout } from 'timers';

const timeout: NodeJS.Timeout = setTimeout(function () { /* snip */  }, 500);

clearTimeout(timeout);

Ben de aynı sorunla karşılaştım ve ekibimizin kullanmaya karar verdiği geçici çözüm, zamanlayıcı türü için "herhangi biri" kullanmaktı. Örneğin:

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

SetTimeout / setInterval / clearTimeout / clearInterval yöntemlerinin her iki uygulamasıyla da çalışacaktır.

• Zamanlayıcılarla ilgili tipkript için gerçek bir çözüm istiyorsanız, buraya gidiyoruz:

  Hata dönüş türünde 'sayı', Zamanlayıcı veya başka bir şey değil.

  Bu, typcripts sürüm ~> 2.7 çözümü içindir:

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

Şimdi hepsini düzelttik, şöyle ilan edin:

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

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

 interface TimerStateI {
   timeInterval: number;
 }

 interface TimerI: TimerStateI {
   type: string;
   autoStart: boolean;
   isStarted () : bool;
 }

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

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

          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);
              this.started = true;
            } else if (this.myType === TIMER.TIMEOUT) {
              this.myTimer = setTimeout(this.myTick, this.timeInterval);
              this.started = true;
            }

          }

         private isStarted () : bool {
           return this.started;
         }

     ...
     }

Eğer hedeflediğiniz setIntervalarasında window. O zaman şu şekilde de yazabilirsiniz:

let timerId: number = setInterval((()=>{
    this.populateGrid(true)
  }) as TimerHandler, 5*1000)
}