html - HTMLAudioElement som JS-ljud

Jag har ett ljud som jag laddar med HTML:

<audio>
    <source src="file.ogg" />
    <source src="file.mp3" />
</audio>

Jag har också utökat prototypen för att skapa en ny funktion:

Audio.prototype.restart = function(){
    this.pause();
    this.currentTime = 0;
    this.play();
}

Men när jag hämtar audioelementet, känner TypeScript inte igen det som en instans av Audio:

let file = document.querySelector("audio")! as Audio;

file.restart()

Jag får två fel:

'Audio' refererar till ett värde, men används här som en typ. Menade du 'typeof Audio'?ts(2749)

Egenskapen 'restart' finns inte på typen 'HTMLAudioElement'.ts(2339)

Hur fixar jag detta?

Svar #1

Du behöver

• Berätta för TS att en restart-funktion nu finns på HTMLAudioElements
• Berätta för TS att querySelector('audio') kommer att returnera ett HTMLAudioElement, vilket kan göras med generics

interface HTMLAudioElement {
    restart: () => void;
}
Audio.prototype.restart = function(){
    this.pause();
    this.currentTime = 0;
    this.play();
}
let file = document.querySelector<HTMLAudioElement>("audio")!;

file.restart()

'Audio' hänvisar till ett värde, men används här som en typ.

kommer upp eftersom Audio är en konstruktor - ett värde.

console.log(typeof Audio);