Level 3 · Programming Skills · Course 3.1 JavaScript Programming

Module 21: Arrays and Objects

Goal: run JavaScript on your own computer with Node.js, and use arrays and objects to describe real things such as products, customers and orders. By the end you'll have a small product catalogue in code.

You'll need: VS Code, the terminal (Module 8), Git (Module 9), and everything from Level 2's JavaScript modules.

Lessons

  1. 1Running JavaScript with Node.js, and arrays15–25 minutes✓
  2. 2Array operations15–25 minutes✓
  3. 3Objects15–25 minutes✓
  4. 4Nested data15–25 minutes✓
  5. 5Modelling real things15–25 minutes✓

🛠️Module practice: Project A, part 1, a product catalogue

In catalogue.js:

  1. An array of at least eight product objects with id, name, category, price (in paise), and stock.
  2. Print every product as one line, for example "P001 Notebook (Stationery) ₹60.00, 25 in stock".
  3. Find a product by id with find, and print a friendly message if it doesn't exist.
  4. Add a new product and remove one by id, without using splice (hint: make a new array).
  5. Commit your work with a clear message.

✅Module check

Explain in a few sentences, in your own words:

When would you use an array, when an object, and how would you model products and orders together?

Show a good answer

A good answer mentions: an array is an ordered list of similar things (all the products); an object describes one thing with named properties (one product's name, price, stock). Real data nests them: an array of product objects, an array of orders, each order holding a list of items. Things refer to each other by a unique id rather than copying, so each fact is stored once.

📝Module quiz

10 questions · 10 marks each · 100 marks in all · pass mark 70% · retry as often as you like ·

1. An array has 5 items. What's the index of the last one?

Why each option is right or wrong

  • “5, the same as the length” (Incorrect): Index 5 would be a sixth item; reading it gives undefined.
  • “1, counting from the end” (Incorrect): Indexes count from the start, beginning at 0.
  • “-1, which means the last item” (Incorrect): list[-1] is undefined in JavaScript; only .at(-1) counts from the end.
  • “4” is correct.

    Array positions start at 0, so five items sit at 0, 1, 2, 3 and 4. The last index is one less than the length.

    • General rule: last index = list.length - 1.
    • Newer shortcut: list.at(-1) gives the last item.

📖 Revise: Lesson 1: Running JavaScript with Node.js, and arrays

Question ID module-21-q1 · Report a mistake in this question
2. Can you add an item to an array declared with const?

Why each option is right or wrong

  • “No, const arrays can't be changed at all” (Incorrect): That's what Object.freeze does. const only locks the variable name.
  • “Only when running in Node.js, not in browsers” (Incorrect): const behaves the same everywhere.
  • “Only by using splice, never push” (Incorrect): Every method that changes arrays works on a const array.
  • “Yes: const fixes the name, but the array's contents can change” is correct.

    const stops you pointing the variable at a different array. The array itself can still be changed: push, pop and setting items all work.

    • To stop changes: Object.freeze(list).
    • Reassigning fails: list = [] throws an error.

📖 Revise: Lesson 2: Array operations

Question ID module-21-q2 · Report a mistake in this question
3. Which changes the original array: slice or splice?

Why each option is right or wrong

  • “slice” (Incorrect): slice copies a section and leaves the original alone.
  • “Both of them” (Incorrect): Only splice changes the original.
  • “Neither of them” (Incorrect): splice does change the original array.
  • “splice” is correct.

    splice removes or inserts items in the original array. slice returns a new array copied from part of the original, leaving it unchanged.

    • Memory hook: the 'p' in splice is for 'permanent change'.
    • Prefer non-changing methods when other code uses the same array.

📖 Revise: Lesson 2: Array operations

Question ID module-21-q3 · Report a mistake in this question
4. You need a property whose name is stored in a variable field. How do you read it?

Why each option is right or wrong

  • “product.field” (Incorrect): This looks for a property literally named 'field'.
  • “product["field"]” (Incorrect): The quotes make it the literal word 'field' again, not the variable's value.
  • “product(field)” (Incorrect): That tries to call product as a function.
  • “product[field]” is correct.

    Square brackets take an expression, so product[field] uses the value inside field. Dot notation uses the literal word: product.field looks for a property actually called 'field'.

    • Useful for: looping over property names, or sorting by a chosen column.

📖 Revise: Lesson 3: Objects

Question ID module-21-q4 · Report a mistake in this question
5. order.delivery.address crashes because there's no delivery. What's a safe way to write it?

Why each option is right or wrong

  • “order.delivery.address || ""” (Incorrect): The crash happens before || is reached, while reading .address of undefined.
  • “order[delivery].address” (Incorrect): This uses a variable called delivery, which doesn't exist.
  • “order.delivery.address!” (Incorrect): The ! is a TypeScript hint; it doesn't prevent the crash.
  • “order.delivery?.address” is correct.

    Optional chaining ?. stops and gives undefined if the value before it is null or undefined, instead of crashing.

    • Then handle the gap: order.delivery?.address ?? "Pickup".

📖 Revise: Lesson 4: Nested data

Question ID module-21-q5 · Report a mistake in this question
6. Why can changing a copy made with { ...order } change the original's items?

Why each option is right or wrong

  • “Spread doesn't copy anything; it renames” (Incorrect): It does create a new object, just a shallow one.
  • “Because the original was declared with const” (Incorrect): const doesn't link copies to originals.
  • “JavaScript links every object to its copies” (Incorrect): Only nested values are shared, because spread is shallow.
  • “Spread copies only the top level, so nested arrays are shared” is correct.

    Spread creates a new outer object, but nested objects and arrays inside are copied by reference. Both the copy and the original point at the same items array.

    • Deep copy: structuredClone(order).
    • Or copy what you change: { ...order, items: [...order.items] }.

📖 Revise: Lesson 4: Nested data

Question ID module-21-q6 · Report a mistake in this question
7. Why should an order store customerId instead of a full copy of the customer?

Why each option is right or wrong

  • “To hide the customer's name from staff” (Incorrect): Staff can still look the customer up by ID. It's about consistency.
  • “Because JSON can't hold nested objects” (Incorrect): JSON can nest objects; that isn't the reason.
  • “IDs make orders load faster on phones” (Incorrect): Any speed difference is minor; consistency is the point.
  • “Customer details live in one place, so a change is made once” is correct.

    If each order copies the customer's details, a new phone number must be updated in every order, and some will be missed. Storing the ID and looking up the customer keeps one source of truth.

    • Exception: store facts that must not change later, like the price actually charged.

📖 Revise: Lesson 5: Modelling real things

Question ID module-21-q7 · Report a mistake in this question
8. Why do some systems store ₹60.50 as 6050?

Why each option is right or wrong

  • “To hide the real price from customers” (Incorrect): The shop still shows ₹60.50; storage format isn't hidden pricing.
  • “Databases don't allow decimal numbers” (Incorrect): Databases support exact decimal types; whole paise is a simpler alternative.
  • “Whole numbers take less space than decimals” (Incorrect): Space isn't the main reason; exactness is.
  • “Whole numbers avoid the rounding errors computers make with decimals” is correct.

    Computers store decimals in binary, which can't represent values like 0.1 exactly, so 0.1 + 0.2 gives 0.30000000000000004. Storing paise as whole numbers keeps money exact.

    • Convert for display: divide by 100 only when showing it.

📖 Revise: Lesson 5: Modelling real things

Question ID module-21-q8 · Report a mistake in this question
9. indexOf returns -1. What does that mean?

Why each option is right or wrong

  • “It's the last item in the array” (Incorrect): That's .at(-1). indexOf uses -1 only for 'not found'.
  • “The array is empty” (Incorrect): An empty array also gives -1, but so does any array without the item.
  • “It's the first item” (Incorrect): The first item is at index 0.
  • “The item isn't in the array” is correct.

    indexOf gives the position of the first match. Because 0 is a valid position, it uses -1 to mean 'not found'.

    • Common bug: if (list.indexOf(x)) is false when x is at position 0. Use includes for yes/no.

📖 Revise: Lesson 2: Array operations

Question ID module-21-q9 · Report a mistake in this question
10. const b = { ...a, price: 70 }. Does a.price change?

Why each option is right or wrong

  • “Yes, both objects share the price” (Incorrect): Top-level values like price are copied, not shared.
  • “Only if a was declared with let” (Incorrect): let or const doesn't affect this.
  • “It throws an error because price exists” (Incorrect): Later properties just override earlier ones.
  • “No, b is a new object” is correct.

    Spread copies a's properties into a new object, then price: 70 overrides that copy's price. The original a is untouched.

    • Common pattern for updating data without changing the original.

📖 Revise: Lesson 3: Objects

Question ID module-21-q10 · Report a mistake in this question

ProLearners Assist