Javascript para CSharpers 3 - Conceitos

196 visualizações

Publicada em

Publicada em: Software
0 comentários
1 gostou
Estatísticas
Notas
  • Seja o primeiro a comentar

Sem downloads
Visualizações
Visualizações totais
196
No SlideShare
0
A partir de incorporações
0
Número de incorporações
2
Ações
Compartilhamentos
0
Downloads
2
Comentários
0
Gostaram
1
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide
  • 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] }
  • Javascript para CSharpers 3 - Conceitos

    1. 1. Javascript para Desenvolvedores C#
    2. 2. Sobre o curso Javascript Comparação Parte 1: Functions Parte 2: Conceitos Parte 3: POO Parte 4:
    3. 3. Javascript para CSharpers Javascript para desenvolvedores acostumados com os demais conceitos do .Net
    4. 4. +Conceitos Sumário • Lições práticas • Código estrito • Laços • Reflection • A natureza do Javascript • Arquitetando o código • Bibliotecas
    5. 5. +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
    6. 6. +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 para uso futuro y = 'algum valor' var x = { name: 'c1', name: 'c2' }; var array = [1, 2, 3, 4, 5]; array.length = 8; delete array; implements interface package private protected public static yield class enum function(p1, p2, p1) { arguments = []; }
    7. 7. +Conceitos Iteraçõ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 } //Javascript var array = ['um', 'dois', 'três']; for (var s in array) { log(s) //0, 1, 2, ?? log(array[s]) //'um', 'dois‘ }
    8. 8. +Conceitos Reflection • 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]; }
    9. 9. 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ícios Reflection
    10. 10. +Conceitos Natureza 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 construtor var msg = new MailMessage("from@mail.com","to@mail.com"); msg.Body = "Hello"; msg.Subject = "Test Message"; //Chamando método server.Send(msg);
    11. 11. +Conceitos Natureza do Javascript • No Javascript, é possível passar um parâmetro “aberto” • DuckTyping te permite construir objetos em qualquer lugar //Javascript var server = new SmtpClient(); //Construtor var msg = { to: 'to@email.com', from: 'from@email.com', body: 'Hello', subject: 'Test msg' }; //Chamando server.send({ }); server.send(msg);
    12. 12. Exercícios Validaçõ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;
    13. 13. +Conceitos Natureza 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"; };
    14. 14. +Conceitos Natureza 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; };
    15. 15. +Conceitos Natureza 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; };
    16. 16. +Conceitos Natureza 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; };
    17. 17. +Conceitos Natureza 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]; } };
    18. 18. +Conceitos Arquitetando 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.js var y = 5; //seccond.js log(y); //first.js var namespace=window.namespace|| {} (function(ns) { ns.Cliente = function() { this.nome = ""; }; })(window.namespace=window.namespace|| {}); //seccond.js var namespace=window.namespace|| {} (function(ns) { ns.Animal = function() { this.comida = “nada"; }; })(window.namespace=window.namespace|| {});
    19. 19. +Conceitos Referenciando • 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>
    20. 20. 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
    21. 21. 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
    22. 22. 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
    23. 23. • Faça um montador de objetos dinâmico
    24. 24. Javascript para CSharpers Javascript para desenvolvedores acostumados com os demais conceitos do .Net

    ×