The Hero

Welcome to the last lesson of the TypeScript course! In it, you'll put together everything you've learned and build one program step by step: Kira's inventory and quest log. Kira the ranger carries a few items, uses some of them on her way, and keeps a list of her quests. When you finish, your program will print this:

Kira the ranger, level 3, health 34/50, gold 120
Inventory:
- Healing Potion (heals 20)
- Silver Sword (damage 12)
- Old Key (opens the crypt)
- Scroll of Light (spell: Light)
Kira drinks Healing Potion: health 50/50
Kira equips Silver Sword
Kira has no Dragon Egg
Quests:
[done] Wolves in the Woods: +50 gold
[open] The Lost Crown
[failed] Save the Miller: the mill burned down
[done] The Goblin Bridge: +30 gold
Done: 2, open: 1, failed: 1
Kira the ranger, level 3, health 50/50, gold 200

The program describes Kira, lists her items, uses two of them (the potion heals her, and she takes the sword in her hand), looks for one that she doesn't have, goes through her quests, counts them and adds the rewards to her gold. You'll use most of the course: annotations, functions, interfaces, read-only and optional properties, literal unions, discriminated unions with switch and the exhaustiveness check, find and undefined, a generic function with a constraint, Record, and a type taken from another type. Each exercise continues where the previous one ended (the editor starts with its finished code) and adds one piece.

The plan. The editor has four comments that split the program into parts. At the top, // Types: the types describe the data the program works with, so whoever opens the program sees them first. Under them, // Functions, then // Data with Kira (and later her quests), and at the bottom, // Main program, which uses the functions and prints. The types could go anywhere in the file, because they disappear before the program runs. But kira must be created above the main program, which uses her, because the program runs from top to bottom.

The first step: the hero. In this game, a hero is one of three classes. A list of allowed values is a literal union from the lesson on unions. A hero is an object, so she gets an interface, as in the lesson on object types. For example, a monster and its difficulty:

type Difficulty = "easy" | "normal" | "hard";

interface Monster {
    readonly name: string;
    difficulty: Difficulty;
    health: number;
}

function describeMonster(monster: Monster): string {
    return `${monster.name} (${monster.difficulty}), health ${monster.health}`;
}

const troll: Monster = { name: "Troll", difficulty: "hard", health: 80 };
console.log(describeMonster(troll));

This prints:

Troll (hard), health 80

Kira's name won't change during the adventure, so make it readonly. TypeScript will then report any line that tries to change it: Cannot assign to 'name' because it is a read-only property. Her health, gold and level will change, so they're ordinary properties. maxHealth is the most health she can have: later, a potion won't heal her above it.

Annotate kira with Hero, so that TypeScript checks her against the interface right where she's created. Without the annotation, TypeScript would infer her type from the object, and her heroClass would be just a string: an object's properties can change, so they get the wider type, as you saw with typeof in the previous lesson. describeHero(kira) would then be an error, because not every string is a HeroClass.

The function describeHero returns one line of text about the hero, and the main program prints it. Build the text with a template literal, as in describeMonster. At the end of the lesson, you'll print the same line once more, after Kira's adventure, so it's worth having a function for it.

Instructions

Under // Types, write the type HeroClass: a union of the literal types "warrior", "mage" and "ranger".

Under it, write interface Hero with a read-only name (a text), a heroClass of type HeroClass, and the numbers level, health, maxHealth and gold.

Under // Data, create a constant kira of type Hero: Kira, a ranger of level 3, with 34 health out of 50 and 120 gold.

Under // Functions, write a function describeHero(hero: Hero): string, and under // Main program, print what it returns for Kira:

Kira the ranger, level 3, health 34/50, gold 120

Start programming for free

By signing up, you agree to the Terms of Service and Privacy Policy.

Or sign up with:

1/7