A nova versão do JavaScript esta por vir, esta é visão das novidades e como podemos utilizar hoje.
Das novas declarações de variáveis as declarações de função, das novas estruturas de dados as novas APIs disponíveis para nos desenvolvedores.
4. let jedi = {
firstName: 'Luke',
lastName: 'Skywalker'
};
!
if (jedi) {
let darkSide = false;
}
!
console.log(darkSide);
!
Erro na execução
Variaveis podem ser
acessada somente no
escopo
let
14. function novoJedi(firstName, lastName, ...forcas) {
return {
firstName,
lastName,
forcas
};
}
!
novoJedi('Luke', 'Skywalker', 'sabre de luz', 'força');
!
Usando os “…”
Parâmetros Rest
15. new Date(...[1977, 5, 25]);
!
let arr = [42, 23, 21];
!
Math.max(…arr);
!
!
!
!
Math.max(42, 23, 21);
new Date(1977, 5, 25)
Spread operator
16. let jedi = {
firstName: 'Luke',
lastName: 'Skywalker'
};
!
let DarthVader = `${jedi.firstName} ${jedi.lastName},
I am your father.`;
!
!
Chamando o objeto “jedi”
Template Strings
17. let jedis = ['Luke Skywalker', 'Obi-wan Kenobi'];
!
jedis.forEach( jedi => {
console.log(jedi);
});
!
!
!
!
Usando a “flecha”
Arrows function
18. let jedis = ['Luke Skywalker', 'Obi-wan Kenobi'];
!
let theForce = {
jedis,
printJedis: function() {
jedis.forEach((jedi, key) => {
console.log(this.jedis[key]);
});
}
}
!
console.log(theForce.printJedis());
Mesma referência do
objeto “theForce”
Arrows function
24. !
class Jedi extends Human {
constructor(firstName, lastName) {
super(firstName, lastName);
}
usarForca() {}
usarSabreDeLuz() {
console.log('Zuuuuumm');
}
}
!
!
!
!
chamada da classe
“Human”
Extendendo a class
“Human”
Subclasses
25. !
!
let han = new Human(‘Han’, ‘Solo’);
let luke = new Jedi('Luke', 'Skywalker');
!
luke.fullName;
luke.usarForca();
luke.usarSabreDeLuz();
!
han.fullName;
!
!
!
!
!
Subclasses
27. // jedi.js
export class Jedi {}
!
// force.js
import {Jedi} from './jedi';
!
export let force = {
jedis: [new Jedi('Luke', 'Skywalker'), new Jedi('Obi-wan', 'Kenobi')]
};
!
// empire.js
import {force} from './force';
!
!
exportando um objeto.
Importando a classe “Jedi”
do modulo “jedi"
Modulos
37. let yoda = Symbol();
!
typeof yoda; // symbol
!
let jedis = {};
!
let LUKE_SKYWALKER = Symbol();
!
jedis[LUKE_SKYWALKER] = new Jedi('Luke', 'Skywalker');
!
!
!
!
!
!
Utilizando Symbol como
chaves
retorna um novo Symbol
unico para o a variável
Symbols
38. const HUMANS = Symbol();
const HUTTS = Symbol();
const JAWAS = Symbol();
const TUSKEN_RAIDERS = Symbol();
!
function getTatooineHabitant(habitant) {
switch(habitant) {
case HUMANS:
...
case HUTTS:
...
case JAWAS:
...
case TUSKEN_RAIDERS:
...
}
}
Symbol como enums
Symbols
39. let jedis = {
membros: [new Jedi('Luke', 'Skywalker'), new Jedi('Obi-Wan', 'Kenobi')],
[Symbol.iterator]() {
const self = this;
let index = 0;
return {
next() {
if (index < self.membros.length) {
return { value: self.membros[index++]};
} else {
return { done: true};
}
}
}
}
}
Criação de Iterators
Symbols
41. let empire = new Map();
!
let jedi = {};
!
empire.set(jedi, ‘Luke’);
empire.get(jedi);
!
empire.has(jedi);
empire.delete(jedi);
!
empire.clear();
!
!
!
Utilizando chaves por
referência
Map
42. for(let key of empire.keys()) {
console.log(key); // {}
}
!
for(let values of empire.values()) {
console.log(values); // Luke
}
!
for(let [key, value] of empire) {
console.log(key, value); // {} Luke
}
!
!
!
Iterando as chaves e os
valores
Iterando todas as chaves
Map
Iterando todos valores
43. let empire = new WeakMap();
!
let jedi = {};
!
empire.set(jedi, ‘Luke’);
empire.get(jedi);
!
empire.has(jedi);
empire.delete(jedi);
!
!
!
!
!
Mesmos metodos do Map
Criação de Map sem ser
coletados no garbage
WeakMap
44. let empire = new Set();
!
let jedi = {
name: 'Luke'
};
!
empire.add(jedi);
empire.has(jedi);
!
empire.delete(jedi);
empire.clear();
!
!
!
Limpando a estrutura
Adicionando uma chave
na estrutura
Set
45. for(let value of empire) {
console.log(value); // { name: 'Luke' };
}
!
empire.forEach(value => console.log(value));
!
!
!
!
!
!
!
Passando por todos os
elementos
Iteração dos elementos
Set
46. let empire = new WeakSet();
!
let jedi = {
name: 'Luke'
};
!
empire.add(jedi);
empire.has(jedi);
!
empire.delete(jedi);
!
!
!
!
Mesmos métodos do Set
Criação de Set sem ser
coletados no garbage
WeakSet