Classes

Constructors

Constructors initialize a new object when code creates an instance.

constructor A constructor receives arguments and prepares the new object.

Constructors

level
constructor.ts
Replay: real traced execution (multi-file project)
class Badge {
    label: string;
    level: number;

    constructor(label: string, level: number) {
        this.label = label;
        this.level = level;
    }

    text(): string {
        return `${this.label}-${this.level}`;
    }
}

const level: number = 3;
const badge: Badge = new Badge("TS", level);

console.log(badge.text());

class Badge {
    label: string;
    level: number;

    constructor(label: string, level: number) {
        this.label = label;
        this.level = level;
    }

    text(): string {
        return `${this.label}-${this.level}`;
    }
}

const level: number = 1;
const badge: Badge = new Badge("TS", level);

console.log(badge.text());

class Badge {
    label: string;
    level: number;

    constructor(label: string, level: number) {
        this.label = label;
        this.level = level;
    }

    text(): string {
        return `${this.label}-${this.level}`;
    }
}

const level: number = 5;
const badge: Badge = new Badge("TS", level);

console.log(badge.text());

  1. level ← 3, this.label ← TS, this.level ← 3, badge ← [object Object]

    5    constructor(label: string, level: number) {6        this.label = labelTS;7        this.level = level3;8    }910    text(): string {11        return `${this.label}-${this.level}`;12    }13}1415const level→ 3: number = 3;  //@level=1, 516const badge→ [object Object]: Badge = new Badge("TS", level3);1718console.log(badge[object Object].text());
    values this stepTSthis.label3this.level

  2. text(): string

    7    this.level = level;8}910text(): string {11    return `${this.labelTS}-${this.level3}`;12}

  3. console.log(badge.text());

    15const level: number = 3;  //@level=1, 516const badge: Badge = new Badge("TS", level);1718console.log(badge[object Object].text());
    outputTS-3

  1. level ← 1, this.label ← TS, this.level ← 1, badge ← [object Object]

    5    constructor(label: string, level: number) {6        this.label = labelTS;7        this.level = level1;8    }910    text(): string {11        return `${this.label}-${this.level}`;12    }13}1415const level→ 1: number = 1;16const badge→ [object Object]: Badge = new Badge("TS", level1);1718console.log(badge[object Object].text());
    values this stepTSthis.label1this.level

  2. text(): string

    7    this.level = level;8}910text(): string {11    return `${this.labelTS}-${this.level1}`;12}

  3. console.log(badge.text());

    15const level: number = 1;16const badge: Badge = new Badge("TS", level);1718console.log(badge[object Object].text());
    outputTS-1

  1. level ← 5, this.label ← TS, this.level ← 5, badge ← [object Object]

    5    constructor(label: string, level: number) {6        this.label = labelTS;7        this.level = level5;8    }910    text(): string {11        return `${this.label}-${this.level}`;12    }13}1415const level→ 5: number = 5;16const badge→ [object Object]: Badge = new Badge("TS", level5);1718console.log(badge[object Object].text());
    values this stepTSthis.label5this.level

  2. text(): string

    7    this.level = level;8}910text(): string {11    return `${this.labelTS}-${this.level5}`;12}

  3. console.log(badge.text());

    15const level: number = 5;16const badge: Badge = new Badge("TS", level);1718console.log(badge[object Object].text());
    outputTS-5

Follow the Constructor

  1. level starts at 3.
  2. new Badge("TS", level) creates a badge with label TS.
  3. The badge stores level 3.
  4. text() joins the label and level.
  5. The program prints TS-3. | level | label | text output | | --- | --- | --- | | 1 | TS | TS-1 | | 3 | TS | TS-3 | | 5 | TS | TS-5 |

Exercise: constructor.ts

Reproduce TS-3, then use levels 1 and 5 to predict each badge text.