1 of 23

Class Features Proposals

A status update for TC39, September 2020

Ujjwal Sharma and Daniel Ehrenberg

Igalia ❤ Bloomberg

1

2 of 23

Overview

2

3 of 23

How do they look?

3

​

Instance Fields

Instance Methods

Static Fields

Static Methods

Public

class Trainer {

pkmn = “Pikachu”

}

class Pokemon {

attack() { … }

}

class Pokemon {

static pkdx = […]

}

class Pokemon {

static starter() {

…

}

}

Private

class Trainer {

#pkmn = “Raikou”

}

class Pokemon {

#evolve() { … }

}

class Pokemon {

static #mobs = […]

}

class Pokemon {

static #teleport() {

…

}

}

4 of 23

What’s covered? -- ES5

4

​

Instance Fields

Instance Methods

Static Fields

Static Methods

Public

​

​

​

​

Private

​

​

​

​

5 of 23

What’s covered? -- ES6

5

​

Instance Fields

Instance Methods

Static Fields

Static Methods

Public

​

✅

​

✅

Private

​

​

​

​

6 of 23

What’s covered? -- ES6, class fields

6

​

Instance Fields

Instance Methods

Static Fields

Static Methods

Public

✅

✅

​

✅

Private

✅

​

​

​

7 of 23

What’s covered? -- ES6, class fields, private methods

7

​

Instance Fields

Instance Methods

Static Fields

Static Methods

Public

✅

✅

​

✅

Private

✅

✅

​

​

8 of 23

What’s covered? -- ES6, class fields, private methods,

static class features

8

​

Instance Fields

Instance Methods

Static Fields

Static Methods

Public

✅

✅

✅

✅

Private

✅

✅

✅

✅

9 of 23

Public and Private instance fields

class Pokemon {

name;

#hp = 0;

constructor(name, maxHP) {

this.name = name;

this.#hp = maxHP;

}

damage(dmg) {

this.#hp -= dmg;

}

}

9

10 of 23

Private Methods and Accessors

class Pokemon {

#hp = 0;

#exp = 0;

...

#levelUp() {

this.#hp *= 1.1;

this.#exp = 0;

}

set #experience(exp) {

this.#exp = exp;

if (this.#exp > EXP_REQD) this.#levelUp();

}

}

10

11 of 23

Static class features

​

class Pokemon {

static leaders = ["Roxanne", "Brawly", "Wattson", ...];

static #starters = ["Torchic", "Mudkip", "Treecko"];

static #assignStarter() {

const starter = Math.floor(Math.random() * 3);

return Pokemon.#starters[starter];

}

}

11

12 of 23

Proposals

12

13 of 23

Current Status

13

14 of 23

Specification Status

  • Stage 3, no open questions or semantic changes since Stage 3.
  • Some editorial improvements.
  • Unified spec pull request up, squash and rebase in progress.

14

15 of 23

Implementation Status

15

​

Babel

TS

XS

QuickJS

V8

SM

JSC

Public Instance Fields

✅ 7.0+

✅ N/A

✅

✅

✅ 72

✅ 69

✅ 14

Private Instance Fields

✅ 7.0+

✅ 3.8

✅

✅

✅ 74

⚙ Bug

🏁 tp109

Private Instance Methods

✅ 7.2/3

📆

✅

✅

✅ 84

📆

🔬 B/B

Public Static Fields

✅ 7.0+

✅ N/A

✅

✅

✅ 72

✅ 75

🔬 Bug

Private Static Fields

✅ 7.4

✅ 3.8

✅

✅

✅

⚙

🔬 Bug

Private Static Methods

✅ 7.6

📆

✅

✅

✅

📆

🔬

* excluding non-supporting engines

✅

Supported

⚙

Work in progress

🏁

Supported behind a flag

📆

Planned

🔬

Under review

​

​

16 of 23

Testing Status (Class Fields)

16

17 of 23

Testing Status (Private Methods)

​

​

17

18 of 23

Testing Status (Static Fields)

18

19 of 23

Future Plans

19

20 of 23

Implementation

  • Igalia has been implementing the proposals on JSC with Bloomberg support.
    • Getting review on JSC and addressing comments (thank you Apple).
    • Working on private fields optimizations on JSC.
    • Exploring the possibility of optimizing on other engines.
  • Mozilla (mgaudet) is actively working on SM implementations.

20

21 of 23

Specification

  • Unified PR, rebasing.
  • Addressing editorial concerns, updating to new spec conventions.
  • Will seek Stage 4 once multiple shipping browser implementations.

21

22 of 23

Advancement

  • Conservative because of the size of the proposal.
  • Current plan is to ask for advancement once there are multiple implementations shipping the whole package. It is important because:
    • Complex to optimize; we are working on proving it out.
    • The proposals are intertwined, so it makes sense to deal with them together.

22

23 of 23

Thank you!

23