如何让打字稿停止抱怨不知道的功能？

Question

我正在使用Typescript作为需要使用JavaScript全屏API的Web应用程序。全屏API尚未得到官方支持，因此您必须使用供应商前缀。这里是我的代码的基础上，将样品从MDN：

function toggleFullScreen(element: JQuery) { 
    var fs = element[0]; 
    if (!document.fullscreenElement && // alternative standard method 
     !document.mozFullScreenElement && !document.webkitFullscreenElement && !document.msFullscreenElement) { // current working methods 
     if (fs.requestFullscreen) { 
      fs.requestFullscreen(); 
     } else if (fs.msRequestFullscreen) { 
      fs.msRequestFullscreen(); 
     } else if (fs.mozRequestFullScreen) { 
      fs.mozRequestFullScreen(); 
     } else if (fs.webkitRequestFullscreen) { 
      fs.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT); 
     } 
    } else { 
     if (document.exitFullscreen) { 
      document.exitFullscreen(); 
     } else if (document.msExitFullscreen) { 
      document.msExitFullscreen(); 
     } else if (document.mozCancelFullScreen) { 
      document.mozCancelFullScreen(); 
     } else if (document.webkitExitFullscreen) { 
      document.webkitExitFullscreen(); 
     } 
    } 
} 

然而，在我的IDE（Visual Studio中，但是这会发生在任何地方），我得到这样的错误：

The property 'fullscreenElement' does not exist on value of type 'Document'. 
The property 'mozFullScreenElement' does not exist on value of type 'Document'. 
The property 'webkitFullscreenElement' does not exist on value of type 'Document'. 

当然打字本可以”我知道这些函数存在，但我也不想重新声明文档为any只是为了摆脱这些错误，因为那样我就会失去所有其他类型的提示。

这里有什么解决方案？如何让TypeScript停止抱怨，但保留尽可能多的类型注释？

Answer 1

简单地说，您可以将这些项目添加到Document界面，错误将消失。

interface Document { 
    exitFullscreen: any; 
    mozCancelFullScreen: any; 
    webkitExitFullscreen: any; 
    fullscreenElement: any; 
    mozFullScreenElement: any; 
    webkitFullscreenElement: any; 
} 

您可以添加完整的类型信息，对于这些，即使是简单的：

interface Document { 
    exitFullscreen:() => void; 
    mozCancelFullScreen:() => void; 
    webkitExitFullscreen:() => void; 
    fullscreenElement:() => void; 
    mozFullScreenElement:() => void; 
    webkitFullscreenElement:() => void; 
} 

这将防止它们被误用。

对于静态属性，你可能只需要做出型动态，在下面的例子中的重要组成部分，是Element类型的断言，即(<any>Element)：

fs.webkitRequestFullscreen((<any>Element).ALLOW_KEYBOARD_INPUT); 

Answer 2

史蒂夫芬顿的回答非常好，在长此以往，应该是做的。记住类型是文档，并会帮助下一个开发者。

坏，但如果你希望它是

纯粹作为一个思想实验，你可以创建一个局部变量影着全球一个和明确类型它是任何只有一次证明了打字稿是宽容：

function toggleFullScreen(element: JQuery) { 
    var document:any = window.document; 
    document.AnythingCanHappen = 123; // No error 
} 

而对于更看中酮（抓斗从外范围内）：

var Element_Copy=Element; 
function toggleFullScreen(element: JQuery) { 
    var Element:any = Element_Copy; 
    Element.ShootMyself = true; 
} 

完整示例：

var Element_Copy=Element;       // Magic 
function toggleFullScreen(element: JQuery) { 
    var document:any = window.document;   // Magic 
    var Element:any = Element_Copy;    // Magic 
    var fs = element[0]; 
    if (!document.fullscreenElement && // alternative standard method 
     !document.mozFullScreenElement && !document.webkitFullscreenElement && !document.msFullscreenElement) { // current working methods 
     if (fs.requestFullscreen) { 
      fs.requestFullscreen(); 
     } else if (fs.msRequestFullscreen) { 
      fs.msRequestFullscreen(); 
     } else if (fs.mozRequestFullScreen) { 
      fs.mozRequestFullScreen(); 
     } else if (fs.webkitRequestFullscreen) { 
      fs.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT); 
     } 
    } else { 
     if (document.exitFullscreen) { 
      document.exitFullscreen(); 
     } else if (document.msExitFullscreen) { 
      document.msExitFullscreen(); 
     } else if (document.mozCancelFullScreen) { 
      document.mozCancelFullScreen(); 
     } else if (document.webkitExitFullscreen) { 
      document.webkitExitFullscreen(); 
     } 
    } 
} 

Answer 3

我有同样的问题。只需使用“方括号”符号来解决它。

if (document['exitFullscreen']) { 
    document['exitFullscreen'](); 
} else if (document['webkitExitFullscreen']) { 
    document['webkitExitFullscreen'](); 
} else if (document['mozCancelFullScreen']) { 
    document['mozCancelFullScreen'](); 
} else if (document['msExitFullscreen']) { 
    document['msExitFullscreen'](); 
} 

Answer 4

这是不推荐但另一种解决方案，以阻止编译器抱怨：

const document: any = window.document;