Introduo a Lgica

Introduo a LgicaNoes de LgicaLgica algo muito comum na nossa vida, a prova disso o que fazemos durante o dia, pois mesmo sem perceber usamos a lgica a todo momento, por exemplo:Noes de LgicaAo acordamos: Tomamos um banho. Escovamos os dentes. Tomamos o caf da manh.Para irmos ao trabalho: Colocamos uma roupa apropriada. Pegamos um nibus. Chegamos no trabalho.O que lgica.Lgica vem do grego clssico logos (), que significa palavra, pensamento, ideia, argumento, relato, razo lgica ou princpio lgico. uma parte da filosofia que estuda o fundamento, a estrutura e as expresses humanas do conhecimento. A lgica foi criada por Aristteles no sculo IV a.C. Para estudar o pensamento humano e distinguir interferncias e argumentos certos e errados.Lgica de programao.Lgica de programao a tcnica de encadear pensamentos para atingir determinado objetivo.

Vrios idiomas;

Vrias Linguagens.O que um algoritmo.Algoritmo um sequncia finita de passos que levam a execuo de uma tarefa. Podemos pensar em algoritmo como uma receita de bolo, uma sequncia de instrues que busca uma meta especfica. Estas tarefas no podem ser redundantes nem subjetivas na sua definio, logo, devem ser claras e precisas.O que um algoritmo.Ao contrrio de uma linguagem de programao, no existe um formalismo rgido de como deve ser escrito o algoritmo. O algoritmo deve ser fcil de se interpretar e fcil de codificar, ou seja, ele deve ser o intermedirio entre a linguagem falada e a linguagem de programao a qual for definir.Exemplos de algoritmos no cotidiano.Trocar uma lmpada. Pegar uma escada Pegar uma lmpada nova. Subir na escada. Retirar a lmpada velha. Colocar a lmpada nova. Descer da escada. Guardar a escada. Colocar a lmpada velha no lixo. Ligar o interruptor para testar.Exemplos de algoritmos no cotidiano.Somar dois nmeros quaisquer. Escreva o primeiro nmero no retngulo A. Escreva o segundo nmero no retngulo B. Some o nmero do retngulo A com nmero do retngulo B e coloque o resultado no retngulo C.Importncia de construir um algoritmo.Um algoritmo tem um papel importante, pois ele determina de que formas podemos resolver um determinado problema, um programa de computador por exemplo, desenvolvido com muita lgica e principalmente um conjunto de algoritmos.As maneiras de representarmos um algoritmo. Descrio Narrativa; Fluxograma Convencional; Pseudocdigo (tambm conhecido como Portugus Estruturado ou Portugol).Descrio Narrativa.

Fluxograma Convencional uma representao grfica de algoritmos onde formas geomtricas diferentes implicam aes (instrues, comandos) distintos. Tal propriedade facilita o entendimento das ideias contidas nos algoritmos e justifica sua popularidade. Nota-se que os fluxogramas convencionais preocupam-se com detalhes de nvel fsico da implementao do algoritmo. Por exemplo, figuras geomtricas diferentes so adotadas para representar operaes de sada de dados realizadas em dispositivos distintos.Fluxograma Convencional

Exemplo de fluxograma convencional.

Introduo JavaScript.JavaScript uma linguagem para auxlio na criao de Home-Pages, as funes escritas em JavaScript podem ser embutidas dentro de seu documento HTML, possibilitando o incremento das funcionalidades do seu documento HTML com elementos interessantes. Sendo possvel: responder facilmente a eventos iniciados pelo usurio, incluir efeitos que tornem sua pgina dinmica. Logo, podemos criar sofisticadas pginas com a ajuda desta linguagem.Introduo JavaScript.Criado pela Netscape;

Chamava-se LiveScript;

LiveScript reestruturado pela Microsystems criadora do Java;

Hoje o JavaScript um padro aberto e empresas de todo o mundo a suportam.

Java diferente de Javascript.Java uma linguagem de programao;

JavaScript uma linguagem de hipertexto;

JavaScript no cria applets ou aplicativos independentes.Principais diferenas. Java uma linguagem de programao OOP, ao passo que Java Script uma linguagem de scripts OOP. Java cria aplicativos executados em uma mquina virtual ou navegador, ao passo que o cdigo JavaScript executado apenas em um navegador. O cdigo Java precisa ser compilado, ao passo que os cdigos JavaScript esto totalmente em texto, apenas interpretado. Eles requerem plugins diferentes.Conceituar compilao e interpretao de cdigo.19Entendo o JavaScript.O javascript rpido pois no compilado, e sim interpretado pelo navegador do usurio.Usando JavaScript.Um cdigo JavaScript pode ser inserido em um documento HTML de duas formas:colocando o cdigo JavaScript como filho de um elemento com a tag script;utilizando o atributo src de um elemento com a tag script no qual devemos passar o caminho relativo ou absoluto para um arquivo que contenha o cdigo JavaScript.Usando JavaScript.

Variveis.Vamos entender varivel, como uma caixa, na qual voc pode dar o nome que lhe achar conveniente, e guardar o contedo que desejar. Ou seja, toda varivel tem um nome, valor e tipo.

Tipos de Variveis. O tipo uma classificao que damos a varivel, essa classificao informa qual forma de dado se encontra ali armazenado. As variveis, podem ser classificadas com os tipos:Inteiro:(negativo, nulo ou positivo). Exemplos: {...-4,-3,-2,-1,0,1,2,3,4...};Real:(negativo, nulo ou positivo). Exemplos: {15.34; 123.08; 0.005 ;-12.0; 510.20};Tipos de Variveis. Numrico: abrange nmeros binrios, octal e hexadecimal;Caracteres: Exemplo: {'a', 'd', 'A', 'h'};Dados literais: Conjunto de caracteres ou String (nmeros, letras e caracteres especiais). Exemplos: {Aluno Aprovado, 10% de multa, Confirma a excluso ??, S, 9930002, email,123nm,fd54fd}.

Tipos de Variveis.Lgico: A todo e qualquer dado que s pode assumir duas situaes biestveis, algo como por exemplo {0/ 1, verdadeiro/falso, sim/no, true/false}.Nomes das Variveis. (Identificadores).Os identificadores so case sensitive;

Nomes de variveis podem ser de qualquer comprimento, em algumas linguagens existe limite no nmero de caracteres que compe o identificador, por essa e pela questo de legibilidade tente no ultrapassar 15 caracteres;

Nomes das Variveis. (Identificadores).Crie identificadores que informe explicitamente para que aquela varivel ir servir na composio do seu programa, ou seja se uma varivel vai armazenar um valor inteiro que ir aumentar de um em um at chegar 100, coloque o nome dessa varivel de contador;Nomes das Variveis. (Identificadores).O primeiro caractere deve ser uma letra ASCII (em maiscula ou minscula) ou um caractere de sublinhado (_). Observe que um nmero no pode ser usado como o primeiro caractere;Os caracteres subsequentes devem ser letras, nmeros ou sublinhados (_);O nome da varivel no deve ser uma palavra reservada.Declarando ou criando uma varivel.Declarar uma varivel tecnicamente pedir ao sistema operacional um espao exclusivo na memria RAM do seu computador para armazenar uma informao.String nome = new String(Jonas)int idade = 25;char opcao = S;Inteiro quantidade = 100;contador = 1;modeloCarro = Celta;Linguagens de Programao Fracamente e Fortemente Tipadas.Linguagem fortemente tipadas(LST):Inteiro contador = 1;Caracter sexo = F;String nome = Jonas;Linguagem de Programao Fracamente Tipada(LWT) ou de tipagem dinmica:idade = 18 (tipo String);idade = 18 (agora a varvel idade do tipo inteiro);Variveis em JavaScript: Declarando ou criando uma varivel JavaScript.Diferente da maioria das linguagens o JavaScript define as variveis dinamicamente. Existem dois tipos de sintaxe de declarao de varivel em JavaScript que so:var nome-da-varivel = valor-da-varivel; ou nome-da-varivel = valor-da-varivel;Palavras-chave em JavaScript.

Palavras-chave que so reservadas, mas no so usadas pelo JavaScript.

Tipos de variveis em JavaScript: string e nmeros.

var valor1= 10; //valor do tipo inteirovar valor2= 3.14; //agora valor2 do tipo float//imprimir na teladocument.write(valor1 + um valor inteiro, j + valor2 + um ponto flutuante!);

Tipos de variveis em JavaScript: string e nmeros.

var nome = Andr;var cidade = Rio claro;document.write(Meu nome + nome + e sou de+ cidade);

Outros tipos de dados JavaScriptBooleanos:

var nome = false;if (nome == false) {document.write (A varivel booleana est FALSA . )} else {document.write (A varivel booleana est VERDADEIRA . }

Outros tipos de dados JavaScriptConstante:

const valor = 10;document.write(O valor constante + valor);

Outros tipos de dados JavaScriptUndefined:Null:

var pessoa; //varivel com valor no definidovar carro = Volvo;document.write( pessoa +
);document.write(carro+
);var carro = null;//varivel definida como vazia ou nuladocument.write(carro+
);

Outros tipos de dados JavaScriptArray:

/*Exemplo de um vetor unidimensional*/var meu_vetor = new Array (Nao Livre , 10, 3.18, 18);document.write (vetor[0]); //Exibe Nao Livre

Outros tipos de dados JavaScriptObject:

/*Trs formas de se criar o mesmo objeto no JavaScript*/var objeto = {};//forma01var objeto = new objeto(); //forma02var objeto = Obejct.create (null);//forma03

Variveis Globais e Locais.Varivel Global: Criada ou declarada fora de uma funo, portanto podem ser utilizadas a qualquer momento no seu script;Varivel Local: Criada ou declarada dentro de uma funo, portanto s podem ser utilizadas dentro da funo criada.Funes: so bloco de cdigos que so executados todas as vezes que invocados por um identificador.Variveis Globais e Locais.

var nome = Joo;document.write ( Nome + nome + );Function exemplo1 () {var nome = Andr;document.write ( Nome + nome + );}

exemplo1 ();document.write (nome);

Operadores em JavaScript: operadores de strings.Concatenao (+);Atribuio de Concatenao (+=).

var a = Bem vindo;var b = ao site;var c = de pesquisa;document.write(a+b+c) // imprime: Bem vindo ao site de pesquisavar d = a+b+c;d += tecnologia;document.write (d); //imprime: Bem vindo ao site de pesquisa tecnologicaa += aluno;document.write (a); // imprime: Bem vindo aluno

Operadores matemticos: Aritmticos.

Operadores Aritmticos.

var a = 3;var b = 4;document.write (a*b+5-2*3) // 12+5-6=11document.write (a*(b+5)-2*3) // 3*9-6=21

Operadores de Atribuio.Os operadores de atribuio so usados para economizar linhas de cdigo, deixando assim o cdigo mais funcional e otimizado.Operadores de Atribuio. 2

48Atribuio para array e string.

Atribuio.

Operadores de decremento e incremento.So operadores usados para atribuir em 1 ou -1 a varivel, isso pode ser feito antes ou depois da execuo de determinada varivel.

51Operadores de decremento e incremento. 1

52Operadores relacionais.Os operadores relacionais ou conhecidos tambm como operadores de comparao, so utilizados para fazer determinadas comparaes entre valores ou expresses, resultando sempre um valor booleano verdadeiro ou falso(TRUE ou FALSE).Operadores relacionais. 1

Operadores lgicos ou booleanos.So utilizados para avaliar expresses lgicas. Estes operadores servem para avaliar expresses que resultam em valores lgico sendo verdadeiro ou falso:

Operao de Negao: 1

Operao de conjuno:

Operao de disjuno no exclusiva:

Operao disjuno: Operadores lgicos ou booleanos. 1

Precedncia de Operadores.Quem mais importante, qual operador avaliado primeiro e qual avaliado em seguida.Caixa de Dilogo: Alert(). 1As caixas de dilogo de alerta so simples e informativas. Elas, geralmente, so utilizadas em validao de formulrios ou bloqueio de aes. Sua funo mostrar apenas uma mensagem com um boto de confirmao para que esta seja fechada. Para chamar esta caixa de dilogo usamos a funo alert(). Esta funo recebe como parmetro uma string que ser a mensagem a ser exibida.Antes de apresentar caixa de dilogo definir o que funo.62Caixa de Dilogo: Prompt(). 1A caixa de dilogo de prompt() nos possibilita requerer uma entrada ao usurio. A caixa de dilogo de prompt() possui trs elementos: um campo input para texto, um boto OK e outro CANCELAR.Caixa de Dilogo: confirm() 1A caixa de dilogo de confirmao chamada pela funo confirm() e tem apenas dois botes: um OK e outro CANCELAR. Assim como a funo prompt(), a funo confirm() tambm retorna um valor que pode ser true (verdadeiro) ou false (falso).Estruturas de controle e repetio: Blocos de controleUm bloco consiste de vrios comandos agrupados com o objetivo de relacion- los com determinado comando ou funo.Blocos em JavaScript so delimitados pelos caracteres { e }.Usar as estruturas de controle sem blocos delimitadores faz com que somente o prximo comando venha ter ligao com a estrutura.Estrutura Condicional: If . Essa estrutura condicional est entre as mais usadas na programao. Sua finalidade induzir um desvio condicional, ou seja, um desvio na execuo natural do programa. Caso a condio dada pela expresso seja satisfeita, ento sero executadas a instrues do bloco de comando. Caso a condio no seja satisfeita, o bloco de comando ser simplesmente ignorado. Em lgica de programao o que usamos como SE (expresso) ENTO {comando:}.Estrutura Condicional: If e if. 1

ex167Estrutura Condicional: If e else. Caso a condio no seja satisfatria (FALSE), podemos atribuir outro comando pertencente ao IF chamado ELSE, como se fosse a estrutura SENO em lgica de programao.Estrutura Condicional: If e else. 1

ex269Estrutura Condicional: else e if. (ifs encadeados) 1Sintaxe:if (expresso1) { comando1;}else if (expresso2){ comando2;}else if (expresso3){ comando3;}else { comando4}70Atribuio condicional (ternrio) 1Como j vimos exemplos de atribuio condicionais (ternrios), podemos defini-los usando a sintaxe:(expresso booleana) ? (executa caso verdadeiro) : (executa caso falso);Isso se aplica quando queremos uma estrutura resumida, onde podemos ter um resultado mais direto, como por exemplo, atribuir um valor a uma varivel dependendo de uma expresso.ex1p4271SWITCH. (Substituto dos ifs encadeados) O comando SWITCH uma estrutura que simula uma bateria de teste sobre uma varivel. Frequentemente necessrio comparar a mesma varivel com valores diferentes e executar uma ao especifica em cada um desses valores.Lembrar de falar sobre break, default e valores ele trabalha.72SWITCH. (Substituto dos ifs encadeados)

Lembrar de falar sobre break, default e valores ele trabalha. 73SWITCH com BREAK e default 1Break uma instruo (comando) passada quando queremos parar o fluxo da execuo de um programa. Em JavaScript, ele tem a mesma funo que abortar o bloco de cdigo correspondente.Temos um comando onde determinamos uma opo padro caso nenhuma das outras venha ter resultado que satisfaa a expresso passada para o switch chamada default (padro).WHILE.O WHILE uma estrutura de controle similar ao IF, onde possui uma condio para executar um bloco de comandos. A diferena primordial que o WHILE estabelece um lao de repetio, ou seja, o bloco de comandos ser executado repetitivamente enquanto a condio passada for verdadeira. Esse comando pode ser interpretado como ENQUANTO (expresso) FAA { comandos...}.WHILE. 1Sintaxe:While (expresso) {Comandos;}ex1p4576Propriedade length 1A propriedade length chamada logo aps uma varivel de texto e retorna a quantidade de caracteres incluindo tambm os espaos em branco.ex2p4577DO...WHILE. O lao do...while funciona de maneira bastante semelhante ao while, com a simples diferena que a expresso testada ao final do bloco de comandos.DO...WHILE. 1

ex1p4679FOR.O for semelhante ao while, onde tem a finalidade de estabelecer um lao de repetio em um contador. Sua estrutura controlada por um bloco de trs comandos que estabelecem uma contagem, ou seja, o bloco de comandos ser executado determinado nmero de vezes. A estrutura while e do while normalmente usado quando o programador no sabe quantos loops o sistema ir realizar, j o for informamos explicitamente qual ser o ponto de partida, o seu limite, e valor de incremento ou decremento.FOR.

81FOR. 1 2ParmetrosDescrioInicializaoParte do for que executado somente uma vez, usado para inicializar uma varivel.CondioParte do for onde declarada uma expresso booleana.IncrementoParte do for que executada a cada interao do lao.ex1p4782FOREACH 1O foreach um lao de repetio para interao em array's ou matrizes, o qual estudaremos com mais detalhes no prximo captulo. Trata-se de um for mais simplificado que compe um vetor ou matriz em cada um de seus elementos por meio de sua clusula IN.ex2p4783FOREACH 1Sintaxe: vetor = [];for (indice in vetor){ comando...}ex2p4784FOREACH Veremos adiante que um array uma varivel composta por vrios elementos. No caso do exemplo , esses elementos so nomes de cursos. A finalidade do foreach justamente a cada lao, pegar cada ndice desses valores e atribuir a uma varivel indice at que tenha percorrido todo array e assim, finalizar o lao. Podemos saber em qual posio o elemento se encontra no array, para isso basta imprimir o ndice.Break. 1Outro comando importante o break, usado para abortar (parar) qualquer execuo de comandos como SWITCH, WHILE, FOR, FOREACH, ou qualquer outra estrutura de controle. Ao encontrar um break dentro de um desses laos, o interpretador JavaScript interrompe imediatamente a execuo do lao, seguindo normalmente o fluxo do script.CONTINUE. 1A instruo continue, quando executada em um bloco de comandos for/while, ignora as instrues restantes at o fechamento em }. Dessa forma, o programa segue para a prxima verificao da condio de entrada do lao de repetio, funciona de maneira semelhante ao break, com a diferena que o fluxo ao invs de sair do lao volta para o incio dele.Objetos em javascript.Quase Tudo em JavaScript um objeto: uma String, um nmero, uma matriz, uma data, um boto ...Em JavaScript, um objeto so variveis que guardam atributos e mtodos:Atributos so caractersticas de um objeto.Mtodos so aes que um objeto pode realizar;

Objetos em javascript.

Objeto String, Acessando atributos e mtodos.Em JavaScript como j mencionado quase tudo objeto. Quando declaramos uma varivel dessa forma:var txt = hello;O que realmente estamos fazendo criando um objeto String JavaScript. O objeto String tem vrios mtodos e alguns atributos j prontos para facilitar o seu trabalho quando for preciso manipular Strings, os quais so chamados built-in, ou seja, mtodos que so nativos do JavaScript.Acessando Atributos.Para acessarmos um atributo ou mtodos de um objeto usamos o operador ponto ( . ), logo aps o nome do objeto.

Se executarmos a instruo document.write(tamanhoDaString); ser mostrado o valor 5 na pgina.

Acessando Mtodos.Para acessarmos os mtodos de um objeto tambm utilizamos o operador ponto ( . ), logo aps o nome do objeto, a diferena que aps o nome do mtodo que ser chamado digitamos parnteses ( ), nos quais podemos colocar ou no argumentos dentro.Acessando Mtodos.Exemplo:

Este mtodo responsvel por converter todos os caracteres de uma String para maisculo. A sada desse trecho de cdigo JavaScript essa:

Mtodos e atributos que um objeto 1 String JavaScript possui:Atributos:length; // retorna nmero de caracteres.prototype; //retorna classe do objeto.constructor. Mtodos:charArt(), charCodeArt(), concat(), fromCharCode(), indexOf(), lastIndexOf(), match(), replace (), search(), slice(), split(), substr(), substring(), toLowercase(), toUpperCase(), valueOf().

Dizer o que cada um faz!94Objeto Number.JavaScript tem apenas um tipo de nmero, os quais podem ter ou no casas decimais. JavaScript no uma linguagem tipada, ao contrrio de muitas outras linguagens de programao, ela no define diferentes tipos de nmeros, como nmeros int, short, long, float... Todos os nmeros em JavaScript so armazenados como float de 64 bits(8 bytes).Objeto Number: Atributos e Mtodos.Atributos:MAX_VALUE, MIN_VALUE, NEGATIVE_INFINITIVE, POSITIVE_INFINITIVE, NaN, prototype, constructor.Mtodos:toExponential(), toFixed(), toPrecision(), toString(), valueOf().Objeto Number: atributosNumber.MAX_VALUE O nmero mais alto que pode ser utilizado em Javascript.Number.MIN_VALUE O menor nmero que podemos utilizar em Javascript.Number.NEGATIVE_INFINITY Quando um nmero ultrapassa o menor nmero possvel em Javascript.Number.POSITIVE_INFINITY Quando um nmero ultrapassa o maior nmero possvel em Javascript.Number.NaN Representa um valor "Not-a-Number" (No um nmero) em Javascript.Atributos objeto Number CONSTANTESPara utilizar esses atributos, que so constantes, no precisamos criar ou instanciar um objeto do tipo Number como fizemos no Objeto String. Colocamos apenas a palavra-chave Number seguido de um ponto( . ) e j conseguimos acessar os valores contidos nessa constante.Ex:Atributos objeto Number CONSTANTESNumber.MAX_VALUE retorna o maior nmero que pode ser representado em javascript: 1.7976931348623157e+308Number.MIN_VALUE retorna o nmero mais de zero que pode serrepresentado em javascript:5.00E-324Objeto Number: mtodos 1 toExponential( valor numrico ) Retorna uma string representando uma notao exponencial;toFixed( valor numrico ) Retorna uma string representando um nmero usando notao de ponto fixo;toPrecision( valor numrico ) Retorna uma string representando uma nmero usando uma preciso determinada.100Representao de um numero em Hexadecimal, Octal e notao cientfica.Hexadecimal: Podemos representar um nmero em hexadecimal em JavaScript colocando o valor : 0x na frente do nmero a ser representado:

Representao de um numero em Hexadecimal, Octal e notao cientfica.Octal: 0 na frente do nmero a ser representado.

Notao cientfica:

Objeto Math.Em JavaScript, podemos fazer uso de um objeto prprio para clculos matemticos chamado Math que possui constantes, mtodos para calcular potncias, razes, arredondamentos, funes trigonomtricas, maneiras de encontrar o menor e o maior valor, alm de um gerador de nmeros randmicos.Constantes.E: constante do nmero de Euler. (2,718281828459045)LN2: constante com o resultado do logaritmo natural na base 2. (0,6931471805599453);LN10: constante com o resultado do logaritmo natural na base 10. (2,302585092994046);LOG2E: constante com o resultado do logaritmo na base 2 do nmero de Euler. (1,4426950408889634);Constantes. 1LOG10E: constante com o resultado do logaritmo na base 10 do nmero de Euler. (0,4342944819032518);PI: constante do pi ( ). (3,141592653589793);SQRT1_2: constante com o resultado da raz quadrada de meio. ( 0,7071067811865476);SQRT2: constante com o resultado da raz quadrada de 2 (2 1,4142135623730951);

Objeto Math e seus mtodos.Razes e Potncias:O mtodo sqrt() extrai a raz quadrada do nmero passado como argumento.

O mtodo pow() retorna o valor da potncia indicada em seus parmetros, sendo o primeiro parmetro o nmero base e o segundo o expoente.

Objeto Math e seus mtodos. 1 possvel tambm fazer o clculo utilizando a constante de Euler. Para isso, usamos um mtodo prprio chamado exp(), que recebe apenas um argumento que o expoente da potncia.

Arredondamentos.O mtodo round() arredonda um nmero para o inteiro mais prximo, tanto para baixo quanto para cima. Por exemplo, o nmero 3.3 arredondado ser 3, mas o nmero 3.8 arredondado ser 4.O mtodo floor() arredonda um nmero para o inteiro mais baixo. Tambm considerado como piso.

Arredondamentos.O mtodo ceil() arredonda um nmero para o inteiro mais alto. Tambm considerado como teto.O mtodo abs() remove apenas a parte fracionada. Ou seja, retorna o valor absoluto.Trigonometriasin(): retorna o valor de seno;cos(): retorna o valor de cosseno;tan(): retorna o valor da tangente;asin(): retorna o valor do arco seno;acos(): retorna o valor do arco cosseno;atan(): retorna o valor do arco tangente;Maior e Menor. 1Existem dois mtodos do objeto Math que servem como comparativos.min(valor1, valor2): retorna o menor valor entre os parmetros passados.max(valor1, valor2): retorna o maior valor entre os parmetros passados.Nmero Randmico. 1O objeto Math tambm possui um mtodo para gerar automaticamente nmeros randmicos. O mtodo random() retorna um nmero entre 0 e 1, ou seja, pode ser 0, 1, 0.5, 0.2, 0.8, 0.4567412, e assim por diante. Se, por exemplo, quisermos fazer o limite entre 0 e 10, basta que multipliquemos por 10 o valor retornado por random(). Dessa forma conseguiremos um nmero entre randmico maior. O problem a de se usar isso que os nmeros retornados sempre sero muito fracionados, portanto, o ideal utilizar junto uma das funes de arredondamento vistas nos tpicos anteriores.Objeto BooleanOs objetos boolean servem para representar os valores booleanos (true/false). Uma de suas possveis caractersticas a de conseguir valoresbooleanos a partir de dados de qualquer outro tipo. Dependendo do que receba o construtor da classe Boolean o valor do objeto booleano que se cria ser verdadeiro ou falso, da seguinte maneira:Objeto Boolean. 1Inicia-se false: quando voc no passa nenhum valor ao construtor, ou se passa uma cadeia vazia, o nmero 0 ou a palavra false sem aspas. Inicia-se true: quando recebe qualquer valor entre aspas ou qualquer nmero distinto de 0. Pode-se compreender o funcionamento deste objeto facilmente se examinarmos alguns exemplos.Objeto Date.O objeto Date usado para trabalhar com datas e tempo. Para trabalhar com datas necessitamos instanciar um objeto da classe Date e com ele j podemos realizar as operaes que necessitamos.Criando um objeto Date.Para criar um objeto com o dia e hora atuais, colocamos os parnteses vazios ao chamar ao construtor da classe Date.

Definindo uma data especfica. 1Para criar um objeto data com um dia e hora diferentes dos atuais temos que indicar entre parnteses o momento para iniciar o objeto.Um detalhe, o ms comea por 0(zero), ou seja, janeiro o ms 0. Se no indicamos a hora, o objeto data se cria com hora 00:00:00. Assim possvel criar um objeto Date com o valor de qualquer data. Lembre-se de que o valor do ms parece sempre diminudo de 1, porque janeiro=0, fevereiro=1, maro=2, ..., dezembro=11!! At o argumento "dia" obrigatrio, os outros so opcionais.Mtodos do Objeto DateO objeto Date no possui atributos/propriedades, por outro lado, possui muitos mtodos. A seguir sero apresentados alguns dos seus principais mtodos:Mtodos do Objeto Date1. getDate(): devolve o dia do ms, um inteiro entre 1 e 31.2. getDay(): devolve o dia da semana, inteiro entre 0 e 6 (0 para Domingo).3. getHours(): retorna a hora, inteiro entre 0 e 23.4. getMinutes(): devolve os minutos, inteiro entre 0 e 59.Mtodos do Objeto Date5. getSeconds(): devolve os segundos, inteiro entre 0 e 59.6. getMonth(): devolve o ms, um inteiro entre 0 e 11 (0 para Janeiro).7. getTime(): devolve os segundos transcorridos entre o dia 1 de janeiro de 1970 e a data correspondente ao objeto ao que se passa a mensagem.Mtodos do Objeto Date8. getYear(): retorna o ano, os ltimos dois nmeros do ano. Por exemplo, para o 2006 retorna 06. Este mtodo est obsoleto agora se utiliza getFullYear().9. getFullYear(): retorna o ano com todos os dgitos com datas posteriores desde 2000.10. setDate(d): atualiza o dia do ms.Mtodos do Objeto Date11. setHours(h): atualiza a hora.12. setMinutes(m): muda os minutos.13. setMonth(m): muda o ms (ateno ao ms que comea por 0).14. setSeconds(s): muda os segundos.15. setTime(t): atualiza a data completa. Recebe um nmero de segundos desde 1 de janeiro de 1970.Mtodos do Objeto Date16. setYear(y): muda o ano, recebe um nmero, ao que lhe soma 1900 antes de coloc-lo como ano data. Por exemplo, se receber 95 colocar o ano 1995. Este mtodo est obsoleto agora se utiliza setFullYear(), indicando o ano com todos os dgitos.17. setFullYear(): muda o ano da data ao nmero que recebe por parmetro. O nmerose indica completo ex: 2005 ou 1995. Utilizar este mtodo para estar certo de que tudo funciona para datas posteriores a 2000.Mtodos do Objeto Date18. getimezoneOffset(): Devolva a diferena entre a hora local e a hora GMT (Greenwich, UK Mean Time) sob a forma de um inteiro representando o nmero de minutos (e no em horas).19. toGMTString(): devolva o valor do atual em hora GMT (Greenwich Mean Time)Array. Um array no JavaScript atualmente um conjunto de valores ordenado por ndices. Podemos relacionar cada valor com uma ndice/chave, para indicar em qual posio um determinado valor est armazenado dentro do array.

Criando um Array. Construo simples sem dimensionamento: Quando criamos um array, mas no especificamos quantas posies ele ir possuir; Construo simples com dimensionamento: Quando criamos um array e especificamos quantas posies ele ir possuir. Estas posies so vazias. Construo inserindo valores: Quando criamos um array e especificamos exatamente quais valores ele ir possuir. Cada valor deve ser separado por vrgula e qualquer tipo de dado pode ser utilizado para popular nosso vetor .Criando um Array.

Criando um Array. 1Detalhe importante que todo array no associativo comea pela chave ou ndice de nmero 0.

Arrays Associativos.Os arrays associativos associa-se um determinado valor ou nome a um dos valores do array. O array associativo usa strings como ndice, onde cada string pode representas uma chave.Var vetor = {chave1:valor1,chave2:valor2,chaveN:valorN}

Arrays Associados.Umas das vantagem do array associativo quando fazemos o acesso ao array, onde temos de forma clara e compreensvel o valor que aquela chave pode conter. Como por exemplo nome, onde s vai existir o nome de pessoas. Dessa forma podemos acessar o array. Basta determinar o nome do array e qual a chave, onde cada chave tem um valor j determinado. Resultar em um erro o uso de uma chave errada.Arrays Associativos. 1

ex2p62131Interaes. 1Quando falamos de interaes em um array estamos dizendo o mesmo que percorrer esse array usando mecanismos da prpria linguagem. No JavaScript podem ser iterados pelo operador FOR( chave IN array ) que j vimos anteriormente.Acessando um Array. 1 Quando criamos um array temos que ter em mente que estamos criando uma varivel que possui vrios valores e que os mesmo podem ser acessados a qualquer momento. Cada valor est guardado em uma posio que pode ser acessada atravs de uma chave. A sintaxe para acesso simplificado de um array a seguinte:

ex1p64133Alterando um Array. 1 2Podemos alterar qualquer valor de um array. muito semelhante ao acesso, onde, a diferena est na chamada do array. nesse momento que atribumos um novo valor.

Ex2p64 e ex1p65134Arrays multidimensionais.Os arrays multidimensionais so estruturas de dados que armazenam os valores em mais de uma dimenso. Os arrays que vimos at agora armazenam valores em uma dimenso, por isso para acessar s posies utilizamos somente um ndice ou chave. Os arrays de 2 dimenses salvam seus valores de alguma forma como em filas e colunas e por isso, necessitaremos de dois ndices para acessar a cada uma de suas posies.Arrays multidimensionais.

Iniciando Arrays multidimensionais.Var matriz = [ [0.0, 0.1, 0.2, 0.3] , [1.0, 1.1, 1.2, 1.3] , [2.0, 2.1, 2.2, 2.3] , [3.0, 3.1, 3.2, 3.3] ,];Iniciando Arrays multidimensionais.var matriz = [4,4];matriz[0] = [0.0, 0.1, 0.2, 0.3];matriz[1] = [1.0, 1.1, 1.2, 1.3];matriz[2] = [2.0, 2.1, 2.2, 2.3]; matriz[3] = [3.0, 3.1, 3.2, 3.3]; Array multidimensionais. Observe que temos uma chave para representar a linha e outra para representar a coluna, assim, determinando uma matriz 4x4. Podemos ver tambm que inicializamos um array dentro do outro. Cada sub-array uma linha, e cada elemento do array maior representa as colunas.Acessando Array multidimensional. 1 2 Para acessarmos o valor de um array multidimensional, basta colocar as duas ou mais chaves da posio que queremos acessar. muito semelhante ao array de uma nica dimenso.Ex1p67 ex2p67140Funes com Arrays. 1O objeto Array possui uma propriedade chamada length. Esta propriedade mostra quantos elementos o vetor possui.ex1p68141Juno e concatenao de Arrays (Vetores)H momentos que queremos unir um ou mais vetores. JavaScript nos possibilita fazer isso resultando duas formas diferentes.Mtodo join(). 1 2O vetor construdo com o objeto Array de JavaScript pode ter a juno de seus elementos. A juno consiste em criar uma string nica usando separadores. O mtodo join()nos possibilita a juno de forma simples, precisa e correta em uma string.Ex1p69 sem o mtodo join() e ex2p69 com o mtodo join()143Mtodo concat(). 1O mtodo concat()consiste em unir um ou mais arrays (vetores). Este mtodo usa como argumento um objeto do tipo array. Se desejarmos unir mais de um vetor, cada objeto array do argumento deve vir separado por vrgula (,).ex3p69144Mtodo push(). 1Alm da forma algortmica de inserir um elemento no final de um array, o prprio objeto Array possui um mtodo que faz isso por ns. O mtodo push() insere um ou mais elementos no final de um array.A sintaxe : push (elemento1, elemento2, elemento3, ...)Dessa forma, no precisamos nos preocupar com o tamanho e nem com o ltimo ndice do array.ex1p70145Mtodo unshift(). 1Outra forma de inserir elementos utilizar o mtodo unshift(). O mtodo unshift() insere um ou mais elementos no incio de um array.A sintaxe : unshift (elemento1, elemento2, elemento3, ...)ex2p70146Mtodo pop(). 1O mtodo pop() remove um elemento do final de um array e retorna o contedo do ndice removido.ex1p71147Mtodo shift(). 1Outra forma de remover elementos utilizar o mtodo shift(). O mtodo shift()remove um elemento do incio de um array e retorna o contedo do ndice removido.148Remover Elementos no Meio do Array Algoritmicamente. 1Exemplo149Mtodo reverse(). 1O mtodo reverse do objeto array serve para inverter a ordem dos elementos de um array. Dessa forma podemos usar apenas uma forma de organizao e depois inverter o array para conseguir a ordem desejada.Mtodo Sort() 1O mtodo sort() o que realmente faz a organizao do array. Porm, sort() apenas organiza o array de forma alfabtica, se quisermos organizar o array de forma numrica devemos criar uma funo para isso.Manipulao de funes.Quando queremos um cdigo funcional para determinado fim, como por exemplo fazer um clculo ou alguma interao dentro do JavaScript, usamos o que chamamos de funo. As funes so um pedao de cdigo com o objetivo especfico, encapsulado sob uma estrutura nica que recebe um conjunto de parmetros e retorna ou no um determinado dado. Uma funo declarada uma nica vez, mas pode ser utilizada diversas vezes. uma das estruturas mais bsicas para prover reusabilidade ou reaproveitamento de cdigo, deixando as funcionalidades mais legveis.Declarando uma funo. 1function nome_da_funo(argumento1, argumento 2, ...) {comandos;return $valor}Escopo de variveis em funes. 1Variveis locais - so aquelas declaradas dentro de uma funo e no tem visibilidade fora dela.Variveis Globais So variveis declaradas fora do escopo de uma funo, porm tem visibilidade (pode ser acessada) ao contexto de uma funo sem pass-la como parmetro. Para isso declaramos a varivel no escopo fora da funo e fazemos a sua chamada dentro da funo.Valor de retorno. 1Toda funo pode opcionalmente retornar um valor, ou simplesmente executar os comandos e no retornar valor algum. No possvel que uma funo retorne mais de um valor, mas permitido fazer com que uma funo retorne um valor composto, como listas ou array's. As operaes aritmticas podem ser feita de forma direta no retorno.Recurso. 1Funo recursiva uma definio usada tanto na programao quanto na matemtica, onde, significa que uma funo faz a chamada de si mesma na sua execuo.Eventos JavaScript.Quando um usurio visita uma pgina web e interage com ela se produzem os eventos e com Javascript podemos definir o que queremos que ocorra quando se produzam, por exemplo quando um usurio clica sobre um boto, edita um campo de texto ou abandona a pgina um evento lanado e podemos definir que alguma funo seja executa quando isso acontecer.Relao de eventos.onabort - Este evento se produz quando um usurio cancela o carregamento de uma imagem, seja porque para o carregamento da pgina ou porque realiza uma ao que a detm, como por exemplo, sair da pgina. onblur- Desata-se um evento onblur quando um elemento perde o foco da aplicao. O foco da aplicao o lugar onde est situado o cursor, por exemplo, pode estar situado sobre um campo de texto, uma pgina, um boto ou qualquer outro elemento.Relao de eventos.onchange Desata-se este evento quando muda o estado de um elemento de formulrio, s vezes no se produz at que o usurio retire o foco da aplicao do elemento.onclick Produz-se quando se clica o boto do mouse sobre um elemento da pgina, geralmente um boto ou um link.Relao de eventos.ondragdrop Produz-se quando um usurio solta algo que havia arrastado sobre a pgina web.onerror Produz-se quando no se pode carregar um documento ou uma imagem e esta fica quebrada.onfocus - O evento onfocus o contrrio de onblur. Produz-se quando um elemento da pgina ou a janela ganham o foco da aplicao.Relao de eventos.onkeydown - Este evento produzido no instante que um usurio pressiona uma tecla, independentemente que a solte ou no. produzido no momento do clique.onkeypress - Ocorre um evento onkeypress quando o usurio deixa uma tecla clicada por um tempo determinado. Antes deste evento se produz um onkeydown no momento que se clica a tecla.Relao de eventos.onkeyup Produz-se quando o usurio deixa de apertar uma tecla. produzido no momento que se libera a tecla.onload - Este evento se desata quando a pgina, ou em Javascript 1.1 as imagens, terminaram de se carregar.onmousedown Produz-se o evento onmousedown quando o usurio clica sobre um elemento da pgina. onmousedown se produz no momento de clicar o boto, soltando ou no.Relao de eventos.onmousemove Produz-se quando o mouse se move pela pgina.onmouseout Desata-se um evento onmuoseout quando a seta do mouse sai da rea ocupada por um elemento da pgina.onmouseover - Este evento desata-se quando a seta do mouse entra na rea ocupada por um elemento da pgina.Relao de eventos.onmouseup - Este evento se produz no momento que o usurio solta o boto do mouse, que previamente havia clicado.onmove - Evento que se executa quando se move a janela do navegador, ou um frame.onresize - Evento que se produz quando se redimensiona a janela do navegador, ou o frame, no caso de que a pgina os tenha.Relao de eventos.onreset - Este evento est associado aos formulrios e se desata no momento que um usurio clica no boto de reset de um formulrio.onselect Executa-se quando um usurio realiza uma seleo de um elemento de um formulrio.onsubmit - Ocorre quando o visitante aperta sobre o boto de enviar o formulrio. Executa-se antes do envio propriamente dito.Relao de eventos.onunload - Ao abandonar uma pgina, seja porque se clique em um link que nos leva a outra pgina ou porque se fecha a janela do navegador, se executa o evento onunload.Evento onclick. 1 2O evento onclick lanado/disparado quando clicamos em um elemento da pgina, geralmente um boto ou um link. Esse evento valido para os objetos ou componentes de pgina HTML: Button, Checkbox, Radio, Link, e Submit. Sintaxe:

Evento onsubmit. 1O evento onsubmit suportado apenas por formulrios e disparado quando o usurio clica no boto Enviar de seus formulrios. neste evento que voc far a validao do formulrio, assim como enviar o usurio para uma pgina, informando do sucesso/falha do envio de dados, ou outra ao que voc queira definir no momento. Sintaxe:

Evento onmouseover e onmouseout. 1O evento onmouseover ocorre quando o ponteiro do mouse se posiciona sobre um elemento da pgina HTML, j o evento onmouseout acontece o oposto, o evento disparado quando retiramos o ponteiro do mouse de sobre um determinado elemento. Sintaxe:

Eventos: onfocus e onblur. 1O evento onfocus ocorre quando um elemento/objeto recebe o foco. Ex: quando voc clica em um campo de texto para digitar algo, aquele elemento ganhou foco e nessa ao gerado um evento do tipo onfoucs, j o onblur o oposto o evento gerado quando o elemento perde o foco. Sintaxe:

Evento: onchange. 1O evento onchange disparado sempre que o texto de um elemento foi alterado. Ns podemos us-lo para fazer uma verificao em um valor digitado pelo usurio e inform-lo ou instru-lo a digitar novamente. Este evento est disponvel para os campos texto, reas de texto e listas de seleo. Sintaxe:

Eventos: onload e onunload. O onload um dos eventos mais importantes em JavaScript. Ele disparado sempre que a pgina estiver carregada por completo. Todas as vezes que voc escrever um script que s possa ser executado usando outros elementos da pgina, sempre uma boa idia usar este evento para dar incio execuo do cdigo. Por s ocorrer quando a pgina estiver carregada por completo, este evento evita que o seu cdigo tente acessar algum elemento que no esteja baixado para a pgina ainda.Eventos: onload e onunload. 1J o evento onunload disparado assim que usurio encerra a execuo da pgina atual para exibir uma nova pgina. Ele pode ser usado para dar alguma informao, agradecer ao usurio a sua visita ou exibir uma nova pgina. Este evento tambm ocorre se voc usar o boto Voltar do browser. Sintaxe:

Document Object Model DOM.Para ter um domnio completo de JavaScript, preciso que voc passe pelo estudo do DOM (Document Object Model), que o modelo dos objetos que formam a hierarquia de toda a estrutura de uma pgina web. Essa estrutura comea a partir da janela do navegador e vai at o ltimo elemento da pgina.Document Object Model DOM.Para entendermos melhor o que uma hierarquia de objetos, considere o seguinte exemplo. Suponhamos que voc esteja abrindo a porta de seu carro. No momento que abre a porta, se pudssemos demonstrar em cdigo o que voc acaba de fazer, teramos algo como o mostrado em seguida:carro.porta.fechadura.aberta = true;Document Object Model DOM.

DOM em ao. 1 2 3

Pgina html sem o script177DOM HTML Modificando HTML usando JavaScript. O DOM HTML permite que o JavaScript altere o contedo HTML, ou seja, podemos modificar o texto de um pargrafo ou uma imagem, por exemplo, ao executar um script JavaScript.Escrevendo dentro de uma pgina HTML utilizando JavaScript. 1Usando o write, um dos mtodos do objeto document, podemos escrever dentro do documento HTML.Alterando contedo HTML utilizando JavaScript. A maneira mais fcil de modificar o contedo de um elemento HTML usando o atributo ou propriedade innerHTML. Para alterar o contedo de um elemento HTML, use esta sintaxe:

document.getElementById(id).innerHTML=novo HTML

Alterando contedo HTML utilizando JavaScript. 1id valor do id do elemento HTML, sempre lembrar de colocar esse valor entre aspas.novo valor o novo valor do atributo, se no for uma varivel colocar o novo valor entre aspas.getElementById() um mtodo que captura um objeto ou elemento de uma pgina HTML pelo id do mesmo.Alterando um atributo HTML utilizando JavaScript. 1document.getElementById(id).atributo= novo valorLegenda:id valor do id do elemento HTML, sempre lembrar de colocar esse valor entre aspas.atributo especifique qual atributo da tag HTML ser alterado.novo valor o novo valor do atributo, se no for uma varivel colocar o novo valor entre aspas.getElementById() um mtodo que captura um objeto ou elemento de uma pgina HTML pelo id do mesmo.DOM CSS Modificando CSS usando JavaScript.Podemos alterar/criar propriedades CSS de um objeto ou elemento contido em uma pgina HTML utilizando o JavaScript, ou seja, se uma div dentro de sua pgina HTML tem o atributo color=blue; definido no seu CSS, podemos modificar dinamicamente esse valor utilizando o DOM.DOM CSS Modificando CSS usando JavaScript. 1document.getElementById(id).style.propriedade= novo valor Legenda:id valor do id do elemento HTML, sempre lembrar de colocar esse valor entre aspas, se no for uma varivel javascript.propriedade especifica qual a propriedade CSS ser alterado/criado.novo valor o novo valor do atributo, se no for uma varivel, deve ser colocado entre aspas.getElementById() um mtodo que captura um objeto ou elemento de uma pgina HTML pelo id do mesmo.Introduo a Jquery.O FrameWork Jquery nada mais que uma um conjunto de bibliotecas escritas em JavaScript, contendo funes que tratam de efeitos interativos em processos Web. O Jquery veio para facilitar os efeitos do JavaScript, realizando em poucas linhas uma vasta possibilidades de efeitos.Um exemplo de sua funcionalide:Enquanto em Java Script escrevamos: document.getElementById(elemento)No Jquery s precisamos : $(#elemento)Instalao e configuraoPara realizar a instalao e configurao, primeiramente devemos acessar o site oficial da Jquery: http://code.jquery.com/ E acessar o link de download. Voc dever copiar o contedo de texto e salvar no seu computador como jquery.js. Como iremos trabalhar na verso : 1.10.0, o link direto que contm o a jquery :http://code.jquery.com/jquery1.11.0.min.js Assim que o arquivo tiver salvo, adicione-o dentro do seu projeto, de preferencia em uma pasta para separ-la dos demais elementos do seu site .Importar o Jquery.Dentro da tag :

Exemplos 1 2 3 4

SeletoresSeletores:Seletor Descrio$( this )Seleciona o elemento referendado por ela mesma.$( * )Seleciona todos os elementos do documento HTML$(div )Seleciona todos os elementos poder ser usado para outros. Ex: img a .$(.curso )Seleciona todos os elementos cuja a classe seja curso.$( #camada )Seleciona um nico elemento de id = camada.$(#camada img)Seleciona todas as imagens que estiver dentro da camada (exemplo).Seletores.Pseudo-Seletores:SeletorDescrioExemplo:firstSeleciona por um primeiro item$(ul li:first):lastSeleciona por um ultimo item$(ul li:last):notIgnora um item selecionado$(ul li:not(:last)):containsSeleciona um item que contenha texto indicado.$(p:contains(fab)):emptySeleciona itens vazio$(p:empty):visibleSeleciona itens visiveis$(div:visible)Pseudo-Seletores de formulrios:SeletorDescrioExemplo:textSeleciona campos do time text$(:text):hiddenSeleciona campos invisveis$(:hidden):fileSeleciona arquivos de um formulrios$(:file):buttonSeleciona botes do tipo button em um formulrio$(:button):checkboxSeleciona um checkbox de formulrio$(:checkbox):imageSeleciona campo/Inagem de um formulrio$(:image):passwordSeleciona um campo de texto do tipo Senha de um formulrio$(:password):radioSeleciona uma caixa de texto do tipo Radio$(:radio):submitSeleciona um boto do tipo submit de um formulrio.$(:submit):resetSeleciona um boto do tipo reset de um formulrio.$(:reset)Seletores de Formulrios:SeletorDescrio$(input [name = bot ])Todos os elementos de formulrio com o nome bot.$(input [name != curso ])Todos os elementos de formulrio com um valor diferente de curso.

Biblioteca Jquery- Funes de Estilo 1

Funo .css():Com esse comando podemos adicionar um estilo CSS mesmo que o elemento html no tenha estilo pronto para ela:

$(elemento).css(Atributo CSS, valor)

Funo .add(). 1Com este comando podemos adicionar estilo a vrios elementos distintos com um mesmo comando, podemos tambm definir os estilo mais genricos, e especficos entre os elementos envolvidos no relacionamento.Funo .addClasse() e removeClass(). 1Estas funes so responsveis por alterar um estilo estruturado de CSS de um determinado elemento html substituindo um estilo por outro. Veja sua Sintaxe:.$(elemento).addClass(.classNova);E para remover o estilo da classe adicionada temos:$(elemento).removeClass(.classNova);Funo toggleClass(). 1Podemos modificar um estilo de um elemento e quando esse elemento for ativado novamente, a funo ir voltar para o seu estado original.$(elemento).toggleClass(.classNova);Funes de visibilidade: Funes show() e hide()Podemos mostrar um determinado elemento HTML atravs do comando show() ou esconde-los usando o comando hide() de acordo com as nossas necessidades.$(elemento).hide()

$(elemento).show()Funes de visibilidade: Funes show() e hide() As 2 funes podem receber como parmetro uma String com 2 tipos de valores.Fast Slow.$(elemento).show(fast) / $(elemento).show(slow)$(elemento).hide(fast) / $(elemento).hide(slow)Funes show() e hide() 1$(elemento).show(2000);$(elemento).hide(2000);

Funo Toggle() 1Esta funo, realiza o mesmo resultado das funes, show() e hide() estudados no tpico anterior. Porm ele tem uma pequena implementao de algoritmo que permite analisar se o elemento est visvel ou no, alterando dinamicamente o seu estado de visibilidade.Funo delay() 1Essa funo poder ser combinada com outras funes Jquery, ela ira programar cada evento com um tempo de espera estimado em milissegundos como parmetro.

$(elemento).delay(tempo).outrasFunes();

Funes FadeIn() e Fadeout() 1A funo fadeIn() faz tornar visvel um elemento HTML, enquanto fadeOut() torna invisvel.Veja sua sintexe abaixo:Para tornar visvel :$(elemento).fadeIn();Para tornar invisvel ;$(elemento).fadeOut();FadeTo(). 1Esta funo responsvel por controlar o nvel de opacidade de uma elemento HTML, onde :$(elemento).fadeTo(velocidade, opacidade);Velocidade = Velocidade do efeito de transio da opacidade antiga com a novo valor de opacidade poder ser numrico em milisegundos ou uma String slow e fast.Opacidade = nvel de opacidade do elemento, poder variar de 0(zero) at 1(100%) onde os valores intermediarios seriam o nvel da opacidade. Exemplo: 0.5 = (50% de opacidade).FadeToggle(). 1Essa funo responsvel por alterar o modo de visibilidade de um elemento HTML voltando ao seu estado inicial quando ativado novamente, ele segue o mesmo raciocnio das funes que contm Toggle nos tpicos anteriores, alterando apenas a maneira como feita a animao.$(elemento).fadeToggle(velocidade);Biblioteca JqueryuiA jQuery UI proporciona abstraes de baixo nvel de interao, animao e avanados efeitos especiais de alto nvel, construda em cima do jQuery JavaScript Library, que pode ser utilizada para construir aplicaes web altamente interativas.Instalao e configurao206Funo Datepicker. 1Essa funo responsvel por mostrar um calendrio para o usurio, as informaes do dia selecionado pelo usurio, poder diretamente ser alterado em uma caixa de texto, oferecendo estilo e poupando o usurio de ter que digitar uma data manualmente.Sua Sintaxe:$(elemento).datepicker();Funo Accordion. 1Essa funo responsvel por segmentar contedos de forma mais elegante, podemos mostrar um contedo selecionado ocultando os outros contedos que tiverem dentro dessa camada. Sua Sintaxe e descrita da seguinte forma:$(elemento).accordion();Funo Tabs 1Essa funo uma outra forma elegante de organizar o contedo de uma pgina WEB atravs de abas por link para visualizao de contedo de forma dinmicas.

$(elemento).tabs();Funo Menu 1Esta funo responsvel por montar um Menu DropDown de forma mais simples e elegante usando apenas listas e links como referencia.

$(elemento).menu();Funo Tooltip 1Essa funo responsvel por indicar ao usurios alguma informao relevante para o preenchimento de algum dado do formulrio. Esse mtodo j existe usando apenas o HTML, porm o Jquery pode tornar esse recurso mais elegante.

$(elemento).tooltip();