ES2018: Javascript's nye funktioner i 2018

Vores venner fra TC39 har frigivet nye opdateringer til vores elskede JavaScript-sprog.

Hvis du vil følge komiteens nye udgivelsesproces, kan du få adgang til dette link. Processen med at godkende og foretage en ændring gennemgår fem faser:

  • Trin 0: Strawman - Tillad input i specifikationen
  • Trin 1: Forslag - Gør sagen for tilføjelsen; Beskriv formen på en løsning; Identificer potentielle udfordringer
  • Trin 2: Kladde - Beskriv nøjagtigt syntaksen og semantikken ved hjælp af formelt specsprog
  • Trin 3: Kandidat - Angiv, at yderligere forbedring vil kræve feedback fra implementeringer og brugere
  • Trin 4: Færdig - Angiv, at tilføjelsen er klar til inkludering i den formelle ECMAScript-standard

Flere detaljer kan ses her. Hvis du vil lære mere om de tidligere ændringer, skal du tjekke ES6, ES7 og ES8.

Så lad os se, hvad de har tilføjet eller opdateret det sidste år:

1. Masser af Regex ændringer

Vi har fire ændringer til regex. Lad os se dem:

s( dotAll) flag til regulære udtryk

Mens du bruger regulære udtryk, forventer du, at prikken .matcher et enkelt tegn, men det er ikke altid sandt. En undtagelse er med linjeterminator-tegn:

/hello.bye/.test('hello\nbye') // prints false

Løsningen er det nye flag (er) (fra singleline):

/hello.bye/s.test('hello\nbye') // prints true

RegExp navngivne fangstgrupper

Dette er den gamle måde at få år, måned og dag fra en dato:

const REGEX = /([0-9]{4})-([0-9]{2})-([0-9]{2});const results = REGEX.exec('2018-07-12');console.log(results[1]); // prints 2018console.log(results[2]); // prints 07console.log(results[3]); // prints 12

Og hvis du arbejder med en lang regex, ved du, hvor svært det er at holde styr på grupperne, parenteserne og indekserne. Med den nye navngivne fangstgruppe er det muligt at:

const REGEX = /(?[0-9]{4})-(?[0-9]{2})-(?[0-9]{2});const results = REGEX.exec('2018-07-12');console.log(results.groups.year); // prints 2018console.log(results.groups.month); // prints 07console.log(results.groups.day); // prints 12

RegExp Se bag påstande

Der er to versioner af kig bag påstande: positive og negative.

a) Positiv (? < =…)

'$foo #foo @foo'.replace(/(?<=#)foo/g, 'XXX')// prints $foo #XXX @foo

Denne (?<=#)foo / g regex siger, at ordet skal starte med #, og det bidrager ikke til den samlede matchede streng (så det erstatter ikke # tegnet).

b) Negativ (? < !…)

'$foo #foo @foo'.replace(/(?
    

On the contrary, this assertion guarantees that it doesn't start with #.

RegExp Unicode Property Escapes

Now we can search for characters by mentioning their Unicode character property inside of \p{}

/\p{Script=Greek}/u.test('μ') // prints true

You can check out more of the properties by clicking here.

2. Rest/Spread Properties

The rest operator (...) copies the remaining property keys that were not mentioned. Let's look at an example:

const values = {a: 1, b: 2, c: 3, d: 4};const {a, ...n} = values;console.log(a); // prints 1console.log(n); // prints {b: 2, c: 3, d: 4}

3. Promise.prototype finally

This new callback will always be executed, if catch was called or not.

fetch('//website.com/files').then(data => data.json()).catch(err => console.error(err)).finally(() => console.log('processed!'))

4. Asynchronous Iteration

Finally!

Now we can use await on our loops declarations.

for await (const line of readLines(filePath)) { console.log(line);}

And these are all the changes from this year. Let’s wait to see what they will bring us next year.

If you enjoyed this article, be sure to like it give me a lot of claps — it means the world to the writer ? And follow me if you want to read more articles about Culture, Technology, and Startups.

Flávio H. de Freitas is an Entrepreneur, Engineer, Tech lover, Dreamer and Traveler. Has worked as CTO in Brazil, Silicon Valley and Europe.