Informática I. Aula 16. Aula 16-30/10/2006 1

Transcrição

1 Informática I Aula 16 Aula 16-30/10/2006 1

2 Ementa Histórico dos Computadores Noções de Hardware e Software Microprocessadores Sistemas Numéricos e Representação de Dados Estrutura e Organização da Informação Linguagens de Programação Sistemas Operacionais Redes de Computadores e Internet Engenharia de Software Softwares Aplicativos Aspectos Legais do Software Aula 16-30/10/2006 2

3 Tipos de Linguagens de Programação Linguagens de baixo nível: Assembler. Linguagens não estruturadas: Cobol e Basic. Linguagens procedurais: C, Pascal, Fortran, Ada, Modula 2 e Modula 3. Linguagens orientadas a objeto: Simula, Smalltalk, C++ e Java. Linguagens funcionais: Prolog, LISP e Scheme. Linguagens específicas: SQL, HTML, Perl, Javascript. Linguagens visuais: Simulink, Visual Basic e Delphi. Aula 16-30/10/2006 3

4 Linguagens Procedurais vs. Linguagens Funcionais Nas linguagens procedurais, a programação é baseada na execução sequencial de comandos. Variáveis são definidas. Comandos alteram o valor das variáveis. Repetição é realizada através de comandos explícitos (for, while). Nas linguagens funcionais, a programação é feita somente através da definição de funções. Funções podem receber outras funções como parâmetro. A repetição é feita através da recursão: uma função chama a si mesma. Aula 16-30/10/2006 4

5 Exemplo: Números de Fibonacci Os números de Fibonacci são uma sequência definida recursivamente por: 0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144, 233, 377, 610, 987, 1597, 2584, 4181, 6765, 10946, Aula 16-30/10/2006 5

6 Números de Fibonacci em Linguagem Procedural (Pascal) procedure Fibonacci(n:integer); var F : array[1...n] of integer; var i : integer; begin F[1] = 0; F[2] = 1; i := 3; while (i<=n) do begin F[i] := F[i-1] + F[i-2]; i := i+1; end; end. Aula 16-30/10/2006 6

7 Números de Fibonacci em Linguagem Funcional (LISP) (defun fib(n) (if (<= n 2) 1 (+ (fib (- n 1))(fib (-n 2))) ) ) Aula 16-30/10/2006 7

8 Exercício Programar a função fatorial em LISP: (defun fatorial(n) (if (<= n 1) 1 (* n (fatorial (-n 1))) ) Aula 16-30/10/2006 8

9 Linguagem Lisp Foi inventada em 1958 por John McCarthy no MIT. Segunda linguagem de programação de alto nível, veio depois de Fortran. O nome Lisp veio de List Processing = Processamento de Listas. Listas são objetos básicos em Lisp. Trocadilho Lisp = Lots of Irritant Stupid Parenthesis. A linguagem foi muito utilizada em pesquisas na área de Inteligência Artificial. Nos anos 80 e 90, vários dialetos de LISP foram unificados no dialeto Common Lisp. Outro dialeto que sobrevive é o Scheme. Aula 16-30/10/2006 9

10 Listas em Lisp Funções são chamadas através de listas. O primeiro elemento é o nome da função. Os outros elementos são parâmetros. (+ 3 4) 7 (* 5 (+ 2 5)) 35 (fatorial 4) 24 A função quote retorna os seus argumentos. (quote (1 2 3)) (1 2 3) (1 2 3) (1 2 3) A função first retorna o primeiro elemento de uma lista. (first (1 2 3)) 1 A função rest retorna a lista sem o primeiro elemento. (rest (1 2 3)) (2 3) Aula 16-30/10/

11 Prolog Foi criada em 1973 na França. O nome Prolog vem de programmation en logique. É baseada na lógica de primeira de ordem. O programa é uma declaração de fatos lógicos formando uma base de conhecimento à qual são feitas perguntas ( queries ). Aula 16-30/10/

12 Exemplo de programa Prolog irmão(x,y) :- mae(z,x), mae(z,y). irmão(x,y) :- pai(z,y), pai(z,y). mãe(maria, felipe). pai(joão, antonio). pai(joão, guilherme). pai(miguel, joão).? irmão(antonio,guilherme)? irmão(joão,guilherme) Aula 16-30/10/

13 Números de Fibonacci em Prolog Fib(0,0). Fib(0,1). Fib(n,F1+F2):-Fib(n-1,F1), Fib(n-2,F2).? Fib(10, F). F = 55. Aula 16-30/10/

14 Linguagens Específicas São linguagens que tem uma finalidade específica, ao contrário das linguagens de propósito geral. Linguagens para banco de dados: Clipper e SQL. Linguagens de simulação: Matlab, Mathematica, R. Linguagens de scripts: Perl, TCL/TK, awk. Linguagens de formatação de textos: HTML, PostScript, PDF. Aula 16-30/10/

15 HTML HTML = HyperText Markup Language É uma linguagem de marcação usada para produzir páginas (estáticas) da web. Utiliza marcações conhecidas como tags (etiquetas) que determinam a formatação do texto, imagem e outros elementos. Foi definida por Tim Berners-Lee no início dos anos 90. Aula 16-30/10/

16 Tipos de Tag em HTML Marcação de apresentação: Define a aparência do texto <b>negrito</b> mostra a palavra negrito em negrito. <i>itálico</i> mostra a palavra itálico em itálico. Marcação de estrutura Define o propósito do texto <h1>título</h1> indica para o browser que a palavra título deve ser mostrada como um título de nível 1. Marcação de hiper-texto Define links para outras páginas <a href = Página</a> Aula 16-30/10/

17 Tags Básicas <html>: Define o início de um documento HTML. <head>: Define o cabeçalho de um documento HTML. <body>: Define o conteúdo principal do documento. Dentro do cabeçalho (tag "<head>") podemos encontrar: <title>: Define o título da página, que é exibido na barra de título dos browsers. <style>: Define formatação em CSS. <script>: Define programação de certas funções em página com scripts <meta>: Define propriedades da página, como codificação de caracteres, autor, etc. Dentro do corpo (tag "<body>") podemos encontrar outras várias tags, como por exemplo: <h1>, <h2>,... <h6>: cabeçalhos e títulos no documento em diversos tamanhos. <p>: novo parágrafo. <br>: quebra de linha. <table>:cria uma tabela (linhas são criadas com <TR> e novas células com <TD>). <div>: determina uma divisão na página que pode possuir variadas formatações. <font>: forma um texto (fonte, cor e tamanho) de um trecho do texto. <b>, <i>, <u> e <s>: negrito, itálico, sublinhado e riscado, respectivamente. <img>: imagem. <a>: hiperlink para uma página, ou para um endereço de . Aula 16-30/10/

18 Página simples <html> <head><title>minha página</title></head> <body> <h1>primeiro Título</h1> <b>negrito</b> <h2>segundo Título</h2> <i>itálico</i> </body> </html> Aula 16-30/10/

19 Tags Básicas de HTML <html>: Define o início de um documento HTML. <head>: Define o cabeçalho de um documento HTML. <body>: Define o conteúdo principal do documento. Dentro do cabeçalho (tag "<head>") podemos encontrar: <title>: Define o título da página, que é exibido na barra de título dos browsers. <style>: Define formatação em CSS. <script>: Define programação de certas funções em página com scripts <meta>: Define propriedades da página, como codificação de caracteres, autor, etc. Dentro do corpo (tag "<body>") podemos encontrar outras várias tags, como por exemplo: <h1>, <h2>,... <h6>: cabeçalhos e títulos no documento em diversos tamanhos. <p>: novo parágrafo. <br>: quebra de linha. <table>:cria uma tabela (linhas são criadas com <TR> e novas células com <TD>). <div>: determina uma divisão na página que pode possuir variadas formatações. <font>: forma um texto (fonte, cor e tamanho) de um trecho do texto. <b>, <i>, <u> e <s>: negrito, itálico, sublinhado e riscado, respectivamente. <img>: imagem. <a>: hiperlink para uma página, ou para um endereço de . Aula 16-30/10/

20 JavaScript Foi criada pela Netscape em Apesar do nome, não tem relação direta com a linguagem Java. Sintaxe lembra a de C++ e de Java. Pode ser usada tanto como uma linguagem procedural ou como uma linguagem orientada a objeto. É usada principalmente em websites, mas também pode ser usada em outras aplicações. É usada em milhões de páginas e servidores web. Aula 16-30/10/

21 JavaScript em páginas HTML O principal uso de JavaScript é em funções que ficam embutidas em páginas HTML. Essas funções servem para, por exemplo: Abrir uma janela com controle sobre o tamanho, a fonte e a posição da janela. Checar os valores de um formulário pra ter certeza que eles estão corretos antes de enviar para o servidor. Mudar imagens à medida que o mouse passa em cima delas. Aula 16-30/10/

22 Posição do JavaScript no código HTML Principalmente no cabeçalho do arquivo HTML file, dentro da tag script e de comentários: <script language="javascript"> <!-- document.write("hello World!"); //--> </script> Também pode ficar no corpo, geralmente dentro de tags <a > ou <img >. Normalmente são chamadas de função. Aula 16-30/10/

23 JavaScript Externo É possível escrever um programa JavaScript e usar em várias páginas HTML usando src na tag script. <script language="javascript" src= functions.js"> </script> Aula 16-30/10/

24 Elementos do JavaScript Elementos típicos de programação: variáveis, operadores, expressões, comandos, definições de funções Elementos específicos do ambiente web Funções (e.g., Date()) Document Object Model = nomes de objetos, atributos e métodos relacionados à pagina (ex.: document.write) eventos (ex.: onsubmit, onmouseover) Aula 16-30/10/

25 Variáveis Variáveis guardam um valor, que pode ser uma cadeia de caracteres ou um número. Exemplos de valor: Universidade Federal Fluminense" passaro.gif" Aula 16-30/10/

26 Comandos Programas fluem de comando em comando. Comandos simples atribuição (dar um valor a uma variável) chamada de funções Comandos compostos Repetições (for, while) Condições (If, switch) Pontuações: colchetes e ponto-evírgulas. Aula 16-30/10/

27 Exemplo 1 <html> <head> <title> JavaScript 1 </title> <script language="javascript"> document.write("<h1>data de hoje:</h1>"); document.write(date()); </script> </head> <body> <BR>Resto da página </body> </html> Aula 16-30/10/

28 Exemplo 2 <html> <head> <title> JavaScript 2 </title> <script language="javascript"> var s = "Hello "; document.write(s); document.write(date()); document.write("<br><h1>" + s + "</h1>"); </script> </head> <body> <BR>Resto da página. </body> </html> Aula 16-30/10/

29 No exemplo Código JavaScript na seção de cabeçalho é executado antes de qualquer outra coisa. document.write() escreve no início da página. Outra possibilidade: document.write("<font color=red> hello </font>"); Aula 16-30/10/

30 Exemplo 3 html> <head> <title> JavaScript 3 </title> <script language="javascript"> <!-- var d = Date(); document.write(d+"<br>"); var ano = d.substr(11,4); document.write("o ano é: "); document.write(ano); //--> </script> </head> <body> <br> Resto da página. </body> </html> Variável que recebe o que Date() retorna. Extrai o ano. Aula 16-30/10/

31 Exemplo 4 <html> <head> <title> JavaScript 4 </title> </head> <body> Resto da página <a href=" onmouseover="status= Clique nesse link'; return true;" > Página da Professora Bianca </a> </body> </html> Aspas simples Evento dentro de aspas duplas. Aula 16-30/10/

32 Exemplo 5 <html> <head> <title> JavaScript 4 </title> </head> <body> Resto da página <a href=" onmouseover="status= Clique nesse link!'; return true; onmouseout="status= Tchau!'; return true;"> Página da Professora Bianca </a> </body> </html> Aula 16-30/10/

33 Comando IF O comando if permite que uma condição seja checada: se a condição for verdadeira, certos comandos são executados caso contrário, outros comandos são executados. if (condicao) { comandos } if (condicao) { comandos1 } else { comandos2 } Aula 16-30/10/

34 Exemplo de verificação de Tem duas partes: formulário Uma função de verificação escrita no cabeçalho. O formulário, com uma chamada para verificar parte do evento onsubmit. Aula 16-30/10/

35 <html> <head><title>exemplo de Formulário </title> <script language="javascript"> function verifica(f) { if (f.nome.value == null f.endereco.value == null) { alert("formulário precisa pelo menos de nome e endereço"); return false; } if (f.nome.value == "" f.endereco.value == "") { alert("formulário precisa pelo menos de nome e endereço"); return false; } return true; } </script> </head> Aula 16-30/10/

36 <body> <h1> Cadastro de Cliente </h1> <br> <form method=post enctype="text/plain" onsubmit="return verifica(this);"> Nome: <input type="text" name="nome"> <br> Endereço: <input type="text" name="endereco" size=30> Cidade: <input type="text" name="cidade"> Estado: <select name="state" size=1> <option value= RJ" selected> Rio de Janeiro <option value= SP"> São Paulo <option value= ES"> Espírito Santo <option value= MG"> Minas Gerais </select> <br> Status: <input type="radio" name="status" value= A"> Cliente antigo <input type="radio" name="status" value="n"> Cliente novo <hr> Obrigado! <p> <input type="submit" value= Mande a informação"> </form> </body> </html> Aula 16-30/10/