Kio estas "Malvastigo" en TS?
Antaŭ ol ni rigardu la plibonigon de laŭvortaj tipoj en Typescript 4.5 kaj poste, mi nur rapide volas resumi, kion efektive signifas "Mallarĝigo" en ĉi tiu kunteksto. Esence vi povas malvastigi tipon en Tajpaj skribo kontrolante la ecojn de la ento. Se posedaĵo ekzistas sur la ento, kiu disponeblas nur por certa tipo, tiam Typescript komprenas ĉi tion kaj povas do provizi la ĝustajn tipojn.
La sekva kodekzemplo montras kion mi volas diri per tio.
type Addition = {
sum: number;
}
type Subtraction = {
result: number;
}
function calculate(action: Addition | Subtraction) {
if ('sum' in action) {
// Simple example of using properties
// of an entity to narrow down its
// actual type.
//
// 'action' is at this point of type
// 'Addition'. Nice!
const addition = action;
}
}
Malvastigo por Ŝablonaj Ŝnuroj Tipoj
Komencante kun Typescript-versio 4.5, ĉi tiu ŝablono ankaŭ povas esti aplikata por ŝablonaj laŭvortaj tipoj, ankaŭ konataj kiel tiuj specialaj ŝnuroj kun backticks. La ŝablono kongruo fariĝas vere potenca en la lingvo.
Kompreneble, por ke mallarĝigo fariĝu uzebla, ĉiuj tipoj en la komparo devas kunhavi la saman posedŝlosilon. Alie, vi povas simple uzi la komunan mallarĝigon kiel supre.
La sekva kodekzemplo montras kiel Ŝablonaj Ŝnuroj povas uzi Mallarĝigon:
type Addition = {
variant: `${string}-addition`;
sum: number;
}
type Subtraction = {
variant: `${string}-subtraction`;
result: number;
}
function process(action: Addition | Subtraction) {
if (action.variant === "simple-addition") {
// Stupid simple example, but you get the idea:
// We used 'simple-addition', and the pattern
// matching by TS understood that '...-addition'
// can be discriminated to 'Addition'.
const addition = action;
}
}
//
// Example that DOES NOT work.
//
// This demo illustrates that the
// discriminante has to be a string,
// else the pattern matching worn't work.
type Addition = {
variant: `${string}-arithemtic`;
sum: number;
}
type Subtraction = {
variant: `${number}-arithemtic`;
result: number;
}
function process(action: Addition | Subtraction) {
if (action.variant === "123-arithemtic") {
// Still 'Addion | Subtraction',
// as we can only compare against
// a string '123-arithmetic', which
// is of course the same for both.
const addition = action;
}
}
Kaj nun vi scias pri malvastigo de ŝablonaj literoj en Typescript! Ĉi tio eble estas funkcio, kiun vi ne tre ofte uzos, sed kiam ĝi taŭgas, mi pensas, ke ĝi povas multe redukti la kodkompleksecon kaj konservi vian kodbazon iom pli pura ol sen la funkcio.