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);

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

clearTimeout(timer);

За допомогою ReturnType<fn>ви отримуєте незалежність від платформи. Ви не будете змушені використовувати anyні , window.setTimeoutякі будуть ламатися при запуску коду немає сервера nodeJS (наприклад, на стороні сервера візуалізації сторінки).

Хороші новини, це також сумісно з Deno!

Я думаю, це залежить від того, де ви будете запускати свій код.

Якщо вашою метою виконання є серверний Node JS, використовуйте:

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

Якщо вашою метою виконання є браузер, використовуйте:

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

Це, швидше за все, працюватиме зі старими версіями, але з версією TypeScript ^3.5.3та версією Node.js ^10.15.3ви зможете імпортувати функції, характерні для Node, з модуля Таймери , тобто:

import { setTimeout } from 'timers';

Це поверне екземпляр часу очікування типу, NodeJS.Timeoutякий ви можете передати clearTimeout:

import { clearTimeout, setTimeout } from 'timers';

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

clearTimeout(timeout);

Я зіткнувся з тією ж проблемою, і обхідний шлях, який вирішила використовувати наша команда, полягав лише у використанні "будь-якого" для типу таймера. Наприклад:

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

Він буде працювати з обома реалізаціями методів setTimeout / setInterval / clearTimeout / clearInterval.

• Якщо ви хочете отримати реальне рішення для машинопису про таймери, ми переходимо до:

  Помилка повертається типу 'номер', це не Таймер або щось інше.

  Це для рішення версій машинописів ~> 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;
   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;
         }

     ...
     }