Lesson 3

Exploring The Universe of TypeScript Types

Grasping TypeScript Types

Hello, Space Explorer! Today, we're going to delve into the TypeScript data types. Think of data types as different celestial objects in our universe, each with its unique properties and uses. We'll explore five core TypeScript types — Number, String, Boolean, Void, and Undefined.

In TypeScript, types are categorized based on their characteristics. Understanding this is akin to realizing that Earth is a planet, not a star or an asteroid. This knowledge helps us predict behaviors in different situations.

Unveiling the Numerical Type

First, we're going to uncover numerical values through the Number type, which stores numbers such as 10 (integer numbers) or -2.19 (floating point numbers, i.e., numbers with a decimal point). Let's visualize it:

TypeScript
1let numPlanets: number = 8; // Declaring an integer number variable 2console.log(numPlanets); // Prints: 8 3 4let planetWeight: number = 3.52; // Declaring a floating point number variable with a decimal point 5console.log(planetWeight); // Prints: 3.52

Upon running this code, you'll see 8 and 3.52 printed — these are the values of our declared numPlanets and planetWeight variables.

Diving into the String Type

Next, we'll traverse the textual space with the String type, which represents any text data. Let's create planetName and assign it the value "Earth".

TypeScript
1let planetName: string = "Earth"; // Declaring a string variable 2console.log(planetName); // Prints: "Earth"

Seeing "Earth" printed to the console illustrates how the String variable planetName works!

Discovering the Boolean Type

In the TypeScript universe, the Boolean type is like binary stars, manifesting as either true (correct, valid) or false (incorrect, invalid). These are often used in programming to make decisions. Let's see it in action:

TypeScript
1let earthIsAPlanet: boolean = true; // Declaring a boolean variable 2console.log(earthIsAPlanet); // Prints: true 3 4let appleIsAPlanet: boolean = false; // Declaring another boolean variable 5console.log(appleIsAPlanet); // Prints: false

When you run this code, true and false are printed, which indicates that the earthIsAPlanet is true and appleIsAPlanet is false.

Void: The Absence of any Type

In TypeScript, void is used when there's no data. This type is usually used as the return type of functions that do not return anything. We'll learn more about functions soon.

TypeScript
1function printHello(): void { 2 console.log('Hello'); 3}

When this function is run, it prints Hello and does not return anything.

Undefined: What Does It Mean?

undefined, a designation for a variable that is declared but not assigned a value, is akin to spotting a planet about which we know nothing.

TypeScript
1let newPlanet: undefined; // Declaring a variable without assigning a value 2console.log(newPlanet); // Prints: undefined

When you run this code, undefined is printed, indicating that newPlanet has been declared but not assigned a value.

Lesson Summary and the Next Steps

Great job! We've journeyed through TypeScript types: Number, String, Boolean, Void, and Undefined. Now, let's progress toward practice exercises to reinforce this knowledge. As you learn more with each exercise, you'll gain a more profound understanding of TypeScript types. Remember, practice is key! Let's continue exploring!

Enjoy this lesson? Now it's time to practice with Cosmo!

Practice is how you turn knowledge into actual skills.