aferreira44 / aprenda-es6-javascript

Aprenda ES6 (JavaScript)

Introdução

Funções de Primeira Classe

ES6 const e let

• Uma variável declarada com constnão pode ser ter um novo valor atribuído a ela.

// não permitido
const helloWorld = 'Welcome to ES6';
helloWorld = 'Bye Bye ES6';

• Uma variável declarada com let pode ter o seu valor alterado.

// permitido
let helloWorld = 'Welcome to ES6';
helloWorld = 'Bye Bye ES6';

• Porém, quando a variável estiver dentro de um array ou de um objeto criados com const, o valor dela pode ser alterado.

// permitido
const helloWorld = {
    text: 'Welcome to ES6';
};
helloWorld.text = 'Bye Bye React';

Dica: Como padrão deve-se usar sempre const para declarar as variáveis em ES¨. Usar let somente quando precisar que o valor da variável seja mutável.

• const - Referência JavaScript
• let - Referência JavaScript

Closures

Immutable Data Structures

• Por quê elas fazem sentido na programação em geral?

map

Array.prototype.map() - JavaScript map(), filter() e reduce() em JavaScript

ES6 Arrow Functions

• Sintaxe:

// function expression
function () { ... }

// arrow function expression
() => { ... }

Atenção: Ficar atento para o comportamento do objeto this em uma arrow function

• Parêntesis e argumentos:

• Quando houver um só argumento na função, o uso de parêntesis não é obrigatório

• Quando houver mais de um argumento, o uso de parêntesis é obrigatório

//permitido
item => { ... }

// permitido
(item) => { ... }

// não permitido
item, key => { ... }

// permitido
(item, key) => { ... }

• Block body e concise body:

• Block body: Utiliza o return { ... } após a declaração da arrow function

• Concise body: Não utiliza o return { ... } após a declaração da arrow function

Arrow Functions - JavaScript

Classes

ES6 Classes

Object Initializer

• Object Initializer
• Computed property names

String Methods

String.prototype.includes()

High-Order Functions

High-Order Functions

Destructuring assignment

Destructuring assignment

Default parameters

Default parameters

Template Strings

[ES6 template strings](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals

Fetch API

Native Fetch API

Alternatives:

• visionmedia/superagent
• mzabriskie/axios

Object.assign()

Object.assign()

Spread syntax

Spread syntax

Modules

ES6 export

ES6 import

Referências