Java script para adultos

Java Script para adultos

Diego Rafael Perin HonórioFront-end Developer

G4 SOLUTIONS

Ecma Script

• European Computer Manufacturers Association

• ECMA Script

• ECMA Internacional

• Base do Javascript

Aprimoramentos ES6

• Variable Declaration

• Block Scope

• Destructuring Assignment

• Enhanced parameters

• Template String

• Arrow Function

• Proxy

VARIABLE DECLARTION

var a = 0;

let b = 0;

if (true) {

console.log(a);

console.log(b);

var a = 1;

let b = 1;

console.log(a);

console.log(b);

}

console.log(a);

console.log(b);

var a = 0;

let b = 0;

if (true) {

console.log(a); // 0

console.log(b); // undefined

var a = 1;

let b = 1;

console.log(a);

console.log(b);

}

console.log(a);

console.log(b);

var a = 0;

let b = 0;

if (true) {

console.log(a); // 0

console.log(b); // undefined

var a = 1;

let b = 1;

console.log(a); // 1

console.log(b); // 1

}

console.log(a);

console.log(b);

var a = 0;

let b = 0;

if (true) {

console.log(a); // 0

console.log(b); // undefined

var a = 1;

let b = 1;

console.log(a); // 1

console.log(b); // 1

}

console.log(a); // 1

console.log(b); // 0

BLOCK SCOPE

for(var i = 0; i < 3; i++){

var x = i + i;

console.log(x);

}

console.log(x); // 4

for(var i = 0; i < 3; i++){

let x = i + i;

console.log(x);

}

console.log(x); // Error

DESTRUCTING ASSIGNMENT

obj = { first:'a',second:'b',third:'c'};

var x = obj.first;

var y = obj.second;

var z = obj.third;

Destructuring Assignment

var {x,y,z} = { first:'a',second:'b',third:'c'};

// x = 'a', y = 'b', z = 'c‘

var {x,y,z} = ['a','b','c'];

// x = 'a', y = 'b', z = 'c‘

ENHANCED PARAMETERS

Default Params

function say(name) {

name = name || 'Anonymous';

return ‘Olá, ' + name + '!';

}

console.log(say()); // Olá, Anonymous!

console.log(say(‘Diego')); // Olá, Diego!

function say(name = 'Anonymous') {

return ‘Olá, ' + name + '!';

}

console.log(say()); // Olá, Anonymous!

console.log(say('Diego')); // Olá, Diego!

Rest Parameter

function f(a, b){

console.log(args);

var args =

Array.prototype.slice.call(arguments, f.length);

console.log(args);

}

f(1,2,3,4,5);

//[1,2,3,4,5];

//[3,4,5];

function(a, b, ...args) {

console.log(args);

}

//[3,4,5];

function ordernarArgumentos() {

var ordenados = arguments.sort();

return ordenados;

}

console.log(ordernarArgumentos(5,3,7,1));

// Error arguments.sort is not a function

// Arguments não é um objeto array, embora pareça

Shorthand Assignment

var arr1 = [0, 1];

var arr2 = [2, 3];

for(var i=0; i < arr2.length; i++){

arr1.push(arr2[i]);

}

//arr1 = [0,1,2,3]

var arr1 = [0, 1, 2];

var arr2 = [3, 4, 5];

var union = [arr1, arr2]; //[0,1,2,3,4,5]

arr1.push(...arr2); //[0,1,2,3,4,5]

let x = 5;

let y = 20;

let coordinates = {

x,

y,

z: 10,

};

console.log(coordinates); // { x: 5, y: 20, z: 10 }

TEMPLATE STRING

let firstName = 'Diego';

let lastName = 'Honório';

let greeting = 'Hi, my name is ' + firstName + ' ' +

lastName + '.';

let firstName = ‘Diego';

let lastName = ‘Honório';

let greeting = `Hi, my name is ${firstName} ${lastName}.`;

ARROW FUNCTION

var namesList = ['Diego', 'Rafael', 'Perin', 'Honório'];

var names = namesList.filter(function (number) {

return name.length <= 5;

});

console.log(names); // ['Diego', 'Rafael', 'Perin']

let namesList = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

let names = namesList.filter(name => name.length <= 5);

console.log(names); // ['Diego', 'Rafael', 'Perin']

PROXY

var employee = { name: 'Joe Sixpack', salary: 50 };

var interceptor = {

set: function (receiver, property, value) {

console.log(property, 'is changed to', value);

receiver[property] = value;

}

};

employee = Proxy(employee, interceptor);

employee.salary = 300;

//salary is changed to 300

CLASS

class Pessoa {

constructor(nome, email) {

this.nome = nome;

this.comidas = [];

// verifica se o e-mail foi preenchido

if (email) {

this.email = email;

}

}

fala() {

console.log("Olá, meu nome é "+this.nome+" e meu email é

"+this.email);

}

get primeiroNome() {

return this.nome.split(" ")[0];

}

set gostaDe(comida) {

this.comidas.push(comida);

}

}

HERANÇA

class PessoaFisica extends Pessoa{

constructor(nome, email, cpf){

super(nome, email);

this.cpf = cpf;

}

dizCpf(){

console.log(this.cpf);

}

}

Perguntas?Diego.honorio91@gmail.com