将JavaScript requestAnimFrame移植到TypeScript

2019年8月4日 236次阅读

我目前不想尝试将此代码移植到TypeScript.

if (typeof window !== 'undefined') {
  window.requestAnimFrame = (function(callback){
      return window.requestAnimationFrame ||
      window.webkitRequestAnimationFrame ||
      window.mozRequestAnimationFrame ||
      window.oRequestAnimationFrame ||
      window.msRequestAnimationFrame ||
      function(callback){
          window.setTimeout(callback, 1000 / 60, new Date().getTime());
      };
  })();
}

我得到的tsc错误是：

supplied parameters do not match any signature of call target

我已经尝试声明一个接口WindowEx扩展Window包含签名,然后转换为(< WindowEx>窗口).xxx,但我怀疑这是转换这个“典型”代码的正确方法.

尝试：

interface WindowEx extends Window {
  requestAnimFrame(callback, target?):number;
  webkitRequestAnimationFrame(callback, target?):number;
  mozRequestAnimationFrame(callback, target?):number;
  oRequestAnimationFrame(callback, target?):number;
  // msRequestAnimationFrame already at WindowAnimationTiming interface
}

最佳答案 这是我为编译代码所做的工作.我刚刚将requestAnimFrame()定义为全局并键入它,以便TypeScript可以验证对它的调用.目前没有任何扩展内置类型(如窗口)的好方法,因此需要执行诸如(< any> window).webkitRequestAnimationFrame之类的操作.作为一般规则,如果编译器抱怨并且您知道它是有效的JavaScript,您始终可以转换为< any>使它工作.

var requestAnimFrame: (callback: () => void) => void = (function(){ 
  return window.requestAnimationFrame || 
  (<any>window).webkitRequestAnimationFrame || 
  (<any>window).mozRequestAnimationFrame || 
  (<any>window).oRequestAnimationFrame || 
  window.msRequestAnimationFrame || 
  function(callback){ 
      window.setTimeout(callback, 1000 / 60, new Date().getTime()); 
  }; 
})();
点赞