Array type annotation syntax in Typescript - Mini Project: Build & Apply

Array type annotation syntax

📖 Scenario: You are creating a simple program to store a list of your favorite fruits using TypeScript. You want to make sure the list only contains strings.

🎯 Goal: Learn how to declare an array with a type annotation in TypeScript and print the list.

📋 What You'll Learn

Create an array variable with a string type annotation

Add a few fruit names as strings to the array

Print the array to the console

💡 Why This Matters

🌍 Real World

Arrays with type annotations help keep your data organized and safe in many real-world apps, like storing lists of names, products, or messages.

💼 Career

Understanding array type annotations is essential for TypeScript developers to write clear, error-free code that works well in teams and large projects.

1

Create a string array with fruits

Create a variable called fruits with type annotation string[] and assign it an array with these exact strings: 'apple', 'banana', 'cherry'.

Typescript

// Create a variable called fruits with type string[] and assign the array ['apple', 'banana', 'cherry']
// Your code here

Need a hint?

Use let fruits: string[] = [...] to declare the array with type annotation.

2

Add a new fruit to the array

Add a new string 'date' to the fruits array using the push method.

Typescript

let fruits: string[] = ['apple', 'banana', 'cherry'];
// Add 'date' to the fruits array using push
// Your code here

Need a hint?

Use fruits.push('date') to add the new fruit.

3

Create a function to print the fruits

Create a function called printFruits that takes a parameter items with type string[] and prints each fruit using a for loop with console.log.

Typescript

let fruits: string[] = ['apple', 'banana', 'cherry'];
fruits.push('date');
// Create function printFruits(items: string[]) that logs each item
// Your code here

Need a hint?

Use function printFruits(items: string[]) and a for...of loop to print each fruit.

4

Call the function to display the fruits

Call the printFruits function with the fruits array to print all fruits to the console.

Typescript

let fruits: string[] = ['apple', 'banana', 'cherry'];
fruits.push('date');
function printFruits(items: string[]) {
    for (let fruit of items) {
        console.log(fruit);
    }
}
// Call printFruits with fruits
// Your code here

Need a hint?

Call printFruits(fruits) to print the fruits.