class: the Same Thing, Less Typing

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19class Bus {
  constructor(plate, seatsLeft) {
    this.plate = plate;
    this.seatsLeft = seatsLeft;
  }

  describe() {
    return this.plate + ' has ' + this.seatsLeft + ' seats left';
  }

  book(n) {
    this.seatsLeft -= n;
    return this;
  }
}

const b = new Bus('LAG-441-XA', 9);
console.log(b.describe());
console.log(b.book(3).describe());

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15class Bus {
  constructor(plate) { this.plate = plate; }
  describe() { return this.plate; }
}

console.log('typeof Bus:', typeof Bus);

const a = new Bus('A');
const b = new Bus('B');

console.log('methods are shared:', a.describe === b.describe);
console.log('describe lives on the prototype:',
  Object.hasOwn(Bus.prototype, 'describe'));
console.log('the instance owns only data:', Object.keys(a));
console.log('chain:', Object.getPrototypeOf(a) === Bus.prototype);

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31class Example {
  // 1. A public field, with a default. Assigned to the instance.
  seats = 14;

  // 2. A private field. The # is part of the name. Lesson 08.
  #serial = 0;

  // 3. A static field: belongs to the class itself. Lesson 10.
  static built = 0;

  // 4. The constructor. Runs on `new`. At most one per class.
  constructor(plate) {
    this.plate = plate;
    Example.built++;
  }

  // 5. A method. Lands on Example.prototype.
  describe() { return this.plate; }

  // 6. A getter, read like a property. Lesson 09.
  get summary() { return this.plate + '/' + this.seats; }

  // 7. A setter, written like a property.
  set summary(value) { [this.plate, this.seats] = value.split('/'); }

  // 8. A static method: called on the class, not on an instance.
  static fromLabel(label) { return new Example(label.trim()); }

  // 9. An arrow field: bound to this instance forever. Lesson 03.
  report = () => this.plate + ' reporting';
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34class Example {
  seats = 14;
  #serial = Math.floor(Math.random() * 900 + 100);
  static built = 0;

  constructor(plate) {
    this.plate = plate;
    Example.built++;
  }

  describe() { return `${this.plate} (${this.seats})`; }
  get summary() { return `${this.plate}/${this.seats}`; }
  set summary(value) {
    const [plate, seats] = value.split('/');
    this.plate = plate;
    this.seats = Number(seats);
  }
  static fromLabel(label) { return new Example(label.trim()); }
  report = () => `${this.plate} has serial ${this.#serial}`;
}

const one = new Example('LAG-441-XA');
console.log(one.describe());
console.log('getter:', one.summary);

one.summary = 'ABJ-772-KM/11';
console.log('after setter:', one.describe());

const two = Example.fromLabel('   ENU-318-PH   ');
console.log(two.describe());
console.log('static count:', Example.built);

const detached = two.report;      // an arrow field survives detachment
console.log(detached());

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17class Stop {
  town = 'unnamed';
  reached = false;
  history = [];        // a fresh array per instance, unlike a prototype property

  constructor(town) {
    console.log('at the top of the constructor, town is already', JSON.stringify(this.town));
    if (town) this.town = town;
  }
}

const a = new Stop('Ore');
const b = new Stop();

console.log(a.town, '/', b.town);
a.history.push('passed');
console.log('separate arrays:', a.history, b.history);

1
2
3
4
5
6
7
8
9
10class Bus {
  constructor(plate) { this.plate = plate; }
}

try {
  const oops = Bus('LAG-441-XA');
  console.log(oops);
} catch (err) {
  console.log(err.name + ':', err.message);
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21// A class body always runs in strict mode, even in a sloppy script.
class Strict {
  test() {
    // In sloppy mode this would silently create a global. Here it throws.
    try {
      undeclared = 1;
      return 'assigned silently';
    } catch (err) {
      return err.name + ': ' + err.message;
    }
  }
}
console.log(new Strict().test());

// And unlike function declarations, a class cannot be used before its line.
try {
  new TooEarly();
} catch (err) {
  console.log(err.name + ':', err.message);
}
class TooEarly {}

1
2
3
4
5
6
7
8
9
10
11
12
13// A class expression, optionally anonymous.
const Bus = class {
  constructor(plate) { this.plate = plate; }
  toString() { return `Bus(${this.plate})`; }
};

const b = new Bus('LAG-441-XA');
console.log(String(b));
console.log(`${b}`);
console.log('class name:', Bus.name);

// Defining toString changes how the object appears in text.
console.log('plain object for comparison:', String({ plate: 'x' }));