Namespace declaration in Typescript - Mini Project: Build & Apply

Namespace Declaration in TypeScript

📖 Scenario: Imagine you are organizing a small library of books. You want to group related functions and variables under a common name to keep things tidy and avoid name clashes.

🎯 Goal: You will create a Library namespace that contains a list of books and a function to display the books.

📋 What You'll Learn

Create a namespace called Library

Inside Library, create a variable books which is an array of strings

Inside Library, create a function showBooks that prints each book name

Call the showBooks function outside the namespace to display the books

💡 Why This Matters

🌍 Real World

Namespaces help organize code in large projects by grouping related code together and avoiding name conflicts.

💼 Career

Understanding namespaces is important for working on TypeScript projects, especially when collaborating with others or managing big codebases.

1

Create the Library namespace with a books array

Create a namespace called Library and inside it create a variable called books which is an array containing these exact strings: 'The Hobbit', '1984', 'Brave New World'.

Typescript

namespace Library {
  // Create the books array here
  // Your code here
}

Need a hint?

Use namespace Library { } to start. Inside, declare export const books as an array of strings.

2

Add the showBooks function inside Library

Inside the Library namespace, add a function called showBooks that loops over the books array and prints each book name using console.log.

Typescript

namespace Library {
  export const books: string[] = ['The Hobbit', '1984', 'Brave New World'];

  // Add the showBooks function here
  // Your code here
}

Need a hint?

Define export function showBooks(). Use a for...of loop to print each book.

3

Call the showBooks function outside the namespace

Outside the Library namespace, call the showBooks function using the namespace prefix to display the list of books.

Typescript

namespace Library {
  export const books: string[] = ['The Hobbit', '1984', 'Brave New World'];

  export function showBooks(): void {
    for (const book of books) {
      console.log(book);
    }
  }
}

// Call the showBooks function here
// Your code here

Need a hint?

Use Library.showBooks() to call the function outside the namespace.

4

Display the list of books using the namespace function

Run the program to display the list of books. The output should show each book name on its own line.

Typescript

namespace Library {
  export const books: string[] = ['The Hobbit', '1984', 'Brave New World'];

  export function showBooks(): void {
    for (const book of books) {
      console.log(book);
    }
  }
}

Library.showBooks();

// Observe the output above

Need a hint?

Check the console output. You should see each book name printed on its own line.