Java Script essentials

• 1 Historia e conceitos
• 2 Tipos e variáveis
• 3 Operadores
• 4 Estruturas condicionais e de repetição

1 Historia e conceitos

Lançado em setembro de 1995 com nome de mooca juntamente com ba versão beta do net scape
primeiramente chamado de live script e depois java script
a alteração do nome se deu com a sum microsistem
sum foi onde a linguagem surgiu em maio de 1995 James Goslin
Época em que equee add suporte ao java por meio de aplets

Criada por Brendan Eich

ficou conhecido por tseu trabalhop na net scape 1995 e mozila 1998

ECMAScript Especificação de linguagem de programação por NetScape padronizou como ECMA

INTERNETIONAL

ECMA 262. SERVIDO COMO BASE PARA OUTRAS LINGUAGENS DE SCRIPT jcomo java
script, Jscript e action script

comitê TC39 – responsável pela evolução do javascript (manter e atualziar) mantendo padrões
ECMA TR104

Fluxo de propostas ECMA

Stage 0: strawman revisado e add como Stage0

Stage 1: proposal ( Proposta para evolução, objetivos e exemplos, pode ter alterações, se aceita vai
para Stage 2
Stage 2: draft novamente descrição formal e semantica da funcionalidade pode ter alterações
Stge 3: candidate: Proposta quase finalizada, ṕrecisando de feedbacks de usuários, reviões e editor
precisará assinar (ter pelo menos duas implementações compativeis) pode ter alterações baseadas no
feedback
Stage 4: finished passando nos testes, duas implementações passadas Editor assinado

ultima expecificação que temos ES 2018

ES2018
• Operadores rest/spread
• Iteração assincrona
• Promise.prototype.finally()

ES.Next

possui futuras implementações que pode ser testada no projeto Babel

Conceitos
✔ Linguagem interpretada (codigo executado de cima para baixo e resutado imediatamente
retornado.

Linguagens compiladas são transformadas em linguagens diferentes para serem por exemplo C
e C++ que são compiladas em linguagem assembly para depois serem executadas.

✔ Linguagem de tipagem fraca e dinâmica

Exemplo : JS
var meuNumero = 20;
var meuTexto = ‘Exemplo’
console.log(meuNumero + meuTexto)
20Exemplo
Em Piton
var meu_numero = 30;
var meu_texto = ‘Exemplo’
print( meu_numero + meu_texto)
Ocorre erro por ser linguagem de tipagem forte (Ty|peError)

Tipagem dinâmica e estática

Tipagem dinâmica não precisa explicitar a variável no momento de sua criação, ele saberá o tipo a
partir da atribuição do valor (inferência de tipo)

Tipagem explicita como java não permite ocasionando em erro

Typescript ( SuperSet de JS)

Além de conseguir add tipos em tempo de desenvolvimento, add funcionalidade que o js não tem
por padrão como por exemplo interfaces

Flow semelhante ao Typescript mas não é SuperSet, versão mais simplificada do Typescript

✔ Funções de primeira classe e ordem maior

Significa função pode ser atribuída a uma variável, estrutura de dados ou argumentos e até retornar
outras funções

✔ Closure

(Escopo lexo)
Capacidade de uma função lembrar do ambiente onde ela foi criada.

3 tipos
Antes do ES6 tínhamos Escopo global e de função.
com inclusão de let e const temos agora o escopo de bloco também

const initFn1 = init();

const initFn2 = init();

const initFn3 = init();

initFn3();

evitar função retornando função sem os devidos parâmetros

o ideal é que a função seja pura ( função que recebe um parâmetro e retorna alguma coisa)

Outra forma de chamar função dentro de função

outra forma de chamar seria: init()()();

✔ Curryning

Comum em linguagens funcionais, js não é funcional por padrão mas é possível adaptar

Técnica de função de N parâmetros (2,3,4) em apenas uma função que recebe 1 parâmetro e para
cada parâmetro uma nova função.

Ex:
função normal:

function soma (a,b) {

return a+ b;
}
soma(2, 2);
soma(2, 3);
soma(2, 4);
soma(2, 5);

reaproveitar o primeiro parametro com Curryning ( em cada parametro uma nova função:

function soma(a) {
return function (b) {
return a+ b;
}
}

const soma2 = soma(2); ( parâmetro memorizado em uma constante)

soma2(2);
soma2(3);
soma2(4);
soma2(5);
 ✔ Hoisting
(levantar ou suspender)

Não usar variável antes dela ser definida

declaração de variaveis e funções são elevadas em seu escopo

2 tipos: tipos variaveis e funções

De variável: Eleva somente a criação da variável e não a sua atribuição
De função: Eleva ao topo a função como um todo
exemplo de Hoisting de variável:

function fn() {
console.log(text)
var text = ‘exemplo’;
console.log(text);
}
fn()
neste exemplo o “var text; será içado, porém não definido e ficará como exibido abaixo:
function fn() {
var text;
console.log(text)
text = ‘exemplo’;
console.log(text);
}
no primeiro console.log retornará undefined
no segundo retornará “Exemplo”

exemplo de Hoisting com função

function fn() {
log(‘Hoisting de função’);
funcgtion log(value) {
console.log(value);
}
}
fn()
Neste exemplo a função será içada como um todo e ficará como exibido abaixo:
function fn() {
funcgtion log(value) {
console.log(value);
}
log(‘Hoisting de função’);

“Boa pratica declarar função antes de usar”

 ✔ Imutabilidade
conceito de linguagens funcionais porém ,também temos no js

os dados que são criados nunca mudam

se precisar alterar uma variável cria-se uma nova. Ex. Ao invés de mudar um array para add ou
deletar, criamos um novo, pegando todo o conteudo concatenando um novo ( o mesmo com objeto)
será copiado e então add a alteração.

Ex. Objetos
const user = {
name: ‘Jorge’,
lastName: ‘Donizeti Alves’
};

function getUserWithFullName(user) {
return {
...user,
fullName: `${user.name} ${user.lastName}`
}
}
const userWith\FullNasme = getUserWithFullName(user);
console.log(userWithFullName);

Lista inicial não alterada

Ex.2 Arrays
const students = [
{
name: ‘Grace’,
grade: 7
},
{
name: ‘Jennifer’,
grade: 4
},
{
name: ‘Paul’,
grade: 10
},
]
function getAprovedStudents(studentsList) {
return studentsList.filter(student => student.grade >=7);
}
console.log(‘Alunos aprovados:’);
console.log( getAprovedStudents(students));
console.log( ‘\nLista de alunos:’)
console.log(students);

Lista inicial não alterada

 ✔ Tipos e Variáveis:

var - o pioneiro no js
posteriormente introduzido:
let
const
com eles introduziram o escopo de bloco]

if, whille, etc…. Toda vez que se abre chaves se tem um bloco

var nameVar = ‘Jorge’;

let nameLet = ‘Jorge’;
const nameConst = ‘Jorge’;

console.log(`nameVar: ${nameVar}`);
console.log(`nameLet: ${nameLet}`);
console.log(`nameConst: ${nameConst}`);

// escopo global
{
// Escopo de bloco
}

function test() {
// escopo de função
}

var não respeita escopo

let respeita escopo

const não permite mudança de valor, porém sendo objeto permitirá que altera suas propriedades.

O mesmo para array

Ser for um objeto, podemos trocar suas propriedades, porém não podemos fazer o objeto “apontar”
para outro lugar

podemos adicionar novos itens

podemos remover algum item
Podemos alterar diretamente

push add
shift deleta
[1] altera
 ✔ TIPOS E VARIÁVEIS

➢ string
➢ number
➢ boolean true false
➢ null nulo
➢ undefined não de finido
➢ symbol criar valores unicos
6 tipos primitivos
➢ Object
➢ Function também é um objeto mas permite que ele seja chamado
➢ Array também é objeto mas tem relação com filhos e índices

funções nativas com string:

// Retorna tamanho de uma string
const textSize = ‘Texto’.length
quantidade de letras

// Retorna um arrayu quebrando a string por um delimitador

const splittedText = ‘Texto’.split(‘x’);
Array com as posições separadas pelo delimitador

// Busca por um valor e subistitui por outro

const replacedText = ‘Texto’.replace(‘Text, ‘txeT’);
Substituição de valor

// Retorna a fatia de um valor

const lastChar = ‘Texto’.slice(-1);
última letra de uma string

const allWithouLastChar = ‘Texto’.replace(0, -1);

Valor da string da primeira letra men os a última
const secondToEnd = ‘Texto’.slice(1);
Valor da string da segunda letra até a última

// Retorna N caracteres a partir de uma posição

const twoCharsBeforeFirstPos = ‘Texto’.substr(0,2).
Parecido com o slice porém os atributyos são posição “0” e quantidade de caracteres”2”.

Funções nativas com numbers:

const myNumber = 12.4032;

//|Transforma numero para string

const numberAsString = myNumber.toString();
numero transformado em string typeof | numberAsString);

//Retorna numero com um número de casas decimais

const fixedTwoDecimals = mynumber.toFixed(2;
numero com duas casas decimais 12.4032 retornará apenas 12.40
//Transforma uma string em float pode vir casas decimais
parseFloat(‘13.22’);
//Transforma uma string em int retira as casas decimais
parseInt(‘13.20’);

nulll
const nullVariable = null;

console.log(typeof nullVariable); no console.log sempre será object(pegadinha)

number ------

object:

permite atributos e propriedades chave e valor

let user = {
name: ‘Jorge’
};

//Alterando a propriedade de um objeto

user.name = ‘Outro nome’;
user[`name`] = ‘Outro nome 2’;

const prop = ‘name’;

user[prop] = ‘Outro nome 3’;

function getProp(prop) {
return user[prop]
}

// Criando uma propriedade

user.lastname = ‘Donizeti Alves’;

// Deletando uma propriedade

delete user.name;

funções de objetos

//Recuperar as chaves do objeto

console.log(‘Propriedades do objeto user:’, Object.keys(user));
//Recuperar os valores das chaves do objeto
console.log(‘\nValores das propriedades do objeto user:’, Object.values(user));

// Retornando um array de arrays contendo [ nome_prop, valor_prop ]

console.log(‘\nLista de propriedades e valores:’, Object.entries(user));
// Mergear propriedades de objetos
Objectassign(user, {fullName: ‘Jorge Donizeti Alves’}); (concatenando o user + fullName)

Console.log(‘\nAdicionando a propriedade fullName no objeto user’, user);

Console.log(‘\nRetorna um novo objeto mergeando dois ou mais objetos’, Object.assign({}, user,

{age:26})); Criando novo array para mergear da forma que quiser (imutabilidade

// Previne todas as alterações em um objeto

const newObj = { foo: ‘bar’ };
Object.freeze(newObj);

newObj.foo = ‘changes’;
delete newObj.foo;
newObj.bar = ‘foo’;

console.log(‘\nVariável newObj após as alterações:’ , newObj);

//Permite apenas a alteração de propriedades existentes em objeto

const person = { name: ‘Jorge’};
Object.seal(person);

person.name = ‘Jorge Donizeti’;

delete person.name;
person.age = 26;

console.log(\nVariável person após as alterações:’, person);

symbol

const symbol1 = Symbol();

Const symbol2 = Simbol();

valores únicos
//Symbols são únicos
console.log(‘symbol é igual a symbol2:’, symbol1 === symbol2);

// Prevenir conflito entre nomes de propriedades

const nameSymbol1 = Symbol(‘name’);
const nameSymbol2 = Symbol(‘name’);

const user = {
[namSymbol1]: ‘Jorge’,
[namSymbol2]: ‘Outro nome’,
lastName: ‘Donizeti Alves’
}
console.log((user);
//Symbols criam propriedades que não são enumberables
Não são enumeráveis e não é possível acessar com estruturas padrões de repetição
for (const key in user) {
if (user.hasOwnPropriety(key)) {
console.log(`\nValor da chave ${key}: ${user[key]}`);
}
} (não exibirá)

console.log(‘Propriedades do objeto user:’, Object.keys(user));

console.log(‘Valores das propriedades do objeto user:’, Object.values(user));

//Exibir symbols de um objeto

console.log(‘Valores das propriedades do objeto user:’, Object.getOwnPropertySymbols(user));

//Acessando todas as propriedades do objeto

console.log(‘Todas as propriedades do objeto user:’, Reflect.ownKeys(user));

// Criar um enum

const directionsd = {
UP : Symbol( ‘UP’ ),
DOWN : Symbol( ‘DOWN’ ),
LEFT : Symbol( ‘LEFT’ ),
RIGHT : Symbol( ‘RIGHT’ ),

FUNCTIONS E OPERADORES

function fn( ) {
return ‘Code here’;
}

const arrowFN = ( ) => ‘Code here’;

consr arrowFn2 = ( ) => {
// Mais de uma expressão
return ‘Code here’;
}

// Funções também são objetos

fn.prop = ‘Posso criar propriedades’;

console.log( fn( ));

console.log( fn.prop);

// Receber parâmetros
const logValue = value => console.log(value);
const logFnResult = fnParam => console.log(fnParam());
logFnResult(fn);

// Receber e retornar funções

const controlFnExec = > fnPAram => allowed => {

if (allowed) {
fnParam( );
}
}

const handleFnExection = controlFnExec(fn);

handleFnExection(true; // Executará a função fn

handleFnExection( ); // Não executará a função fn

// controlFnExerc como função normal

function controlFnExec(fnParam) {
return function(allowed) {
if (allowed) {
fnParam( );
}
}
}

(() => {
this.name = ‘arrow-function’;
c this.name;
const getNameArrowFn = ( ) => this.name;
}

function getName( ) {
return this.name;
}

const user = {
name: ‘Nome no objeto de execução’,
getNameArrowFn,
getName
}

console.log(user.getNameArrowFn( ));
console.log(user.getName());
})();
ARRAYS
TAMBÉM É UM OBJETO MAS PERMITE VÁRIAS OUTRAS ESTRUTURAS DE DADOS
DENTRO

const users = [‘Jorge’,’Pedro’,’Jennifer’];

const gender = {
MAN: Symbol(‘M’),
WOMAN: sYMBOL(‘W’)

const person = [
{
name: ‘Jorge’,
age: 26,
gender: gender.MAN
},
{
name: ‘Pedro’,
age: 43,
gender: gender.MAN
},
{
name: ‘Jennifer’,
age: 18,
gender: gender.WOMAN
},
];

// Retornar a quantidade de itens de um array

console.log(‘Items:’, person.length);

// Verificar se é array

console.log(‘A variável person é um array:’, Array.isArray(person));

// Iterar os itens do array

person.forEach(person, index, arra=> {
console.log(`Nome: ${person.name} index: ${index} ${arr}`);
});

IMUTABILIDADE
FILTER , MAP E REDUCE ( NÃO ALTERAM A REFERENCIA DO OBJETO(ARRAY),
RETORNAM UM NOVO)

// Filtrar array
const mens = person.filter(person => person.gender === gender.MAN);
console.log(‘\nNova listra apenas com homens:’, mens);
// Retornar um novo array

const person|WithCourse = persons.map(person => {

person.course = ‘Introdução ao Javascript’;
return person;
}
console.log(‘\Pessoas com a adição do course:’, personWithCourse);

// Transforma um array em outro tipo

const totalAge = person.reduce((age, person) => {

// primeiro parametro é a função , segundo é o valor inicia

age += person.age;
return age;
}, 0);

console.log(‘\nSoma de idade das pessoas’, totalAge);

// Juntando operações

const totalEvenAges = person

.filter(person => person.age % 2 === 0)
.reduce((age, person) => {
age += person.age;
return age;
}, 0);

console.log(‘\nSoma de idades das pessoas que possuem idade par’, total EvenAges);
 ✔ Operadores

1. Aritmieticos
2. Atribuição
3. Comparação
4. Condicional
5. Lógicos
6. Spreed

Operadores binarios e unarios

// Operador binário
operando1 operador operando2

1+2

//Operador unário
operando 1 operador
operador operando1
x++
++x

Aritmeticos

// Módulo (%)
// Operador binário. Retorna o inteiro restante da divisão dos dois operandos.
12 % 15 // retorna 2.

// Incremento (++ e Decremento –)

++x
x++
--x
x--

const a= ++2; // 3
const b = 2++; // 2

// Subtração (-) e Adição (+)

-3
+”3” // retorna 3
+true // retorna 1
+false // retorna 0
-true // retorna -1

// Operando de exponenciação (*
2 ** 3 // retorna 8
10 ** -1 // retorna 0.1

// Operador de agrupamento ()

2* ( 3+2)

Atribuição

x=y

// Atribuição de adição

x= x+y //ou

x += y

// Atribuição de subtração
x = x - y //ou

x -= y

// Atribuição de multiplicação

x= x*y //ou

x *= y

// Atribuição de divisão
x = x / y //ou

x /= y

// Atribuição de resto

x= x%y //ou

x %= y
Comparação

(gual (==)
// retorna true caso os operandos sejam iguais. 3 == var1

“3” == var1
3 == ‘3’

Não igual (!=)

/ retorna true caso os operandos não sejam iguais. Var1 !=4
var2 != “3”

Estritamente igual (===)

// Retorna true caso os operandos sejam iguais e do mesmo tipo
3 === var1

Estritamente não igual (!==)

// Retorna true caso os operandos não sejam iguais e /ou do mesmo tipo
var1 !== “3”
3 !== ‘3’
Maior que (>)
// Retorna true caso os operandos da esquerda seja maior que o da direita
var2 > var1
“12” > 2

Maior que ou igual ( >=)

// Retorna true caso os operandos da esquerda seja maior ou igual ao da direita
var2 >= var1
“12” >= 2

Menor que (<)

// Retorna true caso os operandos da esquerda seja menor que o da direita
var2 < var1
“12” < 2

Menor que ou igual (<= )

// Retorna true caso os operandos da esquerda seja menor ou igual ao da direita
var2 <= var1
“12” <= 2

Operador Condicional
(Operador Ternário)

condicao ? Valor1 : valor 2

true ? ‘foo’ : ‘bar’ // Retorna ‘foo’

false ? ‘foo’ : ‘bar’ // Retorna ‘bar’
Operadores Lógicos

// E (AND )lógico (&&)

exp1 && exp2

retorna a primeira expressão

var a1 = true && true; // t && t retorna true
var a2 = true && false; // t && f retorna false
var a3 = false && true; // f && t retorna false
var a4 = false && (3 ==4); // f && f retorna false
var a5 = ”Gato” && “Cão”; // t && t retorna Cão
var a6 = false && “Gato”; // f && t retorna false
var a7 = “Gato” && false; // t && f retorna false

// OU (OR) lógico ( || )
exp1 || exp2
se a primeira for falsa, retornará a segunda

var a1 = true || true; // t && t retorna true

var a2 = true || false;
var a3 = false || true;
var a4 = false || (3 ==4);
var a5 = ”Gato” || “Cão”;
var a6 = false || “Gato”;
var a7 = “Gato” || false;
// t && f retorna true
// f && t retorna true
// f && f retorna false
// t && t retorna Gato
// f && t retorna Gato
// t && f retorna Gato

conteudo = conteudo || ‘falback’;

// Not lógico (!)

var n1 = !true // !t retorna false

var n2 = !false // !f retorna true
var n3 = !”Gato”; // !t retorna false

// True
“ “
1
[‘teste’]

// False
“”
0
[]

conversão para boleano !!

SPREED OPERATOR

// Spreed…

var partes = [‘ombro’, ‘joelho’];

var música = [‘cabeça’, ...partes, ‘e’1, ‘pés’];

var música = [‘cabeça’, ‘ombro’, ‘joelhos’, ‘e’, ‘pés’];

function fn(x, y, z) { }
var args = [0, 1, 2];
fn(...args);

outros operadores unários:

//Deletar algo
delete something;

// Determinar tipo
typeof something;

outros operadores binários:

// in

something in somethingItems

// Arrays
var arvores = new Array(“pau-brasil”, “loreiro”, “cedro”, “carvalho” , “sicômoro”);
0 in arvores; // retorna true pois na array arvores existe o índice 0
3 in arvores; // retorna true
6 in arvores; // retorna false
“cedro” in arvores; // retorna false ( você deve especificar o número do indice)
“length” in arvores; // retorna true (length é uma propriedade de Array)

// Objetos predefinidos
“PI” in Math; // retorna true
var minhaString = new String(“coral”);
“length” in minhaString; // retorna true

// Objetos personalizados
var meucarro = {marca: “Honda”, modelo: “Accord”, ano: 1998);
“marca” in meucarro; // retorna true
“modelo” in meu carro // retorna true
// instanceof
objeto instanceof tipoObjeto

var dia = new Date(2018, 12, 17);

if (dia instanceof Date) {

// code here

} retorna verdadeiro

ESTRUTURAS CONDICIONAIS E REPETIÇÃO

Estruturas condicionais

if, eles e eles if

if (condition) {
// code
}

const array = [0, 1, 2, 3, 4, 5];

array.forEach( item => {

if ( item % 2 === 0) {
console.log(`O número ${item} é par.`);
} else {
console.log(`O número ${item} é ímpar.`);
}
});

eles if

const array = [ 2, 3, 4, 5, 6, 7, 8, 10, 15];

console.log(‘\nelse if’);
array.forEach( item => {
if ( item % 2 === 0) {
console.log(`O número ${item} é divisível por 2.`);
} eles if ( item % 3 === 0) {
console.log(`O número ${item} é divisivel por 3.`);
} eles if ( item % 5 === 0) {
console.log(`O número ${item} é divisivel por 5.`);
}
});
console.log(‘\nif’);

array.forEach( item => {

if ( item % 2 === 0) {
console.log(`O número ${item} é divisível por 2.`);
}
if ( item % 3 === 0) {
console.log(`O número ${item} é divisivel por 3.`);
}
if ( item % 5 === 0) {
console.log(`O número ${item} é divisivel por 5.`);
}
});

switth (expressã0) {
case valor1:
[breack;]
case valorN:
[breack;]
default:
[break;]
}

const fruit = ‘banana’;

switth (fruit) {
case ‘banana’:
console.log(‘R$ 3,00 /kg’);
breack;
case ‘mamão’:
case ‘pera’:
console.log(‘R$ 2,00 /kg’);
breack ( se retirar o brack apresentará o valor + o default)
default:
console.log(‘Produto não existe no estoque’);
breack;
}
Estruturas de repetição

for
while
do...while
for...in
operadores que manipulam a repetição:
continue : dependendo da contição ele pula e continua
brack: mata o laço

laço for
const array = [‘on’1, ‘two’, ‘theee’]
for (let index = 0; index < array.length; index++) {
const element = array[index];
console.log(‘Element ${index}: ${element}.’);

laço while
enquanto verdadeiro execulte
(começa a ser executado se a primeira condição for verdade)
var n = 0
var x = 0;
while (n <3) {
n++;
x += n; // 1,3,6
}

console.log(x);

laço do while
(execulta pelo menos uma vez)

let i =0;

do {
i += 1;
console.log(i)
} while (i < 5 );
laço for in e laço for of

let arr = [3, 5, 7];

arr.foo = “hello”;

for ( let i in arr) {

console.log(i) // logs “0”, “1”, “2”, “foo”
}

for ( let i of arr) {

console.log(i) // logs “3”, “5”, “7”
}

Orientação a objetos
‘use strict’;

function Animal(qtdePara0 {
this.qtdePatas = qtdePatas;
}

function Cachorro(morde) {
Animal.call(this, 4); (call) permite passar um contxto pra função ser executada)
this.morde = morde; (contexto de objeto novo)
}

const pug = new Cachorro(false);

console.log(pug)
// Cachorro {qtdePatas: 4, morde: false}

Classes:

ES6
simplificação da herança de protótipos
palavra-chave class

Uma nova sintaxe mas que faz o “prototype por baixo dos panos)

Modificadores de acesso

O JS não tem suporte nos browsers

privado / público.
O # diz que a variavel é privada na versão node.js
pode ser referenciado direto na classe mas sempre com cerquilha.

Encapsulamento

Ocultar detalhes do funcionamento interno

Static

Acessar métodos/atributos sem instanciar

Designer patterns

Objetivos da aula

✔ Definição
✔ Tipos
✔ Patterns mais utilizados

Definição:
Padrões de projetos são soluções generalistas para problemas recorrentes durante o
desenvolvimento de um software. Não se trata de um framework ou código pronto, mas de uma
definiçao de alto nível de como um problema comum pode ser solucionado.

Surgido no livro
A Pattern Language em 1978 por
Christopher Alexander, Srara Ishikawa e Murray Silverstein
253 tipos de problemas/ desafios de projetos.

Formato de um pattern:

✔ Nome
✔ Exemplo
✔ Contexto
✔ Problema
✔ Solução

Using Pattern Languages for Object-Oriented Programs

Alestra em 1987
Kent Beck ( Extreme program e TDD) e Ward Cunnigham
5 padrões de projetos
Libro Designer Patterns: Elements of Reusable Object-Oriented Software

✔ 1994
✔ Gang of four (GoF)
✔ Erich Gamma, Richard Helm, Ralph Johnson e John Vlissides

Classificação:
✔ Tipos
✔ Criação
✔ Estrutural
✔ Comportamental

Padrões de criação

Os padrões de criação são aqueles que abstraem e/ou adiam o processo criação dos objetos. Eles
ajudam a tornar um sistema independente de como seus objetos são criados, compostos e
representados.

Padrões de criação

✔ Abstract Factory
✔ Builder
✔ Factory Method
✔ Prototype
✔ Singleton

Padrões estruturais

Os padrões estruturais se preocupam com a forma como os objetos são compostos para formar
estruturas maiores.

Padrões estruturais

✔ Adapter
✔ Bridge
✔ Composite
✔ Decorator
✔ Facade
✔ Business Delegate
✔ Flymweight
✔ Proxy

Padrões comportamentais

Os padrões de comportamento se concentram nos algoritmos e atribuições de responsabilidades

entre os objetos. Eles não descrevem apenas padrões de objetos ou classes, mas também os
padrõesde comunicação entre os objetos

Padrões comportamentais

✔ Chain of Resposibility
 ✔ Command
✔ Command
✔ Interpreter
✔ Iterator
✔ Mediator
✔ Observer
✔ State
✔ Strategy
✔ Template Method
✔ Visitor

Patterns mais utilizados no javascript

✔ Factory
✔ Singleton
✔ Decorator
✔ Observer
✔ Module

Factory

Todas as funções que retornam um objeto, sem a necessidade de chamá-las com o new, são
consideradas funções factory

Singleton

O objetivo desse pattern é criar uma única intância de uma função construtora e retorná-la toda vez
em que for necessário utilizá-la. Exemplo muit utilizado é o Jquery.

Decorator

Uma função decorator recebe uma outra função como parametro e estende o seu comportamento
sem modificá-la explicitamente.

Observer

É um pattern muito popular no javascript. A instancia (subscriber) mantém uma coleção de objetos
(observers) e notifica todos eles quando ocorrem mudanças no estado.

Module

É um pattern que possibilita organizarmos melhot o nosso código, sem a necesssidade de expor
váriáveis globais.