Обещание возвращает {} вместо ImageData (TypeScript)

Question

Попытка использовать этот код в TypeScript:

convertURIToImageData(URI) {
    return new Promise((resolve, reject) => {
      if (URI == null) { return reject(); }
      const canvas = document.createElement('canvas');
      const context = canvas.getContext('2d');
      const image = new Image();
      image.addEventListener('load', () => {
        canvas.width = image.width;
        canvas.height = image.height;
        context.drawImage(image, 0, 0, canvas.width, canvas.height);
        const imageData = context.getImageData(0, 0, canvas.width, canvas.height);
        resolve(imageData);
      }, false);
      image.src = URI;
    });}

чтобы вернуть ImageData из Обещания, но все, что я получаю, это {}

Используя это так:

this.convertURIToImageData('url').then((img) => {
  // do stuff with ImageData
})

Начало:

 Argument of type '{}' is not assignable to parameter of type 'ImageData'. Type '{}' is missing the following properties from type 'ImageData': data, height, width

Answer 1

{} в настоящее время является резервным типом TypeScript. Если TypeScript не может определить, какой тип возвращается функцией, он автоматически выведет {}. TypeScript не может определить тип img в контексте, в котором вы его используете, поэтому он выводит {} и не компилируется.

Вы можете подтвердить, что это происходит, если у вас встроен TypeScript в ваш редактор кода, просто наведя указатель мыши на функцию, вы увидите тип возвращаемого значения Promise<{}>. Вы можете легко это исправить, комментируя возвращаемый тип функции:

convertURIToImageData(URI): Promise<ImageData> {

Теперь тип возвращаемого значения правильно отображается как Promise<ImageData>, и ваш код должен скомпилироваться.