Data Aggregation with TypeScript Maps

Welcome! The focus of today's lesson is on data aggregation, a practical concept utilizing Maps as our primary tool. In TypeScript, we leverage its rich type system to ensure safer and more robust code.

Data aggregation refers to gathering "raw" data and subsequently presenting it in an analysis-friendly format. An illustrative analogy is viewing a cityscape from an airplane, providing an informative aerial overview rather than delving into the specifics of individual buildings. We will guide you through operations such as Sum, Average, Count, Maximum, and Minimum for practical, hands-on experience, using TypeScript's types for enhanced reliability and clarity.

Let's continue!

We will begin with a hands-on example using a fruit basket represented as a Map. First, create a new Map with type annotations and set the quantities of various fruits:

const fruitBasket: Map<string, number> = new Map();
fruitBasket.set('apples', 5);
fruitBasket.set('bananas', 4);
fruitBasket.set('oranges', 8);

Next, sum the values in the Map. Start with a variable to hold the total number of fruits, explicitly typing it:

let totalFruits: number = 0;
for (const value of fruitBasket.values()) {
    totalFruits += value; // Add each fruit quantity to the total
}

Finally, print the total:

console.log(`The total number of fruits in the basket is: ${totalFruits}`);
// It outputs: "The total number of fruits in the basket is: 17"

Counting the number of fruit types in our basket corresponds to counting the number of keys in our Map. Start by creating the Map again, with type annotations:

const fruitBasket: Map<string, number> = new Map();
fruitBasket.set('apples', 5);
fruitBasket.set('bananas', 4);
fruitBasket.set('oranges', 8);

Then, count the elements using the size property:

const countFruits: number = fruitBasket.size; // Number of keys in the Map
console.log(`The number of fruit types in the basket is: ${countFruits}`);
// It outputs: "The number of fruit types in the basket is: 3"

The spread operator (...) allows an iterable such as an array, string, or Map to be expanded in places where zero or more arguments (for function calls) or elements (for array literals) are expected. It is useful for tasks such as copying or merging arrays, passing a variable number of arguments to functions, and working with Maps.

For instance, consider our fruit basket Map from earlier. You can use the spread operator to convert the Map's values into an array:

const fruitQuantities: number[] = [...fruitBasket.values()];
console.log(fruitQuantities);
// It outputs: [5, 4, 8]

Similarly, you can convert the keys into an array:

const fruitTypes: string[] = [...fruitBasket.keys()];
console.log(fruitTypes);
// It outputs: ['apples', 'bananas', 'oranges']