Foundations

Variables and Types

Use const for values that are not reassigned and let for values that change.

const and let `const` protects a binding from reassignment, while `let` marks a binding that can change later.

Variables

unitPrice
variables.ts
Replay: real traced execution (multi-file project)
const unitPrice: number = 12;
let quantity: number = 3;
const label: string = "notebook";

const subtotal: number = unitPrice * quantity;
quantity = quantity + 1;
const nextSubtotal: number = unitPrice * quantity;

console.log(`${label}: ${quantity} items`);
console.log(`Before restock: $${subtotal}`);
console.log(`After restock: $${nextSubtotal}`);

const unitPrice: number = 8;
let quantity: number = 3;
const label: string = "notebook";

const subtotal: number = unitPrice * quantity;
quantity = quantity + 1;
const nextSubtotal: number = unitPrice * quantity;

console.log(`${label}: ${quantity} items`);
console.log(`Before restock: $${subtotal}`);
console.log(`After restock: $${nextSubtotal}`);

const unitPrice: number = 20;
let quantity: number = 3;
const label: string = "notebook";

const subtotal: number = unitPrice * quantity;
quantity = quantity + 1;
const nextSubtotal: number = unitPrice * quantity;

console.log(`${label}: ${quantity} items`);
console.log(`Before restock: $${subtotal}`);
console.log(`After restock: $${nextSubtotal}`);

  1. unitPrice ← 12, quantity ← 3, label ← notebook, subtotal ← 36

    1const unitPrice→ 12: number = 12;  //@unitPrice=8, 202let quantity→ 3: number = 3;3const label→ notebook: string = "notebook";45const subtotal→ 36: number = unitPrice→ 12 * quantity3;6quantity = quantity→ 4 + 1;7const nextSubtotal→ 48: number = unitPrice→ 12 * quantity4;89console.log(`${labelnotebook}: ${quantity4} items`);10console.log(`Before restock: $${subtotal36}`);11console.log(`After restock: $${nextSubtotal48}`);
    outputnotebook: 4 items
Before restock: $36
After restock: $48

  1. unitPrice ← 8, quantity ← 3, label ← notebook, subtotal ← 24, nextSubtotal ← 32

    1const unitPrice→ 8: number = 8;2let quantity→ 3: number = 3;3const label→ notebook: string = "notebook";45const subtotal→ 24: number = unitPrice→ 8 * quantity3;6quantity = quantity→ 4 + 1;7const nextSubtotal→ 32: number = unitPrice→ 8 * quantity4;89console.log(`${labelnotebook}: ${quantity4} items`);10console.log(`Before restock: $${subtotal24}`);11console.log(`After restock: $${nextSubtotal32}`);
    outputnotebook: 4 items
Before restock: $24
After restock: $32

  1. unitPrice ← 20, quantity ← 3, label ← notebook, subtotal ← 60

    1const unitPrice→ 20: number = 20;2let quantity→ 3: number = 3;3const label→ notebook: string = "notebook";45const subtotal→ 60: number = unitPrice→ 20 * quantity3;6quantity = quantity→ 4 + 1;7const nextSubtotal→ 80: number = unitPrice→ 20 * quantity4;89console.log(`${labelnotebook}: ${quantity4} items`);10console.log(`Before restock: $${subtotal60}`);11console.log(`After restock: $${nextSubtotal80}`);
    outputnotebook: 4 items
Before restock: $60
After restock: $80

Follow the Restock

  1. unitPrice starts at 12.
  2. quantity starts at 3, so subtotal is 36.
  3. quantity = quantity + 1 changes quantity to 4.
  4. nextSubtotal becomes 48.
  5. The program prints notebook: 4 items, Before restock: $36, and After restock: $48. | unitPrice | starting quantity | printed quantity | before | after | | --- | --- | --- | --- | --- | | 8 | 3 | 4 | $24 | $32 | | 12 | 3 | 4 | $36 | $48 | | 20 | 3 | 4 | $60 | $80 |

Exercise: variables.ts

Reproduce the default notebook restock output, then try unitPrice 8 and 20 and predict the before and after totals.