Interpreting Errors

Оскільки TypeScript - це мова програмування, що зорієнтована на допомогу розробнику, її повідомлення про помилки намагаються бути надзвичайно корисними, коли щось пішло не так. Це може призвести до надмірного навантаження інформацією для починаючих користувачів компіляторів.

Давайте розглянемо приклад у середовищі розробки (IDE), щоб розібратися у процесі читання повідомлення про помилку.

type SomethingComplex = {
  foo: number,
  bar: string
}
function takeSomethingComplex(arg: SomethingComplex) {
}
function getBar(): string {
  return 'some bar';
}

//////////////////////////////////
// Example error production
//////////////////////////////////
const fail = {
  foo: 123,
  bar: getBar
};

takeSomethingComplex(fail); // TS ERROR HAPPENS HERE 

Цей приклад демонструє поширену помилку програміста, коли він не викликає функцію (bar: getBar має бути bar: getBar()). На щастя, TypeScript виявляє цю помилку, як тільки вона не відповідає вимогам типів.

Категорії помилок

Існують дві категорії повідомлень про помилки TypeScript: стислі (succinct) і докладні (detailed).

Стислі категоріі повідомлень (succinct)

Метою стислого повідомлення про помилку є надання прикладу традиційного опису компілятора номера помилки та повідомлення. У цьому прикладі стисле повідомлення виглядає наступним чином:

TS2345: Argument of type '{ foo: number; bar: () => string; }' is not assignable to parameter of type 'SomethingComplex'.

Це повідомлення досить зрозуміле. Однак, воно не надає інформаціі про причини виникнення помилки. Для цього призначене детальне повідомлення про помилку.

Детальні категоріі повідомлень (detailed)

Ці повідомлення виглядають так:

[ts]
Argument of type '{ foo: number; bar: () => string; }' is not assignable to parameter of type 'SomethingComplex'.
  Types of property 'bar' are incompatible.
    Type '() => string' is not assignable to type 'string'.

Метою детального повідомлення про помилку є підказка для користувача на причину виникнення певної помилки (у цьому випадку, несумісність типів). Перший рядок є таким самим, як у стислому повідомленні, а далі йде ланцюжок. Ви повинні читати цей ланцюжок як послідовність відповідей на питання розробника ЧОМУ? між рядками, наприклад:

ERROR: Argument of type '{ foo: number; bar: () => string; }' is not assignable to parameter of type 'SomethingComplex'.

WHY? 
CAUSE ERROR: Types of property 'bar' are incompatible.

WHY? 
CAUSE ERROR: Type '() => string' is not assignable to type 'string'.

Отже, першопричина в наступному,

• для властивості bar

• є функція () => string, тоді як вона очікувалася як string.

Це має допомогти розробнику виправити помилку для властивості bar (забули викликати функцію ()).

Як це відображається у підказці IDE

Зазвичай середовище розробки відображає спочатку детальне, а потім стисле повідомлення в підказці, як показано нижче:

Приклад повідомлення про помилку в IDE

• Зазвичай ви просто читаєте детальну версію, формуючи ланцюжок ЧОМУ? у своїй голові.

• Ви можете використовувати стислу версію, якщо вам потрібно здійснити пошук схожих помилок (за допомогою коду помилки TSXXXX або частини повідомлення про помилку).