i3Unconf

21/04/2020

@metaluca_dev

ES2020 (aka 11)

https://github.com/tc39/ecma262/releases/tag/es2020

ECMAScript

..un po' di storia

ECMAScript

=> {

javascript = Netscape()

}

return ECMA_International.tc39( javascript )

ECMAScript was always an unwanted trade name that sounds like a skin disease.

STAGES

#0 - strawman

#1 - proposal

#2 - draft

#3 - candidate

#4 - finished

https://github.com/tc39/ecma262/releases/tag/es2020

GIMME THE CODE!!!!!

FINISHED PROPOSAL

String.prototype.matchAllgit
import()git
BigIntgit
Promise.allSettledgit
globalThisgit
for-in mechanicsgit
Optional Chaininggit
Nullish coalescing Operatorgit
import.metagit
private class variables
namespace export

String.prototype.matchAll

proposal -- example

var regex = /t(e)(st(\d?))/g;
var string = 'test1test2';

string.match(regex); // gives ['test1', 'test2'] - how do i get the capturing groups?

var matches = [];
var lastIndexes = {};
var match;
lastIndexes[regex.lastIndex] = true;
while (match = regex.exec(string)) {
	lastIndexes[regex.lastIndex] = true;
	matches.push(match); // example: ['test1', 'e', 'st1', '1'] with properties `index` and `input`
}
matches; /* gives exactly what i want, but uses a loop, and mutates the regex's `lastIndex` property */
lastIndexes; /* ideally should give { 0: true } but instead will have a value for each mutation of lastIndex */

var matches = [];
string.replace(regex, function () {
	var match = Array.prototype.slice.call(arguments, 0, -2);
	match.input = arguments[arguments.length - 1];
	match.index = arguments[arguments.length - 2];
	matches.push(match);
	// example: ['test1', 'e', 'st1', '1'] with properties `index` and `input`
});
matches; /* gives exactly what i want, but abuses `replace`, mutates the regex's `lastIndex` property,
	  * and requires manual construction of `match` */

Dynamic imports

proposal

const main = document.querySelector("main");
for (const link of document.querySelectorAll("nav > a")) {
  link.addEventListener("click", e => {
    e.preventDefault();

    import(`./section-modules/${link.dataset.entryModule}.js`)
      .then(module => {
        module.loadPageInto(main);
      })
      .catch(err => {
        main.textContent = err.message;
      });
  });
}

Bingint

proposal

// BigInt >> pow(2, 53) - 1

const withPostfix = 9007199254740991n
// 9007199254740991n
const withBigInt = BigInt(9007199254740991)
// 9007199254740991n
const withBigIntString = BigInt('9007199254740991')
// 9007199254740991n

Bingint

proposal

// BigInt >> pow(2, 53) - 1

const withPostfix = 9007199254740991n
// 9007199254740991n
const withBigInt = BigInt(9007199254740991)
// 9007199254740991n
const withBigIntString = BigInt('9007199254740991')
// 9007199254740991n