В Typescript мы должны проверять типы значений, такие как булевы, строковые, экземпляры объектов из классов, а также значения в объектах.
В Typescript у нас есть три способа работы с этим:
-
typeof: ключевое слово помогает проверить типы значений, такие как булево, строка, число и т.д.
-
instanceof: ключевое слово для сравнения экземпляра объекта с конструктором класса.
-
защитников типов: Мощный способ проверки типов с помощью языка функций typescript.
Сценарий
Мы создаем бухгалтерскую программу с классом сущности Invoice
в коде приложения.
class Invoice {
public amount: number;
public description: string;
country: string;
}
class SalesInvoices extends Invoice {
products: Array<string> = [];
}
class PurchaseInvoice extends Invoice {
tax: number;
}
const invoicesToProcess: Array<Invoice> = [];
Одна команда хочет, чтобы мы поработали над некоторыми задачами.
-
Создайте функцию поддержки числа или строки для поля описания.
-
Создайте функцию для добавления только SalesInvoice в массив invoiceToProcess.
-
Итерация invoiceToProcess и печать всех счетов, если страна «ES» и сумма больше 100.
Идея заключается в том, чтобы использовать typeof, instanceof и type guards для каждой задачи. Давайте сделаем это:
Использование TypeOf
Оператор typeof
помогает нам сравнивать типы значений javascript; поскольку параметр amount является строкой или числом, мы используем typeof
с троицей в функции createInvoice
.
function createInvoice(
description: string | number,
amount: number,
country
): Invoice {
const descriptionValue =
typeof description === "number" ? `${description}` : description;
return {
description: descriptionValue,
amount,
country,
};
}
Теперь у нас есть функция, строка поддержки и число в описании.
const invoiceWithNumber = createInvoice(1231321, 120, "ES");
const invoIceWithString = createInvoice("Banana", 90, "USA");
console.log(invoIceWithString, invoiceWithNumber);
Отлично, переходим ко второму шагу.
Узнайте больше о typeof и типах значений.
Использование InstanceOf
Наша задача состоит только в том, чтобы добавить SalesInvoice в invoicesToProcess, потому что salesInvoice расширяется от Invoice. InvoiceToProcess понимает любой параметр счета-фактуры и расширяет форму Invoice из счета-фактуры.
Оператор instanceof приходит нам на помощь, потому что он сравнивает экземпляры классов.
function addInvoiceToProcess(invoice: Invoice) {
if (invoice instanceof SalesInvoices) {
invoicesToProcess.push(invoice);
}
}
Оператор instanceof сравнивает конструктор с SalesInvoice, если он совпадает, мы помещаем счет-фактуру в массив. Давайте протестируем наш код.
const salesInvoice = new SalesInvoices();
salesInvoice.amount = 100;
salesInvoice.country = "ES";
const basicInvoice = new Invoice();
basicInvoice.amount = 90;
basicInvoice.country = "USA";
addInvoiceToProcess(basicInvoice);
addInvoiceToProcess(salesInvoice);
console.log(invoicesToProcess);
Работает отлично, переходим к последней задаче.
Узнайте больше об instanceof
Использование защитников типов
Для последних двух подходов мы используем typeof и instanceof, которые помогают нам с типами значений или экземплярами, но как насчет значений?
Последняя задача — вывести, если страна «ES», а сумма больше «100», и мы используем для этого защитные функции типов.
Защитники типов — это функция с оператором is
, использующая утверждение, чтобы сообщить компилятору, что он соответствует некоторому типу.
function isValidInvoice(invoice: Invoice): invoice is SalesInvoices {
return invoice.amount > 100 && invoice.country === "ES";
}
// the code looks clean.
invoicesToProcess.forEach((invoice) => {
if (isValidInvoice(invoice)) {
console.log(invoice);
}
});
Подробнее об охране типов
Подведение итогов
Мы узнали, как работать с проверкой типов в Typescript и использовали защитники типов для написания функций утверждения, чтобы сделать код чистым и легким для понимания.
Надеюсь, это поможет вам в будущем при проверке типов.
Полный исходный код