Question

我目前无法尝试将此代码移植到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错误是：

提供的参数与呼叫目标的任何签名
都不匹配

我尝试声明包含签名的interface WindowEx extends Window，然后转换为(< WindowEx>window).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
}

Answer 1

以下是我为编译代码所做的工作。我刚刚将requestAnimFrame()定义为全局并键入它，以便TypeScript可以验证对它的调用。目前没有任何扩展内置类型（如window）的好方法，因此需要执行(<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()); 
  }; 
})();

Answer 2

提供的参数与调用目标的签名不匹配的原因是因为您正在调用这样的函数：

(function(callback) { ... })();

即，该函数接受callback，但您没有传入。{/ p>

您应该删除callback作为参数，因为您没有在函数中的任何位置使用它。

将JavaScript requestAnimFrame移植到TypeScript

2 个答案: