javascript para csharpers 4 - outros conceitos

27
Javascript para Desenvolvedores C#

Upload: wesley-lemos

Post on 09-Jul-2015

69 views

Category:

Software


3 download

TRANSCRIPT

Page 1: Javascript para CSharpers   4 - Outros Conceitos

Javascript para Desenvolvedores C#

Page 2: Javascript para CSharpers   4 - Outros Conceitos

Sobre o cursoJavascript

Comparação

Parte 1:

Functions

Parte 2:

Conceitos

Parte 3:

POO

Parte 4:

Page 3: Javascript para CSharpers   4 - Outros Conceitos

Javascript para CSharpers

Javascript para desenvolvedores acostumados com os demais conceitos do .Net

Page 4: Javascript para CSharpers   4 - Outros Conceitos

+ConceitosSumário

• Lições práticas• Código estrito

• Laços

• Reflection

• A natureza do Javascript

• Arquitetando o código

• Bibliotecas

Page 5: Javascript para CSharpers   4 - Outros Conceitos

+Conceitos‘use strict’

• Javascript é popular por permitir um código muito aberto• Significa que suas técnicas são mais propensas à bugs

• Para isso existe o modo estrito

//Javascript(function() {

'use strict';var x = 'funciona normalmente';y = 'não procegue';

})();//qualquer coisa é permitida aqui

Page 6: Javascript para CSharpers   4 - Outros Conceitos

+Conceitos‘use strict’

• O que é desabilitado• Variáveis não declaradas

• Propriedades duplicadas

• Editar propriedades readonly

• Parâmetros duplicados

• Modificar ‘arguments’

• Deletar variáveis

• Palavras reservadas parauso futuro

y = 'algum valor'

var x = { name: 'c1', name: 'c2' };

var array = [1, 2, 3, 4, 5];array.length = 8;

delete array;

implements interfacepackage privateprotected publicstatic yieldclass enum

function(p1, p2, p1) {arguments = [];

}

Page 7: Javascript para CSharpers   4 - Outros Conceitos

+ConceitosIterações

• Foreach do C# não é como o for..in do Javascript

• Um objeto nada mais é do que um “dictionary” de propriedades.

//C#var array = new[] {"um", "dois", "três"};foreach (var s in array){

//s seria cada string}

//Javascriptvar array = ['um', 'dois', 'três'];for (var s in array) {

log(s) //0, 1, 2, ??log(array[s]) //'um', 'dois‘

}

Page 8: Javascript para CSharpers   4 - Outros Conceitos

+ConceitosReflection

• Enumera todas as propriedades do objeto• Sua forma mais simples é a iteração for..in

E se eu fizer isso com o window ou

document ?var cliente = {nome: 'Juvenal',cpf: '192.168.10.1',ativo: true,'animal de estimação': { especie: 'coelho' },cancelarAssinatura: function () { }

}

for (var prop in cliente) {"prop: " + prop;cliente[prop];typeof cliente[prop];

}

Page 9: Javascript para CSharpers   4 - Outros Conceitos
Page 10: Javascript para CSharpers   4 - Outros Conceitos

for(var prop in obj){

}

• Faça uma function que receba um objeto e logue para cada uma das propriedades dele:• Nome da propriedade

• Valor

• Tipo do valor

• Valor como String

• Valor como Numero

• Valor como Boleano

• Se uma das propriedades for objeto, as propriedades deste devem ser logadas também

ExercíciosReflection

Page 11: Javascript para CSharpers   4 - Outros Conceitos

+ConceitosNatureza do Javascript

• No .Net parâmetros são muito bem definidos• Passar objetos por parâmetro é algo trivial

//C#var server = new SmtpClient();

//Parametro em construtorvar msg = new MailMessage("[email protected]","[email protected]");

msg.Body = "Hello";msg.Subject = "Test Message";

//Chamando métodoserver.Send(msg);

Page 12: Javascript para CSharpers   4 - Outros Conceitos

+ConceitosNatureza do Javascript

• No Javascript, é possível passar um parâmetro “aberto”• DuckTyping te permite construir objetos em qualquer lugar

//Javascriptvar server = new SmtpClient();

//Construtorvar msg = {

to: '[email protected]',from: '[email protected]',body: 'Hello',subject: 'Test msg'

};

//Chamando

server.send({

});

server.send(msg);

Page 13: Javascript para CSharpers   4 - Outros Conceitos
Page 14: Javascript para CSharpers   4 - Outros Conceitos

ExercíciosValidações

• Implemente a classe SmtpClient e o método Send• Este método recebe um objeto com as seguintes propriedades: to, from, body, subject.

• Dentro do método, verifique a validade de cada uma dessas propriedades e retorne true ou false

• Caso to ou from forem vazios ou e-mails inválidos, retorne false (“string”.indexOf(‘@’)>=0)

• Se body e subject forem vazias, devem ser substituídas por “No Body” e “No Subject” respectivamente

• Passe também um callback para logar a mensagem;

• Se tudo estiver preenchido, invoque o callback passando a mensagem;

Page 15: Javascript para CSharpers   4 - Outros Conceitos

+ConceitosNatureza do Javascript

• No Javascript

Tratando propriedades inválidas

Implementando defaults

SmtpClient.send = function(msg) {if (msg.subject == null || msg.subject == undefined)

msg.subject = "No Subject";

if (msg.body == null || msg.body == undefined)msg.body = "No Body";

};

Page 16: Javascript para CSharpers   4 - Outros Conceitos

+ConceitosNatureza do Javascript

• No Javascript

Tratando propriedades inválidas

Implementando defaults

SmtpClient.send = function(msg) {if (msg.subject == null || msg.subject == undefined)

msg.subject = "No Subject";

if (msg.body == null || msg.body == undefined)msg.body = "No Body";

var defaults = {subject: 'No Subject',body: 'No Body'

};

if (!msg.subject) msg.subject = defaults.subject;if (!msg.body) msg.body = defaults.body;

};

Page 17: Javascript para CSharpers   4 - Outros Conceitos

+ConceitosNatureza do Javascript

• No Javascript

Tratando propriedades inválidas

Implementando defaults

SmtpClient.send = function(msg) {if (msg.subject == null || msg.subject == undefined)

msg.subject = "No Subject";

if (msg.body == null || msg.body == undefined)msg.body = "No Body";

var defaults = {subject: 'No Subject',body: 'No Body'

};

if (!msg.subject) msg.subject = defaults.subject;if (!msg.body) msg.body = defaults.body;

msg.subject = msg.subject ? msg.subject : defaults.subject;msg.body = msg.body ? msg.body : defaults.body;

};

Page 18: Javascript para CSharpers   4 - Outros Conceitos

+ConceitosNatureza do Javascript

• No Javascript

Tratando propriedades inválidas

Implementando defaults

SmtpClient.send = function(msg) {if (msg.subject == null || msg.subject == undefined)

msg.subject = "No Subject";

if (msg.body == null || msg.body == undefined)msg.body = "No Body";

var defaults = {subject: 'No Subject',body: 'No Body'

};

if (!msg.subject) msg.subject = defaults.subject;if (!msg.body) msg.body = defaults.body;

msg.subject = msg.subject ? msg.subject : defaults.subject;msg.body = msg.body ? msg.body : defaults.body;

msg.subject = msg.subject || defaults.subject;msg.body = msg.body || defaults.body;

};

Page 19: Javascript para CSharpers   4 - Outros Conceitos

+ConceitosNatureza do Javascript

• No Javascript

Tratando propriedades inválidas

Implementando defaults

SmtpClient.send = function(msg) {if (msg.subject == null || msg.subject == undefined)

msg.subject = "No Subject";

if (msg.body == null || msg.body == undefined)msg.body = "No Body";

var defaults = {subject: 'No Subject',body: 'No Body'

};

if (!msg.subject) msg.subject = defaults.subject;if (!msg.body) msg.body = defaults.body;

msg.subject = msg.subject ? msg.subject : defaults.subject;msg.body = msg.body ? msg.body : defaults.body;

msg.subject = msg.subject || defaults.subject;msg.body = msg.body || defaults.body;

extend(msg, defaults);};

function extend (obj, defaults){for(var prop in defaults){

obj[prop] = obj[prop] || defaults[prop];}

};

Page 20: Javascript para CSharpers   4 - Outros Conceitos

+ConceitosArquitetando código

• Em C#, o Assembly delimita o Package• Javascript é baseado em arquivos, que devem ser referenciados na ordem correta

• É possível separar logicamente isolando em namespaces, corrigindo esse possível problema

<html>...<script src="first.js"></script><script src="seccond.js"></script>

</html>

//first.jsvar y = 5;

//seccond.jslog(y);

//first.jsvar namespace=window.namespace|| {}(function(ns) {

ns.Cliente = function() {this.nome = "";

};})(window.namespace=window.namespace|| {});

//seccond.jsvar namespace=window.namespace|| {}(function(ns) {

ns.Animal = function() {this.comida = “nada";

};})(window.namespace=window.namespace|| {});

Page 21: Javascript para CSharpers   4 - Outros Conceitos

+ConceitosReferenciando

• Assim como se usa ‘using’ em C# para referenciar bibliotecas de terceiros• Basta usar uma tag script para fazer o mesmo

• E sair usando

<html><script src="toastr.js"></script>

</html>

Page 22: Javascript para CSharpers   4 - Outros Conceitos
Page 23: Javascript para CSharpers   4 - Outros Conceitos

Quiz• “use strict” é equivalente ao “unsafe” do C#

• True• False

• Em “for (var p in produtos)” o sendo que ‘produtos’ é um array, ‘p’ é:• Um produto• O index do produto

• Em “for (var p in produto)” o sendo que ‘produto’ é um objeto, ‘p’ é:• O index do produto• Uma propriedade do produto• O nome de uma propriedade

Page 24: Javascript para CSharpers   4 - Outros Conceitos

Quiz• “use strict” é equivalente ao “unsafe” do C#

• True• False

• Em “for (var p in produtos)” o sendo que ‘produtos’ é um array, ‘p’ é:• Um produto• O index do produto

• Em “for (var p in produto)” o sendo que ‘produto’ é um objeto, ‘p’ é:• O index do produto• Uma propriedade do produto• O nome de uma propriedade

Page 25: Javascript para CSharpers   4 - Outros Conceitos

Resumo

• A qualidade do código pode ser melhorada com ‘use strict’

• Passar argumentos como • objetos inteiros dentro de functions• Functions por functions• Functions invocadas e já pegando o resultado

• Para usar bibliotecas, basta referenciar e chamar

• Reflection é sempre um bom recurso para fazer algo mais legal

Page 26: Javascript para CSharpers   4 - Outros Conceitos

• Faça um montador de objetos dinâmico

Page 27: Javascript para CSharpers   4 - Outros Conceitos

Javascript para CSharpers

Javascript para desenvolvedores acostumados com os demais conceitos do .Net