A long list is rarely sent in one answer. APIs split it into pages: each answer holds a few items and says which page comes next. You keep asking until there is no next page.
You don't know in advance how many pages there are, so use a while loop that stops when the next page is null (JSON's null is null in TypeScript too, and a type like number | null lets a variable hold either). Here is the same idea on a plain object, following a chain of bus stops:
const nextStop: { [stop: string]: string | null } = { Home: "Park", Park: "School", School: null };
let stop: string | null = "Home";
while (stop !== null) {
console.log(stop);
stop = nextStop[stop];
}
The supplier's /catalog has 5 products, 2 per page. The interface CatalogPage in the starting code describes one answer:
GET /catalog?page=1 → {"page": 1, "items": ["Mug", "Notebook"], "next_page": 2}
GET /catalog?page=2 → {"page": 2, "items": ["Lamp", "Pen"], "next_page": 3}
GET /catalog?page=3 → {"page": 3, "items": ["Plant"], "next_page": null}
Your script must print:
Page 1 Mug Notebook Page 2 Lamp Pen Page 3 Plant
Your task: inside main, start at page 1 and keep asking /catalog for the page that next_page names, until it is null. Read each answer as a CatalogPage. For each page, print Page and its number, then every product name on it.
Assignment
Follow the Coding Tutorial to read every page of the catalog and print all its products.
Hint
Declare let page: number | null = 1; and build the address with SUPPLIER + "/catalog?page=" + page. Set page to data.next_page as the last line of the loop, or the script will ask for page 1 forever.
Free plan: 30 tutor messages. PRO is unlimited.
