JavaScript
É uma linguagem case sensitivy ( Maisculas e minusculas importam na hora de escrever o código.
mModulo A
Aula 01
O que o Java Script é capaz de fazer?
Aula 01 O que o Java Script é capaz de fazer? Foi feito mostrado alguns exemplos no site do google do que o javascript é capaz de fazer mudança da cor do backgroundlogo ficar em preto e branco fazer o logo do google sumir.Cliente x ServidorNos somos o cliente que consome o conteudo que está na internetO servidor é aonde as aplicações ficam armazenadas.JavaScript surgiu para ser como uma tecnologia para clientes . Hoje ele serve também até para servidores.JavaScript é uma tecnologia Client-side.Um site é composto por 03 tecnologias do lado do cliente.HTML - Hyper text Markut language - Linguagem de Marcação. (Conteúdo)CSS - Cascating Style Sheet - Folhas de Estilos JavaScript - Responsável pela interação.
f1Aula 02
Como Chegamos até aqui.
Aula 2 – Como chegamos até aqui?Segue o Link do Site.https://youtu.be/rUTKomc2gG8A internet foi criada em 1970 durante a guerra fria.Darpa - tecnologia Militar (criar uma rede para proteger os dados militares) - Rede ARPANETA ARPANET com seu crescimento teve seu nome mudado para a INTERNET.em 1993 Tim Bern lee. surgiu então o html e protocolo http e tambem a word wibe web "www". e nos Estados Unidos foi criado o primeiro navegador o Mosaic 1994 - foi fundada a Nestcape - Navegador mais famoso no momento dentro dela foi criado um grupo chamado mozila.1995 - Foi criado a linguagem Java e com o sucesso do Java foi criado a linguagem JavaScript por causa da fama do Java. Microsoft em 1995 lançou o Internet Explorer e também criou uma linguagem também jamada jscript1997 - a NETSCPAPE fez a padronização do JavaScript com a ECMA ECMASCRIPT É A LINGUAGEM JAVASCRIPT Padronizada.2002 - foi criado a fundação mozila Firefox.2008 - google criou o chorme.2009 - foi criado o motor do navegador que roda o JavaScript. 2010 - foi criado o NodeJs que é uma maquina que roda o JavaScript fora do navegaqdor.ECAMSCRIPT surgiu em 1997 versão 1.01998 versão 2.01999 versão 3.02009 surgiu a versao ES5.2015 surgiu a versão ES6.2016 Surgiu o ES2016.2017 surgiu o ES2017.2018 surgiu o ES2018.Você sabe qual foi a empresa a criar o JavaScript? Sabe qual é a diferença entre as linguagens Java e JavaScript?1995 - Foi criado a linguagem Java e com o sucesso do Java foi criado a linguagem JavaScript por causa da fama do Java. Sabe qual é a relação que existe entre as linguagens JavaScript e ECMAScript? 1997 - a NETSCPAPE fez a padronização do JavaScript com a ECMA ECMASCRIPT É A LINGUAGEM JAVASCRIPT Padronizada.Sabia que, por exemplo, o programa usado para acessar WhatsApp no computador é feito em JavaScript?Electron
Aula 03
Dando os primeiros passos
Aula 3 – Dando os primeiros passosQuais são os melhores livros de JavaScript em Português?JavaScript o guia definitivo. (Editora ORELLY)JavaScript o guia do Programador. (Editora Novatec) - (do Mauricio sami e Silva) Onde ter acesso à documentação oficial do JavaScript em Português e Inglês?Temos o guia de Referencia da Mozila.https://developer.mozilla.org/pt-BR/docs/Web/JavaScriptTemos também o guia de referencia da ECMA. https://www.ecma-international.org/publications-and-standards/standards/ecma-262/ Quais são os requisitos de software para aprender a programar em JavaScript?Maquina com configuração básica Qual é o melhor editor para códigos JavaScript? VscodeInstalação das Ferramentas VScodehttps://code.visualstudio.com/downloadComo instalar o Node.js no seu computador? https://nodejs.org/en/Como configurar o Node.js? Para aprender JavaScript, é realmente necessário saber muito Inglês?Não instalação Básica.Você está precisando de dicas para estudar e aprender de verdade?Segue o Link do videohttps://youtu.be/FdePtO5JSd0
aAula 04
Criando seu primeiro Script
Aula 4 – Criando o seu primeiro scriptSegue o link do videohttps://youtu.be/OmmJBfcMJA8Você já sabe diferenciar dentro do seu código, os trechos em HTML5, em CSS3 e em JavaScript? Sim. Sabe organizar as pastas do seu projeto dentro do Visual Studio Code? Sabe como testar se o Node.js está devidamente instalado? Já sabe utilizar os comandos alert, confirm e prompt do JavaScript?
Modulo B
Aula 05
Variáveis e Tipos Primitivos
(Data types ou Tipo de Dados)
Como fazer um comentário dentro de um arquiro de Java Script ?Temos 2 modos de fazer isso colocando duas barras (//----- ) os traçõs são para simbolizar os comentários.colocando /*----- */ os traçõs são para simbolizar os comentários.//------ serve para colocar um comentário em uma unica linha. /*----- */ - serve para colocar um comentário em bloco.DEPURAÇÃO = É VER COMO MEU PROGRAMA ESTÁ FUNCIONANDO.para abrir o terminal dentro do vscode podemos usar o atalho de teclado CONTROL + SHIFT + (') CRASE.dentro do terminal com o NODE aberto no terminal para sair do NODE E VOLTAR para o terminal usamos o comando .exite para sair de dentro do terminal usar o comando exit
=
O simbolo de = no JavaScript deve ser lembrado como Recebe. Isso significa que alguma coisa está recebendo outra
null
a palavra null significa que aquela determinada coisa ira ficar nula, ela não pode receber nada.
var (ou) let
Variavel let Serve parta criar uma variável no Javascriptatenção para cirar uma variável usamos o comando var ou let let nome = 'Emmanuel' let - comando nome = descrição atribuito a variavel= (recebe)'Emmanuel' (é o valor que a variavel nome ira receber e deve sempre ser escrito com ' aspas ' entre o valor ou pode ser " as duplas " ) para mudar o valor que foi definido dentro dessa variável usar apenas o comando.nome = 'Alemão' nome = descrição atribuito a variavel= (recebe)'Alemão' (é o valor que a variavel nome ira receber e deve sempre ser escrito com ' aspas ' entre o valor ou podenome = ser " as duplas " ) para fazer uma soma de variaveis é só escrever as descrições e o valor de + entre elas Exemplo:let n1 = 8 atribuimos a descrição n1 o valor de 8let n2 = 5 atribuimos a descrição n2 o valor de 5n1 + n2 >13 soma das variáveis é igual a 13 pois ele está somando as variáveis que são classificadas como tipo - numero. ATENÇÃO AO CRIAR AS VARIAVEIS na sua descrição (maisculas e minusculas fazem a diferença. let a = '10' let A = '20' Aqui temos um exemplo de duas variaveis com a mesma descrição porém são variáveis diferentes.MUITO UMPORTANTECRIAR NOMES COERENTES!!!!!ao criar um variavel se colocarmos valores e colocarmos as apas ' ' simples ou duplas ele não será reconhecido como um numero . ele será reconhecido como uma string!!!!
Atribuição
E a ação de incluir ou acrescentar um valor a alguma variável
Identificador
Identificador é o nome usado para identificar uma variável ( ele tem algumas regras )Eles podem começar com :uma letra (a)um Cifrão ($)ou um sublinhado ou anderline ( _ ) pode usar letras ou numeros (s1)pode utilizar acentos e simbolosEles não podem começar com:números (1)não pode conter espaços ( casa grande)não pode ser palavras reservadas (que o JavaScript já utiliza - (alert)na criação de variável (maiscula e n=minuscula faz diferença )atenção ao criar. tente usar nomes coerrentes para a criação de variáveis
Tipos Primitivos de Dados
Tipos Primitivos Primordiais
Number
Number = Definição de numeros em JavaScript
number - integer
integer = seria um numero inteiro.
boolean
Bolean é os resultados atribuidos a funções criadas no JavaScriptVeradeiro (true)Falso(false)
number - float
infinit
NaN
NaN = not in Number
String
String É o nome dado a uma cadeia de caracteres.Existe três fromas de delimitar uma String dentro do JavaScript As Aspas Duplas " "As Aspas simples ' 'E a craze ´ ´
undefined
indefinido
object
Array
null
function
seria uma função ou funcionalidade dada aquela coisa ou objeto.
typeof
typeof É um comando usado no JavaScript para a verificação de uma String qual é o tipo daquela String Exemplo:Welcome to Node.js v18.12.1. Type ".help" for more information. > var n = 200 undefined > n 200 > typeof n 'number' > n = 'Google' 'Google' > typeof n 'string' > typeof 6.5 'number' > typeof '6.5'// nuemro entre aspas '6.5' se torna uma string 'string' > typeof [] 'object' > typeof {} 'object' > typeof function(){} 'function' > typeof undefined 'undefined' > typeoff NaN 'number' >typeoff Infinity 'number' > typeof null // para o JavaScript ele é um objecto. 'object'
Aula 06
Tratamento de dados
ex02
Variáveis Vamos Criar uma variavelExemplo:var nome = window.prompt ('Qual é o seu nome') var ou let (comando usado para a criação da vairável nome ( identificador da variável window.prompt ( comando dado no JavaScript para a solicitação de inclusão de um dado no JavaScript Qual é o seu nome (Valor que irá aparecer dentro do Prompt)Obs: o valor inserido dentro do prompt será adiciondo a variavel (nome) - nesse Exemplodepois ...fizemos a inclusão de mais um comando para aparecer uma mensagem após a inclusão do nome inserido no Promptwindow.alert('É um prazer em te conhecer' + nome) window.alert (serve para enviar uma alerta ao usuário('É um prazer em te conhecer' ) - É o valor atribuido ao alerta para ser informado ao usuario.sinal de ( + ) nesse caso é é uma concatenação (ele faz a junção do alert. mais a palavra inserida no prompt )nome (ira aparecer o valor criado na variavel)
ex03
Exercicio 03 Vamos agora fazer a inclusão de numeros ao inves de nomes.var = n1 = window.prompt('Digite um numero: ') var (variável)n1 = Identidicador da variável window.prompt ( local aonde ira ficar armazenado o valor da variável )Digite um numero ( valor de exibição do Prompt para o ususário Vamos criar outra variável var = n2 = window.prompt('Digite um numero: ') var (variável)n2 = Identidicador da variável window.prompt ( local aonde ira ficar armazenado o valor da variável )Digite um numero ( valor de exibição do Prompt para o ususário Vamos solicitar a soma dos valores (atraves do comando)var s = n1 + n2 var (variável) ( + ) ira fazer a concatenação dos valores s = Identidicador da variável n1 = Identidicador da variável n2 = Identidicador da variável Vamos solicitar a apresentação da concatenção dos valores (atraves do comando)window.alert(' A soma dos valores é ' + s ) window.alert ( comando para exibir um alerta ao usuario )' A soma dos Valores é ' ( o texto que sera exibido dentro do Prompt para o ususario)( + ) ira fazer a concatenação dos valores (s) variavel (aonde consta a soma dos valores n1 + n2)O comando window.prompt tem uma caracteristica se voltar como valor de Strinng Para fazer a conversão de uma string para um valor inteiro vamos utlizar o comando Number.parseIntSegue Exemplo: var n1 = Number.parseInt(window.prompt('Digite um numnero: ')) Number.parseInt = comando para convertert uma string em NumeroTemos que colocar um parentes antes do prompt e depois no final.var n2 = Number.parseInt(window.prompt('Digite outro numero: ')) Number.parseInt = comando para convertert uma string em NumeroTemos que colocar um parentes antes do prompt e depois no final.var s = n1 + n2 window.alert('A soma dos valores é :' + s)Agora o valor Apresentado no alert é a soma dos valores. e não a concatenação das StringsIMPORTANTE Nesse modo ele faz a soma de nuimeros inteiros, se colocar numeros fracioanados a soma vai aparecer de forma incorreta. para numeros fracionados temos o comando Number.parseFloatAtualizaçãoAgora podemos somente colocar Number que o JavaScript identifica se são numeros inteiros ou fracionados e já faz a conversão. Exemplo:var n1 = Number(window.prompt("Digite um numero fracionado de 0 á 10:"));var n2 = Number(window.prompt("Digite agora um numero de 10 a 20:"));var s = n1 + n2;window.alert("A nossa querida soma dos valores são :" + s);IMPORTANTE OS NUMEROS FRACIONADOS TEM QUE SER DIGITADOS COM (.) SE FOR DIGITADO COM (,) ELE APRESENTA UM ERRO.Exemplo: 2.5
Conversões de Tipo
Conversão de tipos seria converter :String mudar para NumberNumber mudar para StringExercicio 03 Vamos agora fazer a inclusão de numeros ao inves de nomes.var = n1 = window.prompt('Digite um numero: ') var (variável)n1 = Identidicador da variável window.prompt ( local aonde ira ficar armazenado o valor da variável )Digite um numero ( valor de exibição do Prompt para o ususário Vamos criar outra variável var = n2 = window.prompt('Digite um numero: ') var (variável)n2 = Identidicador da variável window.prompt ( local aonde ira ficar armazenado o valor da variável )Digite um numero ( valor de exibição do Prompt para o ususário Vamos solicitar a soma dos valores (atraves do comando)var s = n1 + n2 var (variável) ( + ) ira fazer a concatenação dos valores s = Identidicador da variável n1 = Identidicador da variável n2 = Identidicador da variável Vamos solicitar a apresentação da concatenção dos valores (atraves do comando)window.alert(' A soma dos valores é ' + s ) window.alert ( comando para exibir um alerta ao usuario )' A soma dos Valores é ' ( o texto que sera exibido dentro do Prompt para o ususario)( + ) ira fazer a concatenação dos valores (s) variavel (aonde consta a soma dos valores n1 + n2)O comando window.prompt tem uma caracteristica se voltar como valor de Strinng Para fazer a conversão de uma string para um valor inteiro vamos utlizar o comando Number.parseIntSegue Exemplo: var n1 = Number.parseInt(window.prompt('Digite um numnero: ')) Number.parseInt = comando para convertert uma string em NumeroTemos que colocar um parentes antes do prompt e depois no final.var n2 = Number.parseInt(window.prompt('Digite outro numero: ')) Number.parseInt = comando para convertert uma string em NumeroTemos que colocar um parentes antes do prompt e depois no final.var s = n1 + n2 window.alert('A soma dos valores é :' + s)Agora o valor Apresentado no alert é a soma dos valores. e não a concatenação das StringsIMPORTANTE Nesse modo ele faz a soma de nuimeros inteiros, se colocar numeros fracioanados a soma vai aparecer de forma incorreta. para numeros fracionados temos o comando Number.parseFloatAtualizaçãoAgora podemos somente colocar Number que o JavaScript identifica se são numeros inteiros ou fracionados e já faz a conversão. Exemplo:var n1 = Number(window.prompt("Digite um numero fracionado de 0 á 10:"));var n2 = Number(window.prompt("Digite agora um numero de 10 a 20:"));var s = n1 + n2;window.alert("A nossa querida soma dos valores são :" + s);IMPORTANTE OS NUMEROS FRACIONADOS TEM QUE SER DIGITADOS COM (.) SE FOR DIGITADO COM (,) ELE APRESENTA UM ERROExemplo: 2.5
String para Number
Number.parseInt(n)
Ele irá fazer a conversão de um numero para um numero Inteiro:Segue Exemplo abaixo:var n1 = Number.parseInt(window.prompt("Digite um numero fracionado de 0 á 10:"));var n2 = Number.parseInt(window.prompt("Digite agora um numero de 10 a 20:"));var s = n1 + n2;Aqui nesse caso se digitarmos numeros fracionados o JavaScript convertera as variáveis n1 e n2 para numeros Inteiros.
Number.parseFloat(n)
Esse comando ira fazer a conversão de um numero para um numero com (.) ou numero decimal Exemplo: 2.5 5var n1 = Number.parseFloat(window.prompt("Digite um numero fracionado de 0 á 10:"));var n2 = Number.parseFloat(window.prompt("Digite agora um numero de 10 a 20:"));var s = n1 + n2;O resultado sera 7.5 IMPORTANTE TEMOS SEMPRE QUE USAR (.) NÃO PODEMOS DIGITAR (,)
Number para String
String(n)
No exemplo abaixo estamos convertendo a variável s para uma String .com a função String(n)n = sera o valor da variavel que é um numero e sera convertido para a String. window.alert("A nossa querida soma dos valores são :" + String(s));IMPORTANTE TEM QUE TER UM PARENTESES PARA FECHAR A EXPRESÃO.
n.toString
n.toString ( )o (n) será a variavel que queremos converter para String que no nosso caso é a variavel s Exemplo:var s = n1 + n2;Segue Exemplo.window.alert("A nossa querida soma dos valores são :" + s.toString());
Formatando uma String
Formatando uma String Usando o Node.jsNesse exemplo vamos criar uma variavel (s) que recebera o valor de (JavaScript) para que ele informe o que estamos estudando é preciso dar o seguinte comando :Welcome to Node.js v18.12.1.Type ".help" for more information.> var s = 'JavaScript'undefined > s'JavaScript' // vaor atribuido a (s) > 'Eu estou estundado ' + s // Times que fazer uma contatenação para que o JavaScript nos mostre a fraze de forma correta. 'Eu estou estundado JavaScript'>Outro Exemplo com a criação de 03 variáveis e queremos que o JavaScript nos mostre a frase de forma correta > var nome = EmmanuelUncaught ReferenceError: Emmanuel is not defined> var nome =' Emmanuel 'undefined> var idade = 43undefined> nota = 5.55.5> 'O Aluno' + nome + 'com ' + idade + ' anos tirou a nota' + nota'O Aluno Emmanuel com 43 anos tirou a nota5.5'(+) está fazendo a concatenação ou a junção para a construção da frase.nome = variavel (string)idade = variavel (string)nota = variavel (string)
Template Strings
${s} ` (é o que chamaos de (placehouder) Iremos fazer a mesma junção das String agora de um jeito mais fácil > var nome =' Emmanuel 'undefined> var idade = 43undefined> nota = 5.55.5> 'O Aluno' + nome + 'com ' + idade + ' anos tirou a nota' + nota'O Aluno Emmanuel com 43 anos tirou a nota5.5'> `O Aluno ${nome}com ${idade} anos tirou a nota ${nota}`'O Aluno Emmanuel com 43 anos tirou a nota 5.5'>Nesse Exemplo: Usamos a Templeta String ( novidade )$ faz a junção das Strings a frase nome = Variável ou Stringidade = Variável ou Stringnota = Variável ou StringExemplos no Nodejs> nome'Maria'> idade = 4343> profisão = RecepcionistaUncaught ReferenceError: Recepcionista is not defined> profisao = 'Recepcionista''Recepcionista'> `A minha esposa ${nome} que tem a idade de ${idade} anos, tem a Profissão de ${profisao}`'A minha esposa Maria que tem a idade de 43 anos, tem a Profissão de Recepcionista'> nome = 'Everton''Everton'> familia = 'irmão''irmão'> profisao = 'Diretor Hospitlar''Diretor Hospitlar'> ` A pessoa chamada ${nome} que tem a idade de ${idade} anos, ele é meu ${familia} e a profisão dele é ${profisao}` ' A pessoa chamada Everton que tem a idade de 43 anos, ele é meu irmão e a profisão dele é Diretor Hospitlar'Exemplo: <script> var n1 = Number(window.prompt('Digite um numnero: ')) // Nesse caso estamos fazendo a conversão de n1 para Number var n2 = Number(window.prompt('Digite outro numero: ')) // Aqui também estamos fazendo a converesao de n2 para Number var s = n1 + n2 window.alert(`A soma entree ${n1} e ${n2} é igual a ${s}`) // nesse caso o + faz a concatenação dos valores // ( number + number ) o sinal de (+) pode servir para a operação de adição (somar) // ( string + string ) o sinal de (+) pode servir também para a contaneção (junção dos Valores) </script>
s.lenght
s.lenght Esse comando serve para informar o tamanho da String (quantos caracteres essa string possui)Vamos a um exemplo aonde é feito a soma dos caracteres e a tranformação do texto em MAISUCULAS <script> var nome = window.prompt('Qual é o seu nome') document.write(`Olá, <strong> ${nome}</strong>! Seu nome tem ${nome.length} letras. </br>`) document.write(`Seu nome em maisuculas é ${nome.toUpperCase()}`) </script>document.write (exibe o resultado dentro da página HTML.<strong> - comando HTML ( deixa o texto em Negrito )nome.lenght (comando que faz a contagem de caracters dentro da string)nome.toUpperCase() - esse comando tranforma o texto dentro da string(nome) todas as letras em MAIUSCULAS.
s.toUpperCase()
s.toUpperCase( )obs: atenção com a forma de escrita aonde tiver letras maisuculas Esse comando serve para que as letras dentro de uma string fiquem com todas as letras maiusculasVamos a um exemplo aonde é feito a soma dos caracteres e a tranformação do texto em MAISUCULAS <script> var nome = window.prompt('Qual é o seu nome') document.write(`Olá, <strong> ${nome}</strong>! Seu nome tem ${nome.length} letras. </br>`) document.write(`Seu nome em maisuculas é ${nome.toUpperCase()}`) </script>document.write (exibe o resultado dentro da página HTML.<strong> - comando HTML ( deixa o texto em Negrito )nome.lenght (comando que faz a contagem de caracters dentro da string)nome.toUpperCase() - esse comando tranforma o texto dentro da string(nome) todas as letras em MAIUSCULAS.
s.toLowerCase()
s.toLowerCase( )obs: atenção com a forma de escrita aonde tiver letras maisuculas Esse comando serve para que as letras dentro de uma string fiquem com todas as letras Minusculas
document.write
document.writeEsse comando ao inves de exibir o resultadpo dentro da caixa box, ELE EXIBE O RESULTADO DENTRO DA PAGINA HTMLVamos a um exemplo aonde é feito a soma dos caracteres e a tranformação do texto em MAISUCULAS <script> var nome = window.prompt('Qual é o seu nome') document.write(`Olá, <strong> ${nome}</strong>! Seu nome tem ${nome.length} letras. </br>`) document.write(`Seu nome em maisuculas é ${nome.toUpperCase()}`) </script>document.write (exibe o resultado dentro da página HTML.<strong> - comando HTML ( deixa o texto em Negrito )nome.lenght (comando que faz a contagem de caracters dentro da string)nome.toUpperCase() - esse comando tranforma o texto dentro da string(nome) todas as letras em MAIUSCULAS.
Formatando Números
to.Fixed( )
to.Fixed( )Esse comando serve para acrescentar casas decimaisExemplo no Nodejs:> var n1 = 1545.5undefined> n11545.5> n1.toFixed(2)'1545.50'>Ele fez a inclusão do zero ( 0 ) apos o (5) '1545.50'() o valor dentro do parentese é a quantidade de decimal que terá depois do (.)Confrome Exemplo Abaixo:> var n1 = 1545.5undefined> n11545.5> n1.toFixed(2)'1545.50'> n1.toFixed(3)'1545.500'> n1.toFixed(4)'1545.5000'>Vamos agora trocar o ponto ( . ) para uma virgula ( , )Segue o Exemplo Abaixo: > var n1 = 1545.5undefined> n11545.5> n1.toFixed(2)'1545.50'> n1.toFixed(3)'1545.500'> n1.toFixed(4)'1545.5000'> n1.toFixed(2).replace( ' . ' , ' , ' )'1545,50'>
.replace( )
.replace( )Vamos agora trocar o ponto ( . ) para uma virgula ( , )Segue o Exemplo Abaixo: > var n1 = 1545.5undefined> n11545.5> n1.toFixed(2)'1545.50'> n1.toFixed(3)'1545.500'> n1.toFixed(4)'1545.5000'> n1.toFixed(2).replace( ' . ' , ' , ' )'1545,50'>
.tolocaleString('pr-BR', {Style: 'currency' , currency: 'BRL' })
.tolocaleString('pr-BR', {Style: 'currency' , currency: 'BRL' })Esse comando tranforma o valor da string para aparecer em valor de moeda R$tolocalestring (sgnifica uma String que exibe uma localidade (um Pais) entre chaves estamos colocando os atributos {Style: 'currency' , currency: 'BRL' }currency (dinherio)BRL (moeda)Segue Exemplo Abaixo: > n1.tolocaleString('pt-BR', {style: 'currency', currency: 'BRL'})> n1.toLocaleString('pt-BR', {style: 'currency', currency: 'BRL' })'R$ 1.545,50'Nesse Exemplo foi incluido o simbola da nossa moeda Brasaileira o (R$).Uncaught SyntaxError: Unexpected token ')'> n2.toLocaleString('pt-BR', {style: 'currency', currency: 'BRL'})'R$ 3.500,00'>> n3.toLocaleString('pr-BR', {style: 'currency', currency: 'BRl'})'R$ 1.750,00'>> n4.toLocaleString('pt-BR', {style: 'currency', currency: 'BRL'})'R$ 10.550,00'>> n5.toLocaleString('pt-BR', {style: 'currency', currency: 'BRL'})'R$ 1,50'>> n7.toLocaleString('pt-BR', {style: 'currency', currency: 'BRL'})'R$ 10.230,00'>
ex03-part2
Iremos fazer a conversão das Strings do exercicio anterior para numeros atráves dos comandosvar n1 = Number.parseInt(window.prompt('Digite seu numero: ')) // obs: tem que ter pois paresenteses no final var n2 = Number.parseInt(window.prompt( Digite outro numero: )) // obs: tem que ter pois paresenteses no final <script> var n1 = Number.parseInt(window.prompt('Digite um numnero: ')) // String var n2 = Number.parseInt(window.prompt('Digite outro numnero: ')) // String var s = n1 + n2 window.alert('A soma dos Valores é : ' + s) // nesse caso o + faz a concatenação dos valores // ( number + number ) o sinal de (+) pode servir para a operação de adição (somar) // ( string + string ) o sinal de (+) pode servir também para a contaneção (junção dos Valores) </script>Iremos agora fazer a conversão para ele somar numeros decimaisvar n1 = Number.parseFloat(window.prompt('Digite seu numero: ')) // obs: tem que ter pois paresenteses no final var n2 = Number.parseFloat(window.prompt( Digite outro numero: )) // obs: tem que ter pois paresenteses no final <script> var n1 = Number.parseFloat(window.prompt('Digite um numnero: ')) // String var n2 = Number.parseFloat(window.prompt('Digite outro numnero: ')) // String var s = n1 + n2 window.alert('A soma dos Valores é : ' + s) // nesse caso o + faz a concatenação dos valores // ( number + number ) o sinal de (+) pode servir para a operação de adição (somar) // ( string + string ) o sinal de (+) pode servir também para a contaneção (junção dos Valores) </script>Na nossa atualidade usamos o comando Number o JavaScript vai definir se é um numero interiro ou um numero decimal.
ex004
Aula 07
Operadores do JavaScript
part 1
Aula 7 – Operadores (Parte1)Segue o Link do Video:https://youtu.be/hZG9ODUdxHoFamilia de OperadoresaritméticosatribuiçãorelacionaislógicosternárioNessa Aula parte 1 vamos focar nos operadores aritméticos e operadores de atribuição.
Operadores
Aritméticos
São todos os operadores aritméticos:Todos esses são operadres Binários significa que precisa de 02 operando+ -*/%**Todos os operadores precisão de operando que são aqueles que vão fazer os operadores Funcionarem.(Operando) são os numeros antes dos operadores)Exemplo 5 + 2 = 75 - 2 = 35 * 2 = 105 / 2 = 55 % 2 = 1 // resto da divisão.5 ** 2 = 25 // potência. Quando uma expresão tiver uma soma ( + ) e uma divisão( / ) na mesma expresão o calculo que é feito primeiro é o calculo da divisão ( / )Exemplo: fazer a conta de divisãoFazer a conta de soma 5 + 3 / 2 = 6.5executando no node.js> 5 +27> 9 % 21> 9 / 24.5> 5 + 3 / 26.5>Para fazer o calculo executando a soma primeiro tem que colocar os valores de soma em parentesesExemplo:Exemplo: Fazer a conta de soma fazer a conta de divisão (5 + 3) / 2 = 4
Ordem de
Precendencias dos Operadores
Ordem de Precedência dos Operadores. ( ) é calculado os paretenses ** é calculado as potências (*)multiplicação (/) divisão (%) resto da divisão ( + ) somas ( - ) subtrações.obs: se tiver os 3 no mesmo calculo é feito na sequência da Esquerda para a Direita. a ser calculado Exemplos : var a = 5 + 3 Resultado -- 8var b = a % 5 Resultado -- 3var c = 5 * b ** 2 Resultado -- 45var d = 10 - a / 2 Resultado -- 6var e = 6 * 2 / d Resultado -- 2var f = b % e + 4 / e Resultado -- 3 a var f foi calculado primeiro o calculo da esquerda depois o calculo da direita.Exemplo em Nodejs> var a = 5 + 3 undefined > a 8 > var b = a % 5 undefined > b 3 > var c = 5 * b ** 2 undefined > c 45 > var d = 10 - a / 2 undefined > d 6 > var e = 6 * 2 / d undefined > e 2 > var f = b % e + 4 / e undefined > f 3
Auto Atribuições
Auto atribuição é atribuir um valor novo a uma variavél atraves de uma atribuição Exemplo: var n = 3 > 3 n = n + 4 > 7 n = n - 5 > 2 n = n * 4 > 8 n = n / 2 > 4 n = n ** 2 > 16 n = n % 5 > 1 Um exemplo de simplicação desse soma é Exemplo n = n + 4 pode ser mudada para n += 4 só pode ser feito desse jeito de o n receber o valor dele mesmo. Segue exemplo de simplificaçãon += 4 n-= 5 n *= 4 n /= 2 n **= 2 n %= 5 Vamos fazer um exemplo no Nodejs > var num = 8 undefined > num 8 > num += 2 10 > num 10 > num %= 2 0 > num = 3 3 > num **= 2 9 >
Operadores de Incremento
Operadores de Incremento: vamos rever algumas operações antes disso var x = 5 > 5 x = x + 1 > 6 x = x - 1 > 5 Simplificando x += 1 x -=1 Incremento: x =+ 1 se transforma em : x ++ x = x - 1 se Trasnforma em : x-- Exemplos em Nodejs> var n = 10 undefined > n++ 10 > n 11 > n-- 11 > n 10 > n 10 Pré - Enquemento ( significa que mudamos a ordem colocando os atributos ++ ou - - antes da variável > ++n 11 > --n 10 >
Aula 08
Operadores do JavaScript
part 2
Aula 8 – Operadores (Parte 2)Você já conhece os operadores relacionais e os operadores lógicos em JavaScript? Sabe a diferença entre usar = ou == ou === em JavaScript? Conhece a ordem de precedência dos operadores do JavaScript? Sabe como usar o operador ternário para atribuições em JavaScript?Segue o Link do video:https://youtu.be/BP63NhITvao
Operadores
relacionais
Os Operadores relacionas do JavaScript são os operadores relacionais na grande maioria da programaçãosão ele : > (maior que)< (menor que)>= ( maior igual)<= ( menor igual) == ( igual)!= ( diferente)5 > 2 Resultado Verdadeiro (true)7 < 4 Resultado Falso (false) 8 >= 8 Resultado Verdadeiro (true)9 <= 7 Resultado Falso (false)5 == 5 Resultado Verdadeiro (true)4 != 4 Resultado Falso (false)Segue Exemplos feitos no NodeJs.> 5 > 2 true > 8 < 4 false > var a = 8 undefined > var b = 15 undefined > a > b false > a <= b - 10 false > a == b false > a != b true > Exemplos de Reais preço >= 200,50 // o preço é maior oi igual a 200.50 ? idade < 18 // a idade é menor do que 18curso == 'JavaScript' // o curso é JavaScript ?n1 != n2 // o primeiro numero é diferente do segundo
Operadores
Identidades
Exemplo :vamos as seguintes expresões: 5 == 5 resultado true 5 == '5` resultado true ( o sinal de igualdade (==) ele não testa o tipo sendo que o valor do inicio é um valor inteiro e o valor apos == é um valor de string. O que o javaScript faz é analisar se o 1° (numero 5) tem o mesmo valor que o 2° (numero 5 ). são valores diferentes porem eles tem a mesma grandeza. valor de Indentidade também é conhecido como operador de igualdade restrita. Exemplo: 5 === '5` resultado (false)=== ( é chamado como identico)Nesse caso o JavaScript está testando se os dois valores sã valores identicos ( é o mesmo valor e do mesmo tipo)5 === 5 resultado (true)Fazendo alguns exemplos no NodeJs > 5 == '5' true > > var x = 5 undefined > x 5 > var y = '5' undefined > y '5' > typeof x 'number' > typeof y 'string' > x == y true > x === y false > x != y false Essa ultima expresão (!==) é chamada de desigualrestrito (ela verifica se são de tipos diferentes. > x !== y true >
Operadores
Lógicos
Operadores Lógicos ! quer dizer (negação)&& quer dizer (conjunção) chamamos de (e) || quer dizer (disjunção) chamamos de (ou)Uma Curiosidade. (||) é chamado de pipe ! (o não) ele é tratado como um operador unário isso significa que ele so tem um operando. ! pode ter (true) ou (false) vamos agora para o operador de conjunção && ele é um operador binário signifca que pode ter 02 valores logicos um de cada lado true && true resultado truetrue && false resultado falsefalse && true resultado falsefalse && false resultado falsenessa condição so é verdadeiro se as 02 forem verdadeiras || ele também é um operador binário signifca que pode ter 02 valores logicos um de cada lado true || true resultado truetrue || false resultado truefalse || true resultado truefalse || false resultado falseBasta que apenas um deles seja verdadeiro que que eles sejam considerados como verdadeiro Vamos fazer alguns exercicios no NodeJs> var a = 5 undefined > var b = 8 undefined > true && false false > true && true true > false || false false > true || false true Quando tivermos :Operadores aritmeticosOperadores relacionais Operadores logicos Na mesma questãoele ira seguir a seguinte seguencia ira fazer o calculo de todos os operadores aritméticosira fazer o calculo de todos os operadores relacionas ira fazer os operadores lógicos > a > b && b % 2 == 0 false > Outro exemplo Nesse exemplo temos operadorres Aritméticos, relacionais e logicos na mesma expressão. é feito nessa ordem todos os opeeradores aritméticos b % 2 == 0 (seria a variaverl b que é o numero 8 o resto da sua divisão que seria o resultado 0 ai ele pergunta 0 ==0 (true)agora fazemos o relacional a > b (seria a variável a que é 5 e avariavel b que é 8 o resultado é (false)agora faremos o calculo logico que é (true) && (false) = false> a <= b || b / 2 == 2 true > Vamos fazer os operadores aritémticosb / 2 ( 8/2 == 2 ) falsea <=b (5 <=8) = true false || (ou) veradeiro Resultado = true e se na mesma expresão eu tiver um && (e) um não (!) e um ou (||)a seguência de calculos é : ! quer dizer (negação)&& quer dizer (conjunção) chamamos de (e) || quer dizer (disjunção) chamamos de (ou)
Precedencia
Operadores Aritméticos ( ) ** / ...Operadores Relacionais > < >= ... Não tendo oredem de precedência sendo feito o que aparecer primeiro sendo da esquerda para a direita.Operradores Lógicos que tem uma ordem de precedência !&&||
ternários
Operadores ternários são operadores com o simbolo ? :Ele se chamo ternário por ter 03 partes ele junta 03 operanos teste ? true : false Vamos ver um exemplo prático :média >=7 ? "aprovado" : "reprovado"Vamos fazer um teste no node.jsPS C:\Users\olive> nodeWelcome to Node.js v18.12.1.Type ".help" for more information.> var média = 5.5undefined> média > 7false> média > 7 ?' APROVADO' : 'REPROVADO''REPROVADO'> média +=38.5> média > 7 ? 'APROVADO' : 'REPROVADO''APROVADO'>Outro Exemplo:> var x = 8undefined> var res = x % 2 == 0 ? 5: 9Aqui nessa expresão estamos perguntado se ? a variavel res vai receber ou 5 ou 9 (vai depender se x % 2 for igual a 0 )vamos fazer os operadores aritméticos ( x % 2 = 8 resto de divisão por 2) = 0 0 == 0 (true) se for veradade é atribuido a variavel res o numero 5se o Resultado fosse false seria atribuito a var res o numero 9undefined> res5>> var idade = 19undefined> var r = idade >= 18 ? 'MAIOR' : 'MENOR'undefined> r'MAIOR'>Nesse outro exemplo defenimos o valor da variável r = 19E fizemos a seguinte expresão :> var r = idade >= 18 ? 'MAIOR' : 'MENOR'Significa que se a idade for maior ou igual que 18 irá aparecer MAIOR e se a idade fosse menor que 18 iria aparecer MENOR
Modulo C
Modulo DOMSignificado = Document Object Model - É a vertente web do JavaScript no qual a linguagem foi criada é uma poderosa ferramente que está dentro do seu navegador, um conjunto de objetos do JavaScript no tratamento de Componentes Visuais. (Para criarmos aplicações mais bonitas)Além de aprender o modulo DOM iremos aprender a fazer uma Arvore Dom so nossso Site.além de aprender a criar iremos aprender a manipular a estrutura de qualquer site da web.
Modulo D
Modulo E
Nesse modulo veremos todas as repetições da estrutura em javaScript.Estrutura de repetição com teste lógico no inicio (while)Estruturas de Repetição com teste no Final (dowile)Estruturas de Repetição com controle que é o (for)
13. Repetições em Java Script
ESTRUTURA while ( ENQUANTO) Exemplo de uma expressão sem while:function comerpizza( ){comerfatia( )comerfatia( )comerfatia( )comerfatia( )comerfatia( )comerfatia( )comerfatia( )comerfatia( )}A tarefá e partir de um ponto A e ir até um ponto BA Estrutura de controle mais simple de todas é a sequências.Quano existir desvios ou possibilidade é chamdo de condiçõesQuando testamos uma expressão se ele for verdadeiro ou falso se a condição for verdadeira ele não ira para a proxima estapa ela fará um loop e voltar isso é chamado de laço (enquanto a condição for verdadeira ele,continue fazendo o loop e voltando para o inicio).A partir do momento em que a condição for falsa o laço é quebrando e é seguido o fluxo natural. Como escrevemos isso em JavaScript ?"Enquanto uma coisa for verdade"em inglês essa palavra se chama while (condição)Exemplo de uma estrutura com while:(Estrutura de repetição com teste lógico no inicio). function comerpizza() { while (temfatia()){ comerFatia() } } Vamos ver agora o outro tipo de estrutura de repetição ( aonde primeiro nos executamos o bloco e depois fazemos o teste).Isso é uma Estrutura de repetição com teste lógico no finaldo = "faça" while = "enquanto"do { } while (condição)
14. Repetições parte 2
Iremos ver nessa Aula Estrutura de Repetição com variável de controle.Basicamente nessa Estrutura são feitas 03 coisas:InicializaçãoTeste logicoEncremento Na primeira passagem ele faz a inicalização e o teste logico.Sendo o teste logico = verdadeiro (true)ele ira executar o bloco, sendo que esse bloco poderá ter vários comandos.agora ele ira fazer o loop (como nas estruturas while e do while) e também ele irá fazer o encremento.o teste lógico será feito mais uma vez e a cada vez ele ira fazer um encremento.Quando o teste logico ficar falso (false) ele seguira o caminho de enceramento.Essa estrutura em Javascript ficara:for (inicio; teste; incr) { } Iremos ver um exemplo com um código usando a estrutura while.var c=1 while (c <= 10 ){ c++ } Iremos ver um exemplo desse código usando a estrutura forfor (var c=1; c <=10; c++) { Iremos agora fazer um teste prático.
Exercícios (parte 1)
Aqui nesse Aula foi criando 02 pastas dentro da Aula 14 pasta de numero ex016 e ex017 para a prática dos exercicios de contar numeros e da tábuada confome apresentado no video;
Exercicios (parte 2)
"IMPORTANTE" - Para cirar uma variável podemos usar os comandos:varletExemplos:let ini = document.getElementById('txti');let fim = document.getElementById('txtf');let passo = document.getElementById('txtp');Obs: Dentro dos parenteses podem ser usados aspas duplas ou simples.REFORÇO: A expressão eslse significa = SE NÃO" IMPORTANTE " - NUNCA FAZER TODO O JAVASCRIPT DE UMA VEZ, IR FAZENDO AOS POUCOS E FAZER TESTE PARA VER SE ELE ESTÁ FUNCIOANDO!
Exercício (parte 3)
Exercício parter 3 Iremos nesse exercício fazer o teste da tabuada.Foi criado a mesma estrutura que foi feita no exercício anteriror.Fizemos algumas modificações para que o arquivo se adeque a tabuada.foi escrito o código javascript.
Modulo F
Nesse modulo iremos ver :Array
15. Variáveis Compostas
Variáveis CompostasVamos entender as Diferenças em variáveis simples e variáveis compostas.variáveis simples ( só consegue armazenar um valor por vez; quando criamos uma variável com var ou let)variáveis compostas ( devem ser capazes de (armazenar vários valores em uma mesma estrutura). IMPORTANTE"- 'coloque nomes claros para a suas variáveis ou arrayCada variável composta tem um indíce que é a indicação de cada valor salvo dentro dela.Exemplo: vaga a = [ 0 , 1 , 2 ]cada espaço que está dentro dos [ ] recebe um número que chamamos de chave ou índice.a variável composta a é chamada de array (traduzindo para o português = vetor)o array é composto de elementos são um par que agrupa espaço da memoria valor colocado dentro dele indíce = 0, 1, 2 (pode ser chamado de chave ou key)e por ultimo o conteúdo de cada elemento.para acrescentar um valor dentro de array já criado em um determinado índice escrevemos o seguinte :num = [3] = 6 para acrescentar outro valor dentro de qualquer parte do array escrevemos o seguinte código:num.push (7)para saber o comprimento de um array escrevemos o seguinte código:num.lengthpara colocar os elemntos que já estão dentro de um array em ordem crescente escrevemos o código: num.sort()para mostrarmos na tela usando node.js o valor do array sem os [ ] digitamos o código:let valores = [8,1,7,4,2,9]console.log(valores)console.log(valores[0])console.log(valores[1])console.log(valores[2])console.log(valores[3])console.log(valores[4])console.log(valores[5])iremos agora escrever esse código de forma mais inteligente e simplificada.utilizando o for infor( ) in ( ) {console.log( )}Exemplo:for = quer dizer para in = dentro (em portugues = em)for(let pos=0; pos<num.length; pos++){console.log (num[pos])}for(let pos in num)para buscar valores dentro do vetor escrevemos o código:num.indexOf(7)(ele pesquisa dentro do array se tem o valor 7)quando colocarmos um valor para ele pesquisar e la dentro desse array o valor não existir ele ira retornar o valor de -1 (para o javascript significa que o valor requerido da pesquisa não existe)
16. Funções
Aula de funções Função = ( É um conjunto de tarefas que temos que fazer)Toda função precisa ter: uma chamada (exemplo: Comprar leite - Essa chamada nem sempre e escrita, pode ser também que ela seja automatizada) um parâmetro de entrada ( dinheiro, leite (são exemplos de parâmetros usados nesse caso.)uma ação ( todo o processo para fazer a compra do leite (como citado nesse exemplo) retorno ( o resultado dessa ação que seria voltar para casa e entregar o leite).Descrição de funções na programação:são ações executadas assim que são chamadas ou em decorrência de algum evento.Uma função pode receber parâmetros e retornar um resultadofunction acao (parâmetros ) {----------- = ação-----------return = (retorno do resultado}(parâmetro)vejo o Arquivo dentro da pasta Aula 16 function.01.js e funtion-02.js para melhor explicação!
Exercício- parte 1
Exercício - parte 1 - Aula 16
Exercício - parte 2
17. Próximos Passos
Esse aula é a ultima aula do curso Básico de JavaScript.Nessa aula o prof. Gustavo Guanabara nos dá dicas de o que devemos estudar para a aprimorar nosso conhecimentos em JavaScript.Algumas das dicas de " O que devemos estudar mais são: "Estudar mais funções ( O que são Call-backs , Aero- functions, funções anônimas, as iifes(IIFE), Estudar JavaScript Funcional. Objetos.Modularização.Estudar expressões regulares (RegEX)JSON AJAXNODEJsVamos falar um pouco sobre objetos agora no final do curso.
17. parte 2 - Objetos
Nessa Aula vamos dar introdução aos fundamentos de objetos.NO JavaScript os Objetos são declarados da seguinte forma :Exemplo let amigo ={ }let = variável amigo = nome do objeto = recebe { } = aqui vamos colocar os valores que queremos adicionar a esse objeto de nome amigopara declarar dentro de um objeto seguimos da seguinte forma:primeiro colocamos um atributo e depois colocamos : e por último colocamos o valor exemplo: nome: 'Jose' Vamos dar abaixo um exemplo completo de um objeto :let amigo ={nome:'Jose',sexo: 'M', peso: '85.4', engordar(p){ } };console.log(amigo);Observe que dentro de um objeto também podemos declarar uma função. ( engordar(p) ) - o que está dentro desse parêntese é uma função dentro de um objeto. Para solicitar que seja apresentado na tela apenas um valor que esta dentro de um objeto fazemos essa solicitação da seguinte forma :console.log(amigo.nome)
Modulo E
Estruturas de Repetição
laço (while)
Modulo B
Variáveis e Tipos Primitivos
Operadores Aritméticos, lógico e ternário
Modulo A
Apresentação do Curso de JavaScript e da História
Modulo F
Variáveis Compostas(Arrays)
Funções e eventos
Passagem de parâmetros
Próximos passos
Modulo C
Aprendendo sobre DOM
Modulo D - Condições
Condições Simples (if)
Condições Compostas (if ) - (else)
Condições aninhadas
Condições Multiplas