làm thế nào tôi sẽ khai báo một 'khỉ vá' nguyên mẫu trong nguyên cảo

Question

tôi là tạo ra một tập tin d.ts cho webgl-utils.js từ google

Tôi có một vấn đề với một trong những dòng cuối cùng mà một phương pháp trong một đối tượng toàn cầu là 'khỉ vá' (tôi nghĩ rằng đây là thuật ngữ bên phải)

dòng vấn đề đọc:

/** 
    * Provides requestAnimationFrame in a cross browser way. 
    */ 
window.requestAnimFrame = (function() { 
    return window.requestAnimationFrame || 
      window.webkitRequestAnimationFrame || 
      window.mozRequestAnimationFrame || 
      window.oRequestAnimationFrame || 
      window.msRequestAnimationFrame || 
      function(/* function FrameRequestCallback */ callback, /* DOMElement Element */ element) { 
      window.setTimeout(callback, 1000/60); 
      }; 
})(); 

Làm thế nào tôi có thể tuyên bố này trong tập tin nguyên cảo của tôi vì vậy tôi sẽ không nhận được biên dịch lỗi khi tôi sử dụng chức năng:

function tick() 
{ 
     requestAnimFrame(tick); 
     drawScene(); 
} 

bây giờ tôi đã cố gắng:

interface window 
{ 
     requestAnimFrame(): any; 
} 

Nhưng điều này không loại bỏ các lỗi:

The name 'requestAnimFrame' does not exist in the current scope 

Answer 1

Bạn đang trên đường đi đúng hướng, nhưng bạn cần phải xác định tất cả các biến thể bạn có:

interface Window { 
    requestAnimFrame(callback: any, element?: any): void; 
    webkitRequestAnimationFrame(callback: any, element?: any): void; 
    mozRequestAnimationFrame(callback: any, element?: any): void; 
    oRequestAnimationFrame(callback: any, element?: any): void; 
} 

window.requestAnimFrame = (function() { 
    return window.requestAnimationFrame || 
     window.webkitRequestAnimationFrame || 
     window.mozRequestAnimationFrame || 
     window.oRequestAnimationFrame || 
     window.msRequestAnimationFrame || 
     function(callback, element?) { 
      window.setTimeout(callback, 1000/60); 
     }; 
})(); 

function tick() { 
    window.requestAnimFrame(tick); 
} 

Answer 2

chắc chắn tên giao diện khởi động với vốn "W" không phải là "w"

interface Window { 
    requestAnimFrame():any; 
} 

Trong mã gọi sử dụng window.requestAnimFrame();. Hy vọng điều này sẽ giải quyết vấn đề của bạn

Answer 3

cách khác:

declare var wnd: { 
    requestAnimationFrame: any; 
    webkitRequestAnimationFrame: any; 
    mozRequestAnimationFrame: any; 
    oRequestAnimationFrame: any; 
    msRequestAnimationFrame: any; 
} 
var wnd = window; 

export var requestAnimFrame = (function() { 
    return wnd.requestAnimationFrame || 
      wnd.webkitRequestAnimationFrame || 
      wnd.mozRequestAnimationFrame || 
      wnd.oRequestAnimationFrame || 
      wnd.msRequestAnimationFrame || 
      function (/* function FrameRequestCallback */ callback, /* DOMElement Element */ element) { 
       window.setTimeout(callback, 1000/60); 
      }; 
})(); 

Answer 4

Cách duy nhất đã làm việc cho tôi:

declare global { 
    interface Window { 
     requestAnimFrame(callback:() => void): any; 
     webkitRequestAnimationFrame(callback:() => void): any; 
     mozRequestAnimationFrame(callback:() => void): any; 
     oRequestAnimationFrame(callback:() => void): any; 
    } 
} 

Window.prototype.requestAnimFrame = function() { 
    return window.requestAnimationFrame || 
     window.webkitRequestAnimationFrame || 
     window.mozRequestAnimationFrame || 
     window.oRequestAnimationFrame || 
     function (callback) { 
      window.setTimeout(callback, 1000/60); 
     }; 
}