Javascript: Leitfaden für Anfänger

1. Boas-vindas: Todos já ouviram falar de JavaScript, certo? Esta poderosa linguagem de programação que o site usou para fazer seu conteúdo ganhar vida. Não há mais páginas chatas e estáticas que apenas ficam lá olhando para você com JavaScript, vamos ser capazes de interagir com os usuários, responder a eventos, comunicar dados entre o servidor e o navegador, criar outs e jogos e muito mais. Meu nome é meu corpo, e eu serei seu instrutor para este curso semelhante a como você abordaria aprender praticamente qualquer coisa. Você precisa começar com o básico. É aqui que entra este curso. Este curso irá ajudá-lo a entender os conceitos básicos de JavaScript. Uma vez que você é bom e bom nisso, você pode passar para algo mais avançado. À medida que você faz o seu caminho através das lições, você vai ver um exemplo prático sobre onde usar JavaScript e como usar JavaScript tanto de forma informativa quanto divertida. No final deste curso, você terá uma base forte em javascript. Seria capaz de criar casa e dinâmica com aplicações e derrubar qualquer aspecto de trabalho relacionado. Desafie seu rosto. Tudo bem. Chega de conversa. Estou tão animado para compartilhar este curso com você. Vamos saltar para dentro 2. Olá!: não importa o quão bonito os sites do mundo usando Onley, CSS e HTML olhar, eles rapidamente se tornarão chato a estética da ópera e não respondem ao que o usuário está fazendo. O site que você visita frequentemente nosso em estático. Isso é porque eles estão confiando no JavaScript para dar vida ao conteúdo deles. Então, o que é Dirija um Espírito? JavaScript é uma linguagem de programação usada para tornar as páginas web interativas. É o que dá uma página dos elementos interativos e animações que envolvem um usuário. Esta é uma pequena lista fora do que JavaScript pode fazer, quantificou o HTML e, digamos, para a página após a página ter carregado responder a eventos como uma máscara, clique em fazer animações que capturam as intenções de usuários e muitos muitas outras coisas interessantes. Eu não vou lutar contra você com a história do JavaScript, mas eu quero que você saiba que JavaScript não tem nada a ver com Java. Portanto, suficiente informação de fundo por enquanto, vamos molhar os pés escrevendo alguns trabalhos. Desistir. No final deste vídeo, você será capaz de exibir algum texto em seu navegador antes de ir em Mr. Além disso, precisamos de um editor de tribunal para escrever JavaScript, um editor básico como bloco de notas pode fazer o trabalho, mas um bom editor tornará sua vida mais fácil. Alguns dos meus editores favoritos chamados incluem sublime nota de texto Bad mais código de estúdio visual . Realmente não importa qual você está usando, desde que você saiba como criar um novo documento. Edite, salve e revise no seu navegador. Você está pronto para ir. A primeira coisa que precisamos fazer é criar um documento HTML. Este documento. Nós contemos nosso código JavaScript. Se analisarmos este documento em nosso navegador, não vemos nada que seja totalmente normal porque nosso documento está em branco. Vê a tag do script? É aqui que a magia acontece. O script Tang é onde você coloca o JavaScript que deseja executar. O que você deseja fazer é exibir uma caixa de diálogo que diz Olá mundo quando carregamos nossa página HTML . Então, dentro do nosso script AG, eu vou adicionar o seguinte alerta linha e Olá mundo. Vamos dizer o nosso html cinco e abri-lo em nosso navegador. E como você pode ver, a mensagem Olá Mundo é exibida dentro de um diálogos solavancos. Viu, isso não foi tão difícil. Você acabou de criar um exemplo de trabalho usando JavaScript. Bom trabalho. Então, o que exatamente aconteceu aqui? O que fizemos está certo. Uma simples declaração de dispersão Java. JavaScript são instruções a serem executadas pelo navegador da Web. No nosso caso, temos uma declaração que diz ao navegador para escrever Held the world. Você geralmente pode dizer quando algo é uma declaração se termina com um Cullen ensolarado. Mas esta não é uma maneira garantida de identificar uma declaração. JavaScript funciona bem em muitos casos sem ter um ponto e vírgula no final das instruções, e alguns desenvolvedores até escolheram omiti-las. Vamos dar uma olhada no nosso depoimento. Temos essa coisa chamada Alerta Alerta é exatamente como o nome sugere que é responsável chamar sua atenção por esses aviões. Em texto, A palavra mothered é realmente algo conhecido como uma função. Afeto é basicamente um pedaço reutilizável de casaco que faz alguma coisa. As funções geralmente levam em dados, processam e retornam um resultado. afeto pode ser definido por você, definido por alguma biblioteca de terceiros que você está usando, ou pode ser definido pelo próprio framework JavaScript. Uma vez que uma função é escrita, ela pode ser usada uma e outra e outra vez. voltando ao nosso exemplo. O texto que você deseja exibir é Olá mundo. Observe como foram embrulhadas as palavras entre aspas. Você sempre vai precisar de pedaços de dext, mais comumente conhecido um cordas dentro simples ou duplo rápido as aspas. Pode parecer estranho, mas é assim que funciona o imposto JavaScript San. Vamos olhar para cordas com mais detalhes nas próximas lições. Você pode brincar e mudar o fixo como quiser. Digamos que, por exemplo, eu nunca assisto. Salas de jogos fora. Vamos poupá-lo. Vamos revisá-lo em nosso navegador. E como você pode ver, JavaScript é gentil o suficiente para não me julgar e simplesmente exibir o próximo. Muito bem, vamos recapitular isto. Escuta, sujamos nossas mãos criando um exemplo simples. Ao longo do caminho, encontramos muitos conceitos e termos. Tal cadeia de função de instrução. Não se preocupe se você não consegue se lembrar de todos eles agora, nós ainda vamos elaborar sobre cada um dos termos com outros exemplos. Muito bem, vemo-nos nas futuras lições. 3. Variáveis: em instruções JavaScript, geralmente em quarto lugar. O que chamamos de objetos de valor fornecem uma saída de rótulo e dados com o nome destrutivo para que nossos programas possam ser entendidos mais claramente pelo leitor e por nós mesmos. É útil pensar em variáveis como um contêineres que possuem valor. Seu único propósito é o rótulo e armazenar dados na memória. Esses dados podem ser usados em todos os seus programas. Será que o coágulo uma variável usada da nossa chave funcionou, seguido pelo nome que você quer dar o seu valioso? Quando você for nome e objetos de valor, tente o seu melhor para garantir que o nome que você atribui ao seu valioso seja descritivo e compreensível com precisão . Toe outro leitor Nesta linha de código, declaramos um resfriado valioso. Diga “olá”. No momento, o nosso valioso está vazio. Isso é corrigido que, inicializando em eram valiosos um valor. Digamos, por exemplo, olá são agora eu vou usar a outra facção tão cedo para exibir o conteúdo fora nossa variável. Então, alerta. Diga “olá”. É seguro. Nosso documento. Andi, vamos abrir no nosso navegador. Como você pode ver, os resultados são os mesmos que anteriormente. Se você quiser alterar o texto de exibição para vamos dizer olá, todos. Tudo o que você precisa fazer é fazer uma alteração para o valor especificado, como o corpo hello able. Então aqui vou eu mudar o mundo para todos. Se eu salvar em re executar o script, você pode ver que a exibição leva alterado para Olá, todos. Em todo o seu casaco, Onde quer que você referência a dizer Olá variável. É o novo valor que será usado para aplicações maiores. Isso economizará uma tonelada de tempo porque você tem apenas um local onde você pode fazer alterações e isso será refletido em todos os lugares. Mas como você pode chamar seus objetos de valor? Tem algum nome? Está bem? Bem, não. Mas as regras em torno da criação de nomes valiosos são simples. Inicie sua variável com uma letra e sublinhado. Ou um autor do lado do dólar que usou tantas letras algarismos numéricos sublinhados ou cifrões , como você gosta. Oh, e mais uma coisa. Nós realmente não queremos confundir javascript, mas usando qualquer off the welt end palavras-chave como, far ou função, vamos obter algumas dessas palavras-chave e o que elas significam ao longo do resto deste curso 4. Funções: Você tem um pouco de programação A sob seu cinto. Agora é hora de realmente mover as coisas junto com funções. Funções permitem que você escreva código que pode ser re usado uma e outra vez, código que é muito mais gerenciável. Bom. Isso pode ser abstrato e dado um nome simples para que você possa esquecer toda a complexidade e continuar com as coisas importantes. Para ilustrar isso, digamos que queremos confortar o índice de massa corporal ou B M I para encurtar uma pessoa. O ser I é calculado dividindo o peso de uma pessoa em quilogramas pelo quadrado de sua altura em metros. Uma pessoa é considerada acima do peso se seu bebê de 25 anos. Então aqui temos duas variáveis. Cada loja variável, um número, sendo o meu valioso resultado armazenado dividindo o valor armazenado pela variável peso pelo quadrado fora dos valores armazenados pela variável altura. O caractere de barra indica que uma divisão precisa ocorrer onde nós o caractere asterisco indica que uma multiplicação precisa ocorrer. Agora vamos dizer que queremos calcular a baía em I para pessoas diferentes. Não há sobre Lee o que aprendemos até agora. Nós escreveríamos algo assim. Eu pegava esse código e copiava várias vezes. Então eu mudaria o nome das variáveis assim e mudaria os valores também. Por exemplo, você pode ver onde isso está indo. Nosso código é redundante e francamente falando, parece terrível. Mas usando funções, podemos tornar isso ótimo novamente. Então eu vou substituir tudo isso por uma porção menor de lidar. Essa pequena parte do código faz o mesmo trabalho que anteriormente, mas sem a redundância. Então, como é que isto acontece? Isso é o que vamos aprender porque você raramente vai corrigir ou usar código que não funciona em quatro funções. É importante que você se familiarize com eles e aprenda tudo sobre como eles funcionam. A melhor maneira de fazer isso é saltar direto para eles. Então eu vou apagar tudo isso. Vamos criar a função simples que diz olá, mas ainda precisamos chamá-lo para onde vou adicionar o seguinte mentira após o final da nossa declaração de função. Agora vamos salvar isso e visualizá-lo em nosso navegador Como você pode ver, a mensagem de saudação é exibida. Agora vamos quebrar nosso código em pequenos pedaços e ver como ele funciona. Primeiro, nosso código começa com a palavra-chave facção após a palavra-chave função. Você especificou o nome real fora da função, seguido de parênteses de abertura e fechamento. Então, onde está em torno da nossa função? Com parênteses de abertura e fechamento, esses colchetes encerram as declarações que temos dentro. Finalmente vem o conteúdo da nossa função. No nosso caso, o continente é a outra função que exibe um diálogo livros com a palavra Olá e não vamos esquecer a função. Chame a facção. Coal é o nome fora da função que você deseja chamar ou invocar, seguido novamente por parênteses. Sem a sua chamada de função. A função que você criou não faz nada. Agora vamos ver uma função diferente. Deixe-me adiar isso primeiro. Lembras-te do nosso casal ser a minha função? Costumava ser assim. Esta função é o que chamamos Obama tenta função, o que significa que leva argumentos quando está frio. Você pode dizer quando uma função leva argumentos olhando para a própria função de declaração função que não tomar argumentos, então aparecer com pais vazios é pai ganhar seu nome. Funções que tomam argumentos não são como que Seguindo seu nome e entre os aprendizes a função ficou claramente que tipo de argumentos eles precisam eo número fora desses argumentos para o país 8 p.m. aprendizes a função ficou claramente que tipo de argumentos eles precisam eo número fora desses argumentos para o país 8 p.m. tem dois argumentos. O 1º 1 é o peso no 2º 1 é a altura. No nosso caso, chamamos o nosso cálculo sendo I função e especificar os valores que você deseja que a função dentro das peças pai aqui, o 70 corresponde ao argumento de peso no 1.86 corresponde ao argumento height. A ordem é muito importante. Então agora você sabe como se comunicar com suas funções em uma direção, seja, você sabe como passar argumentos para funções. Mas e o outro lado? Uma função pode se comunicar de volta? Temos o nosso país sendo a minha função e a disciplina estabelece uma mensagem de alerta com o valor do nosso valioso. Mas e se realmente quisermos armazenar esse valor para algum uso futuro? Então, em vez de ter nosso disfarce sendo minha função, calcule o feixe e exiba-o como um alerta. Queremos fazer algo assim, eles podem ser um meu valioso irá armazenar os resultados fora do cálculo feito pela calcular B M. função calcular B M. I. Então, como podemos conseguir isso? A maneira de retornar dados de uma função é usando o trabalho de tecla de retorno. Então aqui dentro da minha calculadora B e eu funciono, eu vou fazer algumas mudanças. Então, em vez da outra função, eu vou dizer retorno sou eu notei que ainda estamos calculando o b m I dividindo o peso pelo quadrado fora da altura. Mas em vez deste avião e alerta foram devolvidos o b m i, como dito pelo BM valioso. Agora tudo o que temos a fazer é chamar a função e um sinal o resultado de retorno para uma variável. Uma vez que sua função atingiu a palavra-chave de retorno, ela pára. Tudo o que está fazendo nesse ponto retorna. O valor é especificado e sai, portanto, no código que existe após sua instrução return será ignorado. Outra notícia interessante fora da palavra chave de retorno é apenas sair da função com que realmente retornando um valor para a cor. Por exemplo, eu posso ter uma função em, mas ele tem, por exemplo, faz alguma coisa, e depois de fazer o que deve fazer, ele vai dizer voltar aqui. A palavra chave de retorno é usada por si só como você vê para apenas aceitar a função. 5. Declarações condicionais: Até agora, realizamos tarefas pré-desafiadoras. Mas o que torna o programa muito mais poderoso são declarações condicionais. Esta é a capacidade de testar uma variável contra o valor e agir de uma maneira. Se a condição for cumprida, obedeça ao valioso ou de outra maneira. Caso contrário, JavaScript fornece uma capacidade geral de tomada de decisão na forma da construção de linguagem conhecida como a instrução if, a frase mais básica é a que você vê na frente de você. Nesse caso, se a condição dentro dos parênteses de hambúrguer for avaliada como verdadeira, então as instruções entre colchetes curvos serão executadas. Caso contrário, o programa não executará as instruções e continuará logo após o último colchete indicando o fim do bloco. A instrução if básica também pode ser estendida com a palavra-chave else. Isso fornece uma alternativa set off instruções a serem executadas se a condição não for verdadeira . Para dar sentido a isso, vamos dar uma olhada em um exemplo simples. Muitas vezes f l declaração em ação. Aqui eu tenho um valioso dinheiro frio e carteira inicializado para verdadeiro, e eu tenho duas outras funções. O 1º 1 diz que você pode pedir uma pizza o 2º 1 dizer, afastado nosso É bom para a sua saúde. Então, qual dessas afirmações verdadeiras será executado? Vamos salvar nosso documento e vamos correr para fora e ver qual deles será executado. E como você pode ver, a primeira declaração que diz que você pode pedir uma pizza é a que aparece em nosso navegador. Isto é porque o nosso valioso é inicializado para verdadeiro. Então, a parte verdadeira das nossas declarações F entra em ação. Agora vamos em frente e mudar o valor do dinheiro e da carteira. dedo cai. Vamos rodar nosso roteiro. Como você pode ver o texto que diz é ficar com a água. É bom para sua saúde estar aparecendo. Isso acontece porque nossa expressão avalia quedas do pé. Faz sentido certo. Na maioria dos casos, sua expressão não será um simples valioso que leva Traore cai. Em vez disso, você precisará comparar entre duas ou mais coisas para obter um resultado verdadeiro ou falso. Fazer isso com você é o que chamamos de operadores condicionais. O general ex-desligado. Tal expressão é a que você vê na frente de você se expressão seguida pelo operador, em seguida, pela expressão. Então, se o resultado disto for verdade, faremos outra coisa. Faremos outra coisa. Vamos dar uma olhada em alguns dos operadores condicionais antes de seguirmos em frente. O operador duplo igual é verdadeiro se a primeira expressão valores para algo que é igual à segunda expressão. A extremidade dupla, por exemplo, é verdadeira se a primeira expressão na segunda expressão for avaliada como verdadeira. Para exemplo concreto de operadores condicionais, imagine um programa bancário que imprime uma notificação curta na parte inferior. Cada recebimento de transação de acordo com o saldo remanescente na conta. Se o valor fora da variável de saldo for maior do que o saldo mínimo, que é 100 neste caso, em alerta deve aparecer dizendo saldo seguro. Se o saldo não for maior do que o saldo mínimo, será exibida uma mensagem dizendo advertência Saldo baixo. Então, se eu chamar a função de estado de equilíbrio usando um saldo off 80, por exemplo , neste caso, esta expressão é avaliada como falha porque 80 não é maior que 100. Se eu rodar o script, devo receber uma mensagem de aviso de baixo equilíbrio. Como pode ver, essa é a mensagem que recebo agora. Se eu chamar esta função com abundância, digamos que off 150 desta vez, o valor do saldo é maior que o saldo mínimo porque 150 é maior que 100. Neste caso, devo enviar uma mensagem fora do equilíbrio seguro. E como pode ver, eu tirei a mensagem. Seguro. Bônus. Estamos quase terminando com a declaração if, a última coisa que quero mostrar a vocês. A variante fora da declaração FL Até agora, usamos a instrução F executado para uma seção diferente de revestimento. No entanto, podemos pensar em casos em que gostaríamos de executar mais do que para uma seção diferente do código. Nestes casos, podemos usar a palavra-chave mais F para mudar se declarações juntos nossa asserção cabra dentro cada F e então f bloco procurando uma expressão que avalia como verdadeiro. Se nenhuma das instruções tiver expressões que avaliam como true o código dentro do sujeito else , se ele existir, execute. Isso é tudo pelas declarações “F”. Vamos passar para uma declaração condicional diferente. Agora vamos ver instruções switch que funcionam de forma semelhante à instrução FL, mas com um centro diferente. Eles são particularmente úteis quando você tem vários mais fecha uma instrução switch avalia uma única variável no dependente de seu valor, executa um determinado bloco off casaco. O imposto geral enviado para a declaração básica switch é o que você vê na sua frente. O switch verifica o valor para fora da variável para uma correspondência. Em um dos casos, se forem iguais, as instruções nesse caso serão executadas. Certo, é um exemplo que provavelmente vai te deixar com fome. Eu tenho um sabor frio variável foi Valor é dito para biscoitos e verde. Esta variável de sabor é o que é passado para a nossa declaração de mudança de estado. Nossa declaração de switch contém uma coleção fora dos blocos de caixa Onley. Um desses blocos será atingido com seu código sendo executado. A maneira como este escolhido é escolhido é combinando um valor de caso de blocos, com o resultado fora de avaliar a expressão no nosso caso, porque nossa expressão avalia para um valor fora de cookies e verde. O código dentro do caso blogado, foi valor caso é cookies e creme é executado para evitar a execução. Toda a declaração que segue a palavra-chave break é usado seu propósito é quebrar fora do interruptor e continuar com o resto do programa. Padrão é o equivalente interruptor fora da roupa Els e uma declaração F else. Se nenhum dos casos explícitos se aplicar à variável padrão com ainda aplicar, cada valor corresponderá à maiúsculas e minúsculas padrão. Portanto, isso pode ser útil para lidar com situações inesperadas. Esta declaração que pode ser convertida em declaração fl equivalente. Deixe mover ou remover isso, como você pode ver, se mais é muito semelhante à nossa instrução switch. Então, assim como com a instrução switch, estamos comparando investir nosso sabor valioso contra os diferentes valores que ele pode levar. Agora, você pode estar perguntando, como eu posso saber quando usar? Que há muitos argumentos na Web sobre quando usar switch versus uma instrução else , e a única coisa que é clara é que eles são todos inconclusivos. Pessoalmente, eu troco quando eu ofendi. Número de valores esperados 12 meses em um ano, por exemplo, poderia ser representado por 12 casos. Se a situação exige um monte de gama de valores, é mais doce dedo do pé uma declaração f l. Mas novamente você vai encontrar alguém que pode convincentemente fornecer um contra-argumento. Então vá com o que achar mais legível 6. Loops: ao programar, muitas vezes você precisará fazer as coisas no tribunal mais de uma vez, e JavaScript dá-lhe algumas maneiras de executar repetidamente o código várias vezes. Por exemplo, digamos, ter uma função chamada dizer obrigado. Esta sanção exibe uma mensagem de texto dizendo Obrigado. Então, se eu quiser chamar essa função, digamos 10 vezes. Uma maneira que eu poderia fazer isso é chamá-lo pela primeira vez, então simplesmente fazer companhia e baseado nisso tanto quanto eu quiser. Enquanto isso funciona, mas são redundantes, código é difícil de manter e simplesmente um mau 80. Além disso, você nem sempre sabe o número de vezes que você precisa para executar seu casaco. Ele pode mudar de acordo com as condições específicas presentes durante uma determinada execução, e mais do que provável, o número de vezes que você deseja repetir algum código pode ser enorme. Você não quer copiar e colar algo algumas 100 ou milhares de vezes para repetir algo que seria terrível. O que precisamos é de uma solução generosa para um código de pombo, com controle sobre quantas vezes o código se repete. Esta solução é chamada Loops, como o nome sugere nossas estruturas que percorrem uma seção de código. Enquanto alguma condição for atendida, existem três tipos de esperanças que você pode criar quatro loops. Por que lóbulos nos laços de arame? Uma das maneiras mais comuns para criar um lope é usando a palavra chave quatro para criar o que é conhecido como um quatro baixo. Um loop de quatro é usado para repetir um bloco específico fora código desconhecido número de vezes. A instrução de inicialização é executada apenas uma vez. Em seguida, a expressão de teste é avaliada. Se a melhor expressão for falls, o grupo completo é encerrado. Se a expressão de mesa for verdadeira, o código dentro do corpo de quatro Aboul é executado e a instrução de atualização é operada. Vamos ver um exemplo aqui temos uma função chamada Say hello this function. Traga a palavra Olá para o navegador usando o método documento ponto direito, eu vou terminar. Vou chamar este método. Chen Tien. Vamos executar nosso script e ver o resultado. Como você pode ver, a palavra Olá é impressa no navegador 10 vezes. Isso é possível graças ao loop quatro, vamos dar um localizado mais perto. Em nosso exemplo, eu criei uma nova variável chamada I e centralizá-la para zero. A condição é que a nossa variável I é inferior a 10 em cada iteração fora de nosso loop completo, somos incrementos nossa variável I por um ônibus abençoado depois que eu quero dizer suas perguntas. Seja qual for o valor que eu variável tinha por um, esse processo se repete até que a expressão de teste é dobras. Agora que temos uma idéia geral sobre como para as obras, ainda há algo que nosso exemplo simples não cobriu. Às vezes, você pode querer suportar para o grupo antes que ele atinja a conclusão. A maneira de fazer isso é usando o trabalho breaky. Você já viu a instrução break usada em uma lição anterior. Foi usado para saltar para fora de uma declaração de interruptor. A instrução break também pode ser usado para saltar para fora do loop e executar o código depois dele . Se houver, vou fazer algumas mudanças no nosso casaco. Vou copiar isto aqui, mudar a palavra “olá dedo do pé”, e depois vou usar a declaração “F”. Se eu for igual a seis, então quebre. Vamos remover isto. Então vamos salvar isso e executar nosso script. E como você pode ver quando o valor off I é igual a seis. As instruções break quebra o lope e continuar a executar o código após loop. Então aqui não temos nenhum código depois da foto, então simplesmente paramos quando o número seis for impresso para o irmão. Às vezes, você pode querer forçar a próxima iteração fora da aparência a ocorrer, ignorando qualquer citação entre elas. Isso pode ser alcançado usando a instrução contínua. Vamos ver um exemplo. Vou fazer algumas mudanças no nosso casaco. Vou copiar e passar isso aqui em diante. Vou mudar a palavra quebradiça por Continuar. Agora vamos correr para fora, raspar e ver o que acontece. Como você pode ver, o valor seis está faltando na saída. Por que, quando o valor dos olhos é seis. O programa encontrar uma instrução continue, que faz com que ele salte no início das quatro esperanças para a próxima iteração pular na instrução para iteração atual. Como eu disse anteriormente, existem três tipos de grupos. Nós vimos os quatro olhar, agora ainda temos mais dois, então vamos começar com o olhar selvagem. A Esperança Selvagem executa algumas instruções até que sua condição retorna cai neste exemplo. A condição é representada pelo número é inferior a 10 expressão com cada iteração nossos incrementos lope, o valor do número por um foi o valor off número torna-se. Em seguida, o loop pára porque o número é menor que 10. Expressão retornará quedas, então o que é exibido é 10. Então vamos rodar nosso roteiro e ver se isso é verdade. Agora é hora de ver o Do I olhar em quatro e largas loops com esta condição dildo na parte superior do olhar. Mas eu olho? Verificamos sua condição na parte inferior do loop. A Do I olhar é semelhante a um loop de arame. Aceite o fato de que é garantido executar pelo menos uma vez. É ilustrar isso por um exemplo. Este grupo mundial nunca será executado porque é condicional. Expressão é falsa com um loop do do while porque a expressão condicional é avaliada em Lee. Depois de uma situação, a sua aparência continente é garantida para correr pelo menos uma vez. Então, se eu executar este script, o que eu vou conseguir é a impressão de texto do bebê no irmão, graças à porta, enquanto olhar para nós cobrimos os diferentes tipos de grupos. Agora você é meu louco usando loops muito. Mas à medida que começamos a manipular coleções de elementos HTML de dados em seu documento e outras situações complexas, você dependerá fortemente de loops. 7. Temporários: um bloco fora do código JavaScript é geralmente executado de forma síncrona, que significa que quando uma instrução precisa ser executada, ela é executada imediatamente. Mas podemos encantar a execução de instruções que ele estava em algumas funções nativas chamadas temporizadores. Essas funções são ditas. Tempo limite disse Intervalo. Andhra Quist animação Quadro o tempo limite definido define um temporizador, que executa uma função ou pedaço de código especificado uma vez após o temporizador expirar. Se quisermos mostrar em livros de alerta depois de dois segundos, por exemplo, não faríamos algo assim. Aqui temos uma função chamada show Outro que outro a mensagem dizendo que eu finalmente apareceu . Eu chamo essa função foi em vez disso eu modo depois de dois segundos ou dois milésimos de segundos. Então, se eu salvar isso e executar o script, você pode ver que depois de dois segundos a mensagem aparece, Você pode perguntar por que o tempo limite I d Valuable está aqui. Afinal, não a usamos bem. Este valioso não é realmente inútil. Podemos usá-lo se quiser cancelar o tempo. Quando chamamos o set Time out, ele retorna em i d. Este i d pode ser passado toe. Outra facção chamada tempo livre para cancelar o temporizador. Então, se eu quiser cancelar meu temporizador, eu faria algo como este tempo livre. Então eu vou passar o I D devolvido pelo set. Tempo limite função como esta ao mesmo tempo Afection sondas muito úteis em muitos casos. Por exemplo, se houver uma ação em andamento que não é possível concluir, você pode usar a mesma função de tempo limite para interromper essa ação e devolver o controle ao usuário, disse Intervalo , repetidamente chamado a função ou executa um trecho de código com um corrigi-lo tentando atraso entre cada carvão. Ao contrário do tempo de espera que executam o tribunal apenas uma vez. O primeiro argumento desta função especifica a função que você gostaria de executar. O segundo argumento especifica o tempo em milissegundos para esperar antes que você código apareça novamente , disse Interval Returns, também um Interval i D, que identifica exclusivamente o intervalo para que você possa removê-lo mais tarde chamando limpar Intervalo . Tudo bem, vamos ver um exemplo aqui temos uma função chamada Diga Olá Esse alerta e uma mensagem dizendo Olá você desde que intervalo estamos Lupin Esta função com o atraso desligado três segundos entre H Loop. Se você deseja cancelar o loop, você pode usar o intervalo claro ignorando o intervalo I d para esta função ao tentar animar algo para a tela. Você tem que se certificar de que seus caldeirões de animação corretamente usando a mesma função de intervalo mencionada anteriormente, não garante isso. Vamos ser explicados. Seu navegador está ocupado, o vento, coisas diferentes a qualquer momento, ouvindo a máscara Knicks, este avião, este avião, o que você escreve em um teclado, carregando recursos JavaScript executivo e mais enquanto faz tudo isso. Seu navegador também está redesenhando a tela em 60 quadros por segundo, disse Time Out não leva em conta o que está acontecendo no navegador. Então o nosso código de animação, o meu sinal, pode perder-se no caos. Para evitar isso e superar outros problemas de eficiência, temos a função de amigo de animação solicitação da maneira como usar esta função é um pouco semelhante ao tempo limite definido e disse Intervalo, você pode ter notado que você não especificar um Intervalo, certo? Tudo isso depende da taxa de quadros do navegador e do computador, mas normalmente é de 60 quadros por segundo. A principal diferença aqui é que você está solicitando que o navegador desenhe sua animação na próxima oportunidade disponível, não um intervalo predeterminado com base na visibilidade do elemento de carga e o Baker Status Browser também pode optar por otimizar seu desempenho fora do quadro de animação de solicitação. De qualquer forma, é assim que você usaria o pedido, quadro de animação e vida real. Aqui temos uma função chamada dirigiu algo Notice que nosso quadro de animação solicitação chama a seca. Algo funciona totalmente de dentro do mundo enviou infecção em si. Você pode estar se perguntando por que isso não cria um loop infinito. Isso é porque pedido de animação amigos Implementação evita isso. Em vez disso, assegura a si mesma. A infecção é chamada apenas para a direita. Quantidade de vezes necessárias para controlar as coisas são atraídas para a tela. Joe cria animações boca para parar uma animação pedido para infecção. Você tem a função cancelar quadro de animação, assim como vimos antes. Cancelar animação Frame tira o valor I D. de nossa animação de solicitação para infecção que é retornada quando você chamá-lo 8. Âmbito variável: toe trabalhar com JavaScript de forma eficiente. Uma das coisas mais importantes que você precisa entender é o conceito ou escopo variável. O escopo de uma variável é controlado pela localização fora da declaração variável e define a parte do programa onde um determinado valor é acessível. Em outros termos. Só porque você declara um valioso não significa que ele pode ser acessado de qualquer lugar em seu código. Vamos começar nossa exploração fora do escopo com o que é conhecido como escola global. Os valores globais são definidos fora de todas as facções, geralmente no topo do programa. Eles mantêm o seu valor durante toda a vida fora do seu programa. Qualquer função pode acessar no Global Valuable que é um valor global está disponível para uso em todo o seu programa. Após sua declaração neste exemplo, o número valioso é declarado fora do afeto número de retorno. Apesar disso, a função de número de retorno tem acesso total ao número valioso. Obviamente, temos usado variáveis globais o tempo todo sem perceber, então eu só estou me certificando que você sabe com o que você está lidando porque essa escola valiosa deixa um monte de iniciantes frustrados. Agora vamos dar uma olhada em objetos de valor que são, por exemplo, a nuvem dentro da função. Essas são chamadas de variáveis locais. Ao contrário das variáveis globais olhar de variáveis quando a rede quando o acesso de fora da função neste exemplo que este valioso é recluso dentro da função de teste de escopo . Então, se eu tentar acessar a mesa valiosa de fora da função, não funcionará. A razão é que o escopo fora de sua variável de mesa é local para a função de teste de escopo. Há, no entanto, uma excepção a isso. Se declararmos nosso teste valioso sem o trabalho Vaki, o comportamento de escopo mudará completamente neste caso, mesmo que nosso teste valioso apareça dentro da disfunção do escopo primeiro, não incluindo a palavra-chave VAR torna essa variável viver globalmente. Então aqui eu vou mudar isso para eu vivo globalmente. Então, se o Irã é nosso roteiro, ele vai mostrar a mensagem dizendo que eu saí globalmente, que é o valor do nosso teste valioso. Isso é verdadeiro para cada valor declarado sem usar as palavras-chave var. Eu odeio dizer isso para você, mas este é apenas um dos muitos quarts de JavaScript. Há outros com os quais você precisa estar familiarizado. Vamos dar uma olhada no pai. Um casaco. Primeiro, deixe-me entrar no roteiro e ver o resultado. Então voltarei e explicarei o que aconteceu aqui. Temos a primeira mensagem dizendo “Bem-vindo à idade adulta”. Depois uma segunda mensagem dizendo a mesma coisa. Bem-vindo ao adulto. Agora vamos voltar ao nosso código. Aqui temos uma função chamada fase de vida Dentro da declaração if, temos uma mensagem chamada valiosa. Quando este código é executado, a outra função diretamente abaixo dele é exibida. Bem-vindo à idade adulta que faz sentido. O que pode fazer menos sentido é que o segundo alerta que está fora da declaração if também exibido bem-vindo à idade adulta e é o que está acontecendo. Nossa variável de mensagem é a nuvem dentro do que chamamos bloco olhar ah é qualquer coisa que aparece dentro dos colchetes abertos e próximos. Em muitas linguagens de programação, variáveis declaradas dentro de um bloco são parte desse bloco próprio escopo. Isso significa que essas variáveis são locais e podem ser acessadas fora desse bloco. Mas em JavaScript, as coisas são diferentes. JavaScript não suporta o escopo de bloqueio. Assim, do ponto de vista de scripts Java, podemos muito bem declarado em uma determinada variável de mensagem no topo da nossa função de estado de vida em si da seguinte forma. Então aqui vou eu dizer mensagem. Então vou apagar isto do nosso aqui. Agora vamos nos dar crédito e ver se há algumas mudanças. A primeira mensagem dizendo Bem-vindo à idade adulta e a segunda mensagem dizendo: Bem-vindo à idade adulta. Como você pode ver, o comportamento é idêntico ao que vimos anteriormente. Porque os negros JavaScript parecem escopo. A maioria dos desenvolvedores provenientes de outras linguagens, como C C plus ou Java experimentam muita frustração e comportamento inesperado. É por isso que a versão mais recente do JavaScript introduz uma nova palavra-chave chamada Let Se você usar lead para definir variáveis, seu escopo será limitado ao bloco em que elas são declaradas. Tudo bem, digamos um exemplo. Vou atrasar isto. Aqui temos uma função chamada comportamento de bloco. Dentro desta função, temos uma declaração if e dentro desta declaração se eu declarei um número chamado valioso. Ele estava encantado, palavra-chave. Então eu tenho uma nova função de alerta que exibe o valor dessa variável fora. Fora deste bloco, eu tenho outro alerta que exibe o valor de uma variável chamada número, mas desta vez. Não é. O valioso que declaramos aqui está na palavra-chave let. Mas é a variável global que declaramos acima da nossa função. Então o primeiro alerta deve mostrar o número 20. E o segundo alerta deve exibir esse valor que é então vamos salvar isso e executar fora do script. Então o primeiro valor é 20. O segundo valor é 10. Tudo bem, nós superamos este. Mas espere, ainda não terminamos. Javascript ainda tem surpresas para nós. Deixa-me mostrar-te do que estou a falar. Vamos ver outro exemplo. Então aqui eu tenho uma variável chamada texto que tem um valor desligado. Olá. E eles têm uma função chamada saudar todos dentro desta seção Eu tenho uma função de alerta que disse que este exibido o valor nosso texto valioso. Temos a nossa re declaração fora do nosso texto valioso com o valor. Vejo-te mais tarde. Então temos outro alerta exibindo o valor do texto. Qual você acha que será o resultado das outras chamadas de função? Dado o que está acontecendo através da minha resposta que o primeiro alerta irá mostrar Olá no segundo alerta irá mostrar-lhe mais tarde. No entanto, se eu executar este script. O que vamos ver é indefinido e te vejo mais tarde. Então, o que está acontecendo? Quando Javascript encontra uma função, ele pesquisou o código inteiro procurando por qualquer um dos objetos de valor da nuvem. Quando os encontra, inicializa são eles por padrão, com um valor indefinido. A grande função de todos é declarar um texto frio variável. Portanto, antes que o primeiro alerta seja atingido, uma entrada de texto é criada com um valor indefinido. Eventualmente, quando nosso código bate de nosso texto é igual a selo mais tarde, o valor do texto é inicializado corretamente. Mas isso não ajuda a nossa primeira função de alerta. Mas isso ajuda o 2º 1 que segue a declaração re off. Próximo. Tudo isso tem um nome. Ele é conhecido como host em ou hospedagem valiosa. Então tenha isso em mente, porque acredite em mim, rastrear enquanto seus objetos de valor não estão se comportando como esperado não é divertido. E espero que isso ajude você a saber por que 9. Fechos: uma das coisas mais importantes ao trabalhar com funções em JavaScript. Divulgações, Fechamentos permitem programadores JavaScript para escrever melhor código, e agora que temos escopo variável sob nossos compartimentos de compreensão construído seria muito mais fácil. Chega de falar sobre fechamentos, pois isso vai deixar o seu apenas confuso. Em vez disso, vamos obter o nosso júri mão por manipulação de código real. Isso o ajudará a entender melhor. Primeiro, vamos ver o que acontece quando você tem funções dentro de funções. Neste exemplo, temos a nossa função vencedora anunciada que contém um alerta e outra função chamada dizer nome do vencedor que também contém um alerta. A parte interessante é o que a função vencedora anunciada retorna. Quando fica frio, ele volta a dizer, função do nome do vencedor. Vamos chamar essa função inicializando evitável que ganha para anunciar Vencedor, eu vou nomear meu vencedor variável é igual a anunciar vencedor. Se rodarmos nosso código, você verá uma caixa de diálogo que diz que o vencedor é a coisa importante a notar É que o mesmo vencedor? Uma infecção não é executado ainda porque nós realmente não chamá-lo com simplesmente retornar uma referência a ele porque o vencedor, valioso agora príncipe para uma função que você pode invocar esta função que estamos chamando usando o open e close tese paren como este quando você faz isso, a intervenção retornado, um nome vencedor dizer. Também seremos executados. Vamos rodar nosso roteiro e ver. Então a primeira mensagem dizendo que o vencedor é e a segunda mensagem dizendo, Mohammed Ali. Ok, agora estamos cada vez mais perto para saber o que soldados realmente são. Quando você tem funções com as infecções, você realmente tem casos como o que acabamos de fazer. Em vez disso, muitas vezes terá variáveis e dados que são compartilhados entre a função externa e a intervenção. Para ilustrar isso, vamos fazer algumas alterações neste exemplo. Eu vou excluir isso e substituí-lo declarando um valioso chamado eram nome vencedor e definir seu valor. Dois. Mohammad Ali sobre aqueles a deixar também este alerta Andi declarar outra variável chamada Vencedor em Verdadeiro e Sente-se. Seu valor para o vencedor é mais o nosso nome de vencedor variável. Esta é uma maneira de misturar esta string com a nossa variável. Falaremos sobre isso mais tarde. Aqui está a torção, o vencedor digamos chamado Função realizada no nome do vencedor Variável que vive no escopo fora da função vencedora anunciada exterior. Vimos anteriormente que quando apertamos a palavra chave de retorno, saímos da função. Então, quando executamos nossa função vencedora anunciada, ela desaparece uma vez, diz que o nome do vencedor é devolvido ao vencedor. Valioso. Então, o que você acha? O que acontece quando chegarmos a esta linha? Nenhuma suposição lógica é que o nome vencedor Variável é realmente definido certo? Então vamos alertar o valor do andro vencedor e ver o que acontece. Vamos rodar nosso roteiro. Temos uma mensagem dizendo que o vencedor é Mohammed Ali. Então nosso roteiro está realmente funcionando. Algo está acontecendo aqui, e essa coisa não é nada mais do que o nosso misterioso encerramento super-herói. Aqui está uma olhada no que, exatamente ou por que exatamente. O nome do vencedor não era indefinido. O tempo de execução do script Java que fornece caminhão fora todos os seus objetos de valor, memória, referências de uso e assim por diante é realmente inteligente. Neste exemplo, ele detecta que a função interna, digamos nome de inverno é um dependente de variáveis da função após, que é anunciado vencedor. Quando isso acontece, o tempo de execução garante que qualquer variável na função externa que são necessários ainda estão disponíveis para a função Inter, mesmo que a função externa desapareça. Então o vencedor Valuous está se referindo a isso. Um vencedor chamado Function. Mas a função nome do vencedor dizer também tem acesso ao nome do vencedor Valioso que existe no Outer anunciou função vencedor esta inter facção porque em perto, objetos de valor relevantes da função externa em assim seu escopo é conhecido como um fechamento. 10. Onde colocar o JavaScript: Até agora, temos escrito nosso código JavaScript dentro de nosso documento HTML. Mas isso não é uma obrigação. Há outra opção que envolve direito em seu código JavaScript. Em um arquivo separado. Usar esta opção irá remover em JavaScript dentro de seu documento HTML. Você ainda terá a tag strip, mas sua finalidade seria apontar para o arquivo JavaScript separado no estado de conter código JavaScript. Tenha em mente que você ainda pode ajudar linhas de código JavaScript ao usar um arquivo JavaScript externo . Nenhuma dessas abordagens é mutuamente exclusiva. Agora vamos dar uma olhada nessas abordagens e ver os prós e contras de cada abordagem que você possa escolher a abordagem certa para seus aplicativos Web. A primeira abordagem que analisaremos é a que temos usado até agora. Esta abordagem é onde todo o seu JavaScript está contido dentro da tag script lado a lado com o resto do código HTML. Quando seu navegador adora a página, ele passa e analisa todas as linhas de cada canal de cima para baixo. Quando ele atinge o script AG, ele irá em frente e executar todas as linhas de JavaScript também. Assim que terminar a execução do seu código, ele continuará a passar o resto do documento. A segunda abordagem é aquela em que nenhum JavaScript é escrito em seu documento HTML. Em vez disso, todo o seu javascript, ele está contido em um arquivo separado. Essa abordagem só funciona se você tiver um arquivo separado para conter um ouro JavaScript. Mas a extensão deste arquivo deve ser o GS. Por exemplo, aqui eu tenho um arquivo chamado Script RGs. O nome não importa. Você pode nomeá-lo. O que você quiser. Dentro deste arquivo, há o script Onley Java. Você não tem permissão para escrever qualquer cada Diana ou CSS chamado aqui apenas código JavaScript que você normalmente colocaria dentro da tag script. Uma vez que criamos o arquivo JavaScript, precisamos vingar a referência na página HTML para fazer isso. A tag de script tem um atributo chamado SRC. Este atributo aponta para a localização fora do desemprego. Ótimo arquivo. Neste exemplo, Jarvis, grande script de arquivo como sim, está localizado no mesmo diretório que nossos documentos HTML. Posso referenciar o nome do arquivo diretamente fazendo isso dentro da tag de script. Vou adicionar os atributos SRC e dizer é igual para raspar os gs. Se o seu arquivo estiver localizado em outra pasta, por exemplo, você tem um G s frio mais completo e dentro desta pasta você coloca seu arquivo. Então você deve mudar as costas para mimar. Então aqui vou adicionar o nome dessa pasta. Neste caso, nosso arquivo de script começa a olhar para a raiz do nosso site e navegar pela pasta GS . Você também pode especificar o caminho quatro ou o que chamamos de banho absoluto. Por exemplo. Eu posso remover isso e, em vez disso, escrever o seguinte antes de falar sobre qual abordagem é melhor. Está em linha ou em JavaScript externo? Quero discutir uma coisa primeiro. Até agora, temos sido colocados em nosso tempo de script dentro de nosso ataque corporal aqui. Estamos lidando com um documento HTML vazio, então isso não fará nenhuma diferença. Mas quando você tem algumas 100 linhas de ouro, é quando o debate sobre onde colocar javascript começa. Algumas pessoas consideram lugar em JavaScript na parte inferior da página, uma prática recomendada quando outras vêem o oposto. Então, quem está certo? Vamos dar uma olhada em cada caso que seu navegador passa sua página HTML começando na parte superior e, em seguida, move-se para baixo linha por linha. Então, quando você aponta seu JavaScript para o topo da página, o navegador, nós começamos a carregar seus arquivos GS antes das imagens de mercado e texto e diz Browser. Embora JavaScript sincronicamente nada mais será carregado enquanto o JavaScript está carregando, então o usuário verá uma página em branco por alguns segundos enquanto o JavaScript está carregando. Por outro lado, se você colocar seu JavaScript na parte inferior da página, o usuário dirá o carregamento da página primeiro, e depois disso, o JavaScript será carregado em segundo plano. Então, se, por exemplo, seu CSS e HTML levar cinco segundos para carregar e seu JavaScript levar mais cinco segundos , colocar nosso JavaScript no topo da página dará ao usuário um tempo de carregamento percebido off 10 segundos, e colocá-lo na parte inferior dará um tempo de carregamento percebido off cinco segundos. Estou usando a palavra percebida porque em ambos os casos, a página será completamente carregada na mesma quantidade de tempo. Ao colocar JavaScript na parte inferior da página, nossas páginas parecerão estar carregando duas vezes mais rápido, mas há uma pegadinha. Se carregarmos nosso JavaScript na parte inferior da página, o usuário é deixado por alguns segundos com uma bela página HTML olhando onde nada funciona. Se o usuário tentar executar uma ação e descobrir que ela não está funcionando, ele pensará que nossa obrigação está quebrada. O que é ainda pior é que não temos como deixar os anos ou não quando o aplicativo será totalmente funcional. Alguns segundos para carregar. A APP é uma das coisas mais comuns. Nós todo o peso para nossos computadores para embarcar para vídeos para carregar, incomum para, para a loja para abrir para quase tudo. Mais uns segundos de folga. Esperar não vai deixar ninguém louco, espero. Mas não há nada pior do que um usuário clicar em um botão, o que não funciona porque ele pode perder a confiança no aplicativo. Mesmo a experiência de carregamento lento pode ser facilitada usando um carregador simples como o que você vê quando você abre sua conta do Gmail, por exemplo, isso realmente depende do que você está fazendo. Se o conteúdo é mais importante para você, então é melhor colocar seu javascript na parte inferior da página. Mas se você está fazendo uma aplicação Web, você é um lugar muito melhor em JavaScript no topo. Agora precisamos escolher qual das duas abordagens é melhor. É melhor? Tente JavaScript insider HTML documento ou colocá-lo em um vôo externo como aqui. Bem, a decisão depende da sua resposta para a seguinte pergunta. Você vai usar o mesmo código JavaScript em vários documentos HTML? Se a resposta for sim, então você provavelmente deseja colocar o código em um arquivo externo e, em seguida, referenciá-lo em todas as páginas HTML nas quais você deseja executar. Isso ajudará você a evitar a duplicação chamada em todas as páginas e facilitará a manutenção . Desde que você tem um único lugar para fazer todas as alterações que você deseja para o seu script. Isso também economizará muito tempo para os usuários, pois eles não precisam baixar o script cada vez que carregarem uma dessas páginas HTML, especialmente quando o script é mais do que algumas centenas fora de linha. O navegador não vai saber o casaco apenas uma vez e entregar o dinheiro a versão pessoa fora do arquivo sob demanda se você respondeu não à pergunta anterior sobre com o registro vai ser usado em vários documentos HTML. Então você pode fazer o que quiser. Não haverá muita diferença. 11. Como escrever um comentário: Se você está fazendo este curso para se tornar um desenvolvedor de JavaScript primeiro você veio ao lugar certo . Em segundo lugar, você provavelmente trabalhará com outros desenvolvedores de JavaScript. Como uma equipe. Isso significa que muitas vezes você estará olhando para o código de seus companheiros de equipe, e eles geralmente estarão olhando para o seu. Então você precisa ter certeza de que eles podem dizer o que seu código faz ou não. É inútil. Mas mesmo se você estiver trabalhando sozinho, você ficaria surpreso com o quão rápido ele até se torna inútil para você mesmo porque você está para obter o que o programa está fora do programa é. Para evitar este problema infeliz, uma das melhores maneiras é usando algo conhecido como comentários comenzar linhas especiais do seu programa que não estão escritas no botão de código em Inglês simples ou francês ou qualquer língua que você fala. Tudo bem, é um exemplo aqui. O comentário é marcado pela barra dupla. A coisa a ter em mente sobre os comentários é que eles não são executados e são executados como o resto do seu código. JavaScript os ignora. O objetivo do comentário é nos ajudar a entender o que o código é o vento. Outro propósito dos comentários é marcar linhas de código que você não deseja executar. Se eu quiser dizer ao JavaScript para não mostrar esta mensagem de alerta, vou simplesmente comentar colocando o caractere de barra dupla na frente. Fora do depoimento. Existem muitos tipos de comentários em JavaScript. Um desses tipos, é, acho que é a única linha comum, a que acabamos de usar. Neste momento, a única linha comum pode ser escrita em sua própria linha, ou podemos escrevê-lo na mesma linha que uma declaração. Cabe a você escolher um local que pareça apropriado para entrar em nossa escrita. Se você quiser escrever um longo comentário fora de várias linhas ou você quiser contar um grande pedaço de código, então usar a barra dupla não será prático porque você precisará adicioná-los na frente de cada linha. Em vez disso, podemos usar a seguinte barra de sintaxe, seguido por e histeria e para fechar este comentário. Mas a estética primeiro, em seguida, derrubada pelo caráter barra, você precisa estar familiarizado com uma única linha e multiplicando comentários, porque na maioria das aplicações você vai usar uma combinação fora ambas essas abordagens de comentários. Agora que sabemos maneiras diferentes de comentar, vamos passar por algumas práticas recomendadas a seguir. Vento que vem código júnior sempre vem em seu código como você está certo nele. Eu sei que escrever comentários pode ser chato, mas acredite em mim, você vai ser grato quando você pode entender o que o seu código está fazendo. Apenas de ler o comentário como oposto de passar por 100 off lines fora do JavaScript. Segunda coisa. Comentário. Claramente, use mais inglês ou qualquer idioma que você preferir e menos código. Não complique seu Kamen é grande, claro e conciso. A última coisa é, não superar e comentar coisas óbvias reduzirá a legibilidade. Se você seguir essas práticas recomendadas, você será capaz de escrever canhões melhores, e isso vai tornar o código mais fácil para você e para seus companheiros de equipe ler. 12. Tipos: nas melhores lições com tão diferentes tipos de valores com tão bilhões, uma força de números verdadeiros ou falsos e muitos mundo e coisas diferentes que pertencem ao JavaScript. Esta respiração e as coisas são formalmente conhecidas como tipos. Felizmente, JavaScript é gentil o suficiente para nos deixar usar esses tipos sem planejar com antecedência. Apesar de como é simples usar este tipo, há muita coisa acontecendo nos bastidores. É importante saber o que o JavaScript está escondendo de você, porque ele não vai ajudar você a entender seu código mais facilmente. Pode até ajudar a identificar o que deu errado. Sabíamos que o programa não está funcionando corretamente antes de descobrir o que o JavaScript está escondendo. Vamos ver alguns tipos básicos de script Java string. Esta é a estrutura básica para trabalhar com o número de texto. Ele permite que você trabalhe com números de barras, tomar um verdadeiro ou falso não representam o equivalente digital off. Nada indefinido. Isso é retornado quando um valor deve existir, mas não gosta quando você declara uma variável, mas não atribui nada a ela. Objeto. Isso atua como um contêiner para outros tipos, incluindo outros objetos. Cada um desses tipos é único, em que ele faz Mas há um grupo simples em padrão sob. Estes tipos podem ser simples anteriormente conhecidos como primitivos, ou podem ser complexos, ou podem ser complexos, anteriormente conhecidos como Objects Primitives, Our Atomic. Em outras palavras, eles não podem ser desconstruídos em tipos simples. Em JavaScript, tipos primitivos são número de string Boolean Não em tipos indefinidos. Objetos, por outro lado, são um pouco misteriosos. Então, o que são exatamente? Na verdade, estamos cercados por objetos. Quase tudo o que sabemos pode ser considerado um objeto. Um celular é um objeto. Você pode ligá-lo e desligá-lo, fazer chamadas, assistir vídeos e fazer todo o tipo de coisas. Os objetos estão em abstração. Você pode usá-los facilmente sem saber o que está acontecendo por trás da cena. Por exemplo, não importa o que vai dentro do seu telefone, que tipo de materiais ou que componente eletronique são usados. Tudo o que nos importa é que o telefone faça o que é dito. Basicamente acho que muitas vezes objeto como uma caixa preta. Você pode ver o que está acontecendo lá dentro, mas sim. Não importa, desde que funcione. Isso mudará quando aprendermos a criar. As entranhas muitas vezes se opõem para o momento. Vamos mantê-lo simples além do Brault e tipos que tão cedo temos também um monte fora objetos pré-definidos em Javascript que podemos usar cordas atua como uma borracha em torno da string . Primitivo brilhante atua como um rapper em torno do número primitivo barras atua como uma borracha em torno do número primitivo matriz lida com coleta de data de dados ajudá-lo a trabalhar com datas. A minha ajuda a manipular números. Explicarei cada objeto com grande detalhe mais tarde. Por enquanto, vamos ver alguns trechos de código para lhe dar uma ideia sobre eles. Aqui temos objetos diferentes. Temos um objeto string, uma data, uma matriz no objeto 1.000.000.000. Observe como usamos a nova palavra-chave seguida pelo nome fora do objeto para criar cada um desses objetos. Eu sei que você provavelmente está confuso sobre o propósito de ter um objeto formando fora das cordas e números primitivos. Depois de toda a forma de objeto e forma primitiva fora esses tipos parecem muito semelhantes. Vamos ver outro exemplo. Então aqui temos uma cadeia primitiva e um objeto estranho ambos com o mesmo valor. Então o que vamos ver você impresso será idêntico abaixo da superfície, embora ambos Muppet no objeto Muppet são muito diferentes. Vamos sentar diferença gradualmente nas próximas lições à medida que exploramos os tipos construídos em mais profundidade. 13. Corças: como seres humanos, usamos palavras quase o tempo todo para nos comunicarmos. JavaScript também usa palavras ou anteriormente conhecidas como strings, para comunicar informações entre o programa e o usuário. Fora do programa. Cordas não são como frases. Eles são escritos em um código como uma sequência citada de caracteres, obtendo suas aspas simples ou duplas. Como você pode ver nestes exemplos, a fim de tornar nossa vida mais fácil ao trabalhar com strings, há uma implementação de objeto string subjacente em JavaScript que contém muitas propriedades. Não vou rever todas as propriedades existentes. Isso seria muito chato, mas eu me concentraria nos mais importantes. Em JavaScript. Você pode inventar, inata ou combinar duas cordas em conjunto usando o operador plus. Aqui eu combinar saudação e alvo juntos. Mas como você pode ver, eu especifico um caractere de espaço vazio entre eles para ter certeza de que há um espaço entre o mundo Olá e o mundo, todos. Então, se eu executar este script, o resultado será Olá, pessoal. Nós também podemos adicionar os objetos string para a mistura, mas teremos o mesmo tipo no final, que é uma força primitiva. Então aqui eu vou mudar isso de uma força primitiva para um objeto corda usando novo ataque. Há outra maneira de ter um espaço vazio entre as palavras Olá e todos. Em vez disso, fora deste espaço vazio aqui, eu posso simplesmente removê-lo e viciado aqui. Então, agora, se eu rodar o script, você pode ver que teremos o mesmo resultado. Outra palavra para combinar greves em JavaScript é usando o método concurred. Você chamou esse método de em uma string. Então você indica a outra força, primitivos e objetos que você quer se juntar. Pessoalmente, eu prefiro usar o operador plus porque é mais rápido. Uma corda pode parecer uma unidade de malha próxima, mas é, na verdade, feita a partir de personagens fora de uma Siri. Cada caractere pode ser acessado indicando a posição do índice fora do caractere dentro colchetes. Que personagem você acha que será exibido? Se sua resposta é S, então parabéns. Você está certo. Se você estava esperando outro personagem, provavelmente o último A em Javascript aqui, então você deve saber como a exposição final funciona em Javascript e muitas outras línguas. A posição do índice começa a partir de zero e move-se para cima a partir daí. É por isso que a posição do índice é para mas a contagem off. O elemento nessa posição é mais cinco. Outro foi usado. A maneira de acessar um personagem é usando o método tubarão em. Então aqui eu posso remover os colchetes e em vez disso dizer, mas tiro em quatro, este método retorna o caractere no especificado e exposição, então aqui o resultado será semelhante. Então, o que vimos antes? Se você quiser acessar todo o personagem em uma força, você pode olhar através das posições de índice. O ponto de partida do seu olhar será zero no final fora de seu lope é realmente o comprimento fora de sua corda. Em vez de contar o número de caracteres em sua string, há uma propriedade muito útil para determinar o comprimento em JavaScript que a propriedade é Yep , você adivinhou comprimento. Às vezes você não está interessado em toda a cadeia, mas apenas uma parte dela. Para extrair os coquetéis, você está interessado. Terminar em uma corda. Temos dois métodos. Fatia e sub str o método fatia. Extraia uma seção de uma string dependente das posições inicial e final. Seu passado faz isso aqui, maneira fatiado a pizza valiosa nós extraímos os coquetéis entre a posição índice 6 e 17. O resultado. O sub string é o melhor é retornado. O outro método que ajuda sua string divisor é o subtexto que você é método. Este método retorna os caracteres em uma string, começando na posição inicial e todo o caminho através do comprimento fora de um substrato. Neste exemplo, começamos a partir do primeiro caractere, que tem a exposição final fora de zero e contou cinco caracteres, então o resultado será a palavra pizza sendo retornado. Você também pode chamar esse método sem especificar o argumento length, caso em que você obterá a força que vai da posição inicial até o final. Então, se eu parasse do índice partidário seis. O que ele vai devolver? A corda sub é a melhor coisa de sempre? Uma das coisas poderosas que você pode fazer ao trabalhar com strings é procurar um caractere ou caracteres dentro da string. Você pode fazer isso. Ele estava no índice fora do último índice off e combinar métodos. Vamos primeiro ver o método index off. Este método ICS como um argumento o caractere ou caracteres que você está procurando e retorna o índice fora da primeira ocorrência. Se os caracteres especificados não forem encontrados, ele retornará menos um. Então aqui estou eu tentando encontrar a palavra dólar dentro da minha força. O método index off é gentil o suficiente para nos informar que esta palavra existe no 11º em Exposição. Está tentando procurar algo que não existe. Por exemplo, X. Você pode ver que esse método retorna menos um. Agora vamos passar para o último índice off método. Como você pode adivinhar o seu nome. Este método retorna a última ocorrência fora do valor especificado se nada foi encontrado mais tarde sintoniza Minds um índice off. Último índice off pode tomar outro argumento. Além dos personagens que você está procurando, este argumento é a posição inicial onde você deseja começar seu surf. O que acha que você deve lembrar sobre o índice off e menos index off métodos é que eles não fazem uma distinção entre palavras inteiras ou o que você está procurando. Sendo uma parte de um conjunto maior de personagens que se movem, vamos agora ver o método de correspondência. Este método muito é uma string contra uma expressão regular e retornar uma matriz contendo o em valor muito resultado expressões regulares são pontos fortes de texto especiais usados para combinar combinações fora caracteres em pontos fortes. Para construir uma expressão regular, feche melhor o surf entre barras. Aqui teremos uma correspondência com Lee se os sequestradores E V. C. ocorreram juntos nessa ordem, qual é o caso aqui? Então isto vai acender uma mensagem dizendo à ABC, porque temos uma combinação que vimos antes como chegar, Capitão. Oito cordas juntas. Agora vamos fazer o oposto dividindo uma corda. Para fazer isso realmente foi exibido método, que dividiu a força em uma matriz de sub strings, a fim de determinar onde exatamente. Para fazer cada divisão, precisamos especificar um separador. Digamos um exemplo. Nossas lojas variáveis meses, uma cadeia fora meses separados por vírgula. Usamos este método de sangue para separar cada mês. O personagem separador que ele é é Kama. Como resultado, conseguimos uma matriz de 12 meses. A última coisa que vamos ver é como converter uma string em maiúsculas e minúsculas. É bem simples. Nada complicado Os métodos estavam indo para usar são métodos em maiúsculas e minúsculas. Vamos ver como funcionam. Então aqui temos uma mudança valiosa que tem uma corda em minúsculas. Então, se eu quiser converter este dedo do pé em maiúsculas, tudo o que eu tenho que fazer é chamar o método do dedo maiúsculo neste valioso quando o oposto. Se eu quiser converter esta bebida dedo do pé, minúsculas eu vou fazer é o mesmo chamando para o método minúsculo sobre este valioso. Então vamos rodar este script e ver o que acontece. A primeira coisa é convertida biqueira maiúscula, e o segundo 1 é convertido, convertido em minúsculas. Antes de terminar esta lição, eu quero apontar algo em uma escuta anterior. Eu falei sobre primitivos e objetos, e eu disse que os primitivos são simples e diretos. Ao contrário dos objetos, eles não têm propriedades ou métodos que nos permitem brincar com seus valores. Mas nesta lição, fizemos muitas coisas interessantes com nossa força Primitivas. Então, o que está acontecendo aqui sem muitos detalhes chatos? Quero que saiba que o JavaScript converterá temporalmente sua tribo primitiva em reboque no objeto sempre que quiser acessar uma propriedade ou um método. Uma vez que esse objeto serviu seu propósito, ele desaparece, deixando você com o resultado final 14. Matters: Nesta lição, vamos ver uma noção fundamental em JavaScript conhecida como uma raça. Uma matriz armazena uma sequência de valores que estão todos desligados ao mesmo tempo. Uma maneira de criar uma matriz é usar um foguete aberto e fechado. Então, dentro dos colchetes, você pode colocar seus itens e separá-los por vírgulas. Agora, como acessamos nossos itens? Bem, você já sabe como fazer isso. Lembre-se de como acessamos caracteres dentro da string é da mesma maneira, com um aumento dentro de uma matriz, cada item é atribuído um valor de índice, começando com zero. No nosso exemplo, biscoitos e creme teriam um valor de índice ou zero. Então, se eu quiser obter o sabor de chocolate, Eu vou montar os seguintes sabores de sorvete. E dentro dos suportes, vou colocar o índice fora do chocolate, que é aqui o número um. Então eu posso assinar isso para uma variável, por exemplo, sabor. E aqui está, assim como fizemos antes. Você pode olhar através de sua matriz usando um loop for e a propriedade length. Os valores de índice fora de nossa matriz, começam de zero e terminam em unicidade do que seus arrays link. Isso ocorre porque a propriedade length retorna conta off. Todos os itens em nossa matriz, que está neste exemplo, é bom, mas o valor do índice deve parar em quatro porque estamos começando de zero. Se tentarmos acessar o vôo de sorvete, por exemplo. Ok, o que vamos receber é uma mensagem dizendo indefinido. Se você quiser adicionar itens à matriz, você pode usar o método push. O método push é chamado em sua matriz e leva o item que você deseja adicionar. O novo item será adicionado no final da sua matriz. Se você queria ser um anúncio no início, seu array usou o método on shift em vez disso. O valor de retorno da chamada em ambos os métodos push e shift é o novo comprimento fora de sua taxa para remover itens da matriz usado os métodos shift e bob. O método shift remove o primeiro item de uma matriz e devolve-lo enquanto o método pot remove o último item da matriz e devolve-lo. Tenha em mente que, se você estiver adicionando itens ou removendo-os, o primeiro item na matriz terá sempre um valor de índice igual a zero. Há também um método de fatia para a corrida. Ele permite que você copie alguns itens de sua matriz e Ritter uma nova matriz com apenas aqueles itens copiados neste exemplo, recapitando todos os itens entre o primeiro e o quarto itens em nossa matriz e os retornou para o novo raio. Nada acontece com a nossa matriz original porque esses itens são apenas copiados. Se você estiver procurando por um item dentro de uma matriz, você pode usar dois métodos index off e último índice fora do índice off método retorna o valor de índice fora da primeira ocorrência fora do item que você está procurando e o último índice off método retorna o valor do índice fora da última ocorrência do item que você está procurando. Se nenhum item foi encontrado ambos off, este método retorna menos um. 15. Números: números são uma parte essencial do JavaScript. Você trabalhará com eles a maior parte do tempo, especialmente quando tentar contar algo. Declarar um número em JavaScript É bastante simples. Isso não é o caso em outras linguagens de programação como Java ou C Plus Plus. Onde você tem que declarar um número como V tipo suficiente? Não é duplo flutuador, etc. Os números JavaScript são sempre 64 bits flutuantes. Números de pontos também podem ser escritos com decimais e com imitação científica usando expoentes. Você também pode declarar números negativos sobre como colocar o caractere menos antes do número. Desculpem dobras. É hora de matemática. Não se preocupe. É matemática simples. Em JavaScript, você pode fazer as operações matemáticas básicas que você aprendeu na primeira série, por exemplo, adição, subtração, multiplicação e divisão algo que você vai ganhar por muito quando trabalhar com membros é incremental ou um decreto mencionar um valioso assim como vimos com os quatro. Aqui está um exemplo off incrementos em uma variável por um. Podemos simplificar esta linha fazendo o seguinte X mais, mais geralmente se você quiser incrementar por s e determinado número e você pode fazer o seguinte. Isso significa exatamente o seguinte. Não há diferença. Esta primeira sintaxe é mais simples do que esta. Você pode fazer as mesmas coisas com outras operações. Tudo o que você precisa fazer é substituir o sinal de mais com o operador fora de sua escolha. Uma coisa que você deve ter em mente ao usar o sinal de mais duplo ou o sinal de menos duplo é que se eles aparecem antes depois do valioso você é incremental ou d'Yquem, Inter realmente importa. Um exemplo ilustraria o que estou tentando dizer. Então aqui temos uma variável chamada X que tem um valor off cinco, e estamos incrementando nesta parábola. Qual você acha que seria o resultado desse alerta? Vamos rodar o script em C. Temos X Cócegas seis e Y é igual a cinco X igual. Seis. Isso é esperado porque nós incrementar e o valor de X. Mas por quê? Por que tem um valor de cinco e não seis? A razão é porque o sinal duplo de mais aqui aparece após o X valioso. Então, estamos atribuindo o valor de X, o valor antigo off X para a variável y antes de incrementar nele. Se colocarmos o sinal de mais duplo na frente desta vez, o que obteremos é X igual a seis e y igual a seis 16. Objetos: em uma escuta anterior. Demos uma olhada nos objetos, e eu te disse que você deveria pensar neles como caixas pretas. Mas agora é hora de abrir as caixas e ver o que tem dentro. Para criar um objeto, use a sintaxe seguinte, a palavra-chave var, seguida do nome fora do objeto e, em seguida, alguns colchetes de abertura e fechamento. Simples é essa linha? Criar um carro de ouro objeto. Nosso olhar homem objeto carro está atrasado para o aqui, mas na verdade ele está conectado ao tipo de objeto principal. Como é isso? Bem, por que não definimos nenhuma propriedade para o nosso objeto de carro? Existe uma propriedade interna especial que existe chamada proto. Esta propriedade faz referência ao que é conhecido como um objeto de protótipo. Um objeto protótipo é merece que outro objeto é baseado em. Dizemos que o objeto do carro herda do tipo de objeto. É por isso que todas as propriedades que o objeto contém podem ser acessadas através do nosso objeto de carro. Vamos ver um exemplo aqui. Estou chamando um método chamado para corda em nosso objeto de carro. Apesar do nosso objeto carro não ter qualquer propriedade chamada a tensão, podemos ver o resultado de chamar este método em vez de obter um erro ou indefinido? - Não. Vamos definir algumas propriedades em nosso objeto de carro, por exemplo, nome e modelo. Podemos encontrar essas duas propriedades usando três abordagens. A primeira abordagem é usando a documentação. Então aqui eu tenho um nome, propriedade com esse valor ou para todas as feridas na propriedade modelo com um valor de fantasma. A segunda abordagem envolve o uso nos colchetes, então eu vou remover a documentação e em vez disso, uh, alguns colchetes e fazer o mesmo para a propriedade focinho. A última abordagem envolve estender nosso objeto inicializar er em impostos como este. Então aqui nós queremos dizer o nome é rolos, palavras vírgula, então modelo Phantom. Agora eu posso remover isso. Agora vamos nos divertir mais e criar um método chamado get model. Este método irá retornar o valor da propriedade modelo para fazer isso, uh, um coma aqui, depois o nome do seu método seguido por Cullen. Então a função de palavra-chave, assim como você, criaria uma função normal, mas sem o nome, porque já a temos aqui. Então queremos que o nosso método get model para retornar o valor fora da propriedade model, então eu vou dizer Return on, Vamos adicionar algum texto, por exemplo. Modelo é e pode cafeinado com este modelo de ponto. Não se preocupe com a palavra do disco “E”. Falaremos sobre isso mais tarde. Agora vamos buscar o método do modelo usando o míssil de documentação mais cedo. Então eu vou dizer outro núcleo, mas obter móvel agora. Se eu rodar este script, vamos ter focinho é fantasma. Às vezes você precisa criar objetos que são basicamente os mesmos. Então aqui temos três objetos carro, caminhão e ventilador. Cada um desses objetos tem propriedades verdadeiras. Nome e modelo Onda método Get modelo. Observe como o método get mobile é o mesmo para cada um desses objetos, então há uma duplicação em nosso código. Para corrigir isso, usaremos o princípio da herança que vimos antes. Nós vamos criar um objeto pai que contém as propriedades que são mais genéricas e não precisa estar no objeto filho em si porque o nome e o motile são exclusivos Para cada objeto que temos, vamos deixá-los como eles são. Mas o método get model, por outro lado, pode ser colocado em objeto aparente que o resto dos objetos pode herdar de Vamos chamar este veículo objeto. Então eu estava vindo aqui no Klauer um objeto de veículo. Agora vou copiar e passar isso dentro do objeto do nosso veículo. Mas agora removerei todos esses objetos que não podemos criar assim ou de outra forma. O protótipo desses objetos será objeto e nós não queremos isso. Queremos que o objeto veículo com a propriedade get model seja o pai. Então nós temos que fazer a propriedade protótipo no carro, caminhão e van objetos referências veículo. Para fazer isso, vou usar o objeto que criar significou isso. Este método cria um novo objeto com o objeto protótipo especificado. No nosso caso, é veículo e agora podemos adicionar nossas propriedades como antes para criar os outros objetos . Basta copiar e agilizar isso e fazer as alterações desejadas. Se você está acompanhando e entendendo o que está acontecendo, você deve dar um tapinha nas costas. No entanto, ainda não terminamos com Stillman. Preciso ver o que significa a palavra “disco e”. Vamos tentar chamar o método do modelo get met. Então aqui eu vou dizer carro que obter modelo em. Vou chamar a outra função para ver o resultado. Então, se eu rodar este script, o que eu vou conseguir o modelo dele é fantasma. Não, se eu fizer isso para o objeto então então aqui eu vou substituir o carro por então se em drogas o script novamente. O que eu vou obter este modelo é City Express dependendo de qual objeto você chamou de obter modelo foram devolvidos O modelo apropriado Note que não há propriedade modelo em nosso veículo. Object Então, como vem obter modelo retorna o valor certo A resposta está com Será que esta palavra-chave a mesa? Você foi o primeiro objeto que o nosso método get model bom chamado de. Em um caso foi que foi o carro e os objetos van que ambos continham a propriedade model antes e nesta lição eu quero dizer que javascript não fornece classe percebida, o que pode ser um pouco confuso para os desenvolvedores que estão acostumados a trabalhar com linguagens baseadas em classes como Java ou C plus. Mas ele faz, no entanto, usar o protótipo todo modelo de herança que vendemos, que é de fato mais poderoso do que o modelo clássico 17. Expressão de função imediatamente: até agora, estamos sendo usados em funções bastante pesadamente. Como você já sabe. Eles são extremamente úteis e nos permitem escrever código que pode ser usado uma e outra vez . Vimos como criar a função e chamá-la usando seu nome, mas também podemos criar uma função sem dar-lhe um nome. Esses tipos de funções são chamados de funções anônimas para criar função anônima. Simplesmente remova o nome daqui. Mas agora eu não tenho como chamar essa função, então eu preciso atribuir-lhe uma variável. Vou usar apenas o mesmo nome usando o nome da variável, seguido de alguma tese de perdão. Eles agora podem chamar minha função anônima. Agora é hora de olhar para outra variação de função, conhecida como uma expressão de função imediatamente invocada ou I P. Para resumir, I fee é uma função JavaScript que executa um logo que é definido. Em vez de lhe dar diretamente a expressão, muitas vezes eu acho, ela é criada passo a passo. Primeiro, vamos criar uma facção anônima como aprendemos a fazer a seguir. Vamos roubar nossa função dentro de parênteses para dizer Javascript que é uma expressão. Agora precisamos que isso seja executado imediatamente para que eu adicionarei outro par fora. Parentis está no final, pai com por um centavo. Parabéns. Você escreveu com sucesso na expressão de função imediatamente invocada. É bastante complicado, então, por causa dos muitos parênteses, assim como uma função normal. Se ele também aceita argumentos, a única diferença é como você passa nesses argumentos. Então aqui eu tenho um exemplo fora de uma função, o outro a alguma variável verdadeira que melhor o valor cinco e sete para esta função. Cinco na Srta. Crate, o resultado dos 12 como esperado. Agora que aprendemos a criar uma boa taxa com e sem argumentos, vamos ver quando precisamos usá-los. Sinto-me usado ao luxo de poluir a escola global em JavaScript. As variáveis definidas dentro da função estão no escopo local, enquanto as variáveis definidas fora da função estão na escola global. Porque a faca, ele é uma função em um valioso para declarar dentro dela. Nosso local para essa função. Isso ajudará você a evitar colisões entre seus objetos de valor e outras variáveis já definidas com o mesmo nome no escopo global. Esta técnica é muito popular entre os desenvolvedores foi chamado Será usado na aplicação de outra pessoa . I taxas também são usados gabinetes. Há algo que eu não mencionei na lição de encerramento. Fechamentos, armazenar referências para as funções externas. valor. Eles não começam as luvas de valor real e exemplos. Você pode entender o que eu disse para tornar as coisas interessadas em seu uso, o que aprendemos sobre matrizes e objetos e criar uma matriz de objetos chamados cães. Cada objeto contém o nome e raça fora de um cão. Aqui eu tenho uma função chamada cachorros. Esta função tira uma matriz de objetos escuros, e Richard e Ray ou funções que traz o nome e respirar ficou frio. Deixe-me chamar essa função de cachorrinhos. Primeiro. Vou me misturar no espaço. Eles, eu diria que Sochi é Andi. Vou passar a nossa matriz de cães para ele. Então esta função retorna uma matriz ou funções algumas que eu vou declarar uma função docks ouro variável em. Vamos chegar lá retornou função neste valioso. Agora eu vou ter a primeira função usando a notação colchetes nós. Então, antes de atribuir isso a uma valiosa Andi, eu diria que quebrou em True. Agora que eles têm a primeira função vou alertá-lo antes de executar este script. O que você espera ver? Porque estamos recebendo o primeiro item das funções de raio fora. Parece razoável esperar. Meu nome é Pickle e, um, uma treta, mas o que veremos é totalmente diferente. Aqui temos o forro da Lulu e eu sou um portal que é o último objeto em nossa matriz de cães. Então, o que está acontecendo aqui? Estamos empurrando cães para um Que E como você sabe, esta disfunção está tirando valioso de fora e usando-o dentro. Isso é o que chamamos antes do encerramento. Nossa função é fechar sobre o cão, o que significa que temos uma referência a essa variável. O problema aqui é que nós temos um loop que está mudando o valor deste valioso. No momento em que nosso loop tem para o leitor e para a conclusão, nossos fechamentos farão referência ao último objeto com o nome Lulu. Quando executarmos a seguinte linha, o que teremos é que meu nome é Lou e um total de “ok”. Até agora, entendemos por que nosso código não está funcionando corretamente. Para consertar isso, vamos fechar algo que não muda. Em vez de fechar algo que muda. E a nossa amiga Ivy vai ajudar-nos a conseguir isto. Vou fazer algumas mudanças. Eu vou colocar tudo isso dentro de uma faca E. Então aqui eu diria que a função que tem ele para mim, também. Na natureza da fazenda será cães vai dizer o para comida. E aqui eu vou mudar o nome valioso com o apenas para fazer as coisas mais jogarem para você. Preciso de outro parto aqui e é isso. Certifique-se de que você tem todas as suas peças pais e colchetes encaracolados nos lugares certos Aqui. O perímetro ainda muda a cada vez que passa pelo loop. Mas a função que adicionamos é executada imediatamente. Ele está correndo dentro do loop como dedo oposto depois que a queda já terminou. Agora nosso código vamos trabalhar exatamente como esperamos. Então temos uma mensagem dizendo que meu nome é veículo e eu sou um fanfarrão 18. Modelo de objeto de documento (DOM): quando você abre uma página da Web em seu navegador, o que você vê é uma combinação de CSS HTML e JavaScript. Trabalhando em conjunto para criar seria exibido para fazer sentido fora desta mistura, seu navegador segue uma certa estrutura hierárquica. A estrutura é conhecida como o modelo de objeto de documento para o enterrado à esquerda é um exemplo fora HTML. A cadela da direita é como o lixo fora deste exemplo parecia. O esterco é composto a partir de cada elemento de canal, atributos de texto e muitas outras coisas. Todas essas coisas são conhecidas como notas. Cada elemento HTML está associado a um filho. Por exemplo, um elemento de morte é em cada geral, o elemento todas as tribos estendem a partir do objeto nó. O enterrado não permite que você acesse cada elemento Jamel, mas também modifique esses elementos antes de aprender a fazer isso. Deixe-me primeiro apresentar a um objeto especial o objeto janela representa a janela do navegador . É a estrada fora da sua hierarquia. Você pode fazer muitas coisas com objeto de janela, como determinar o tamanho fora da janela do navegador. Manipulando quadros jogando com essa barra de rolagem e muito mais objeto de documento representam sua página da Web. É o ponto de partida se você quiser acessar qualquer vantagem. Danielle Element em uma página Não, que qualquer alteração que você faça na cúpula via JavaScript seria refletida no que é exibido em seu navegador. Isso significa que você pode fazer todos os tipos de alterações, como adicionar um elemento, removê-lo estilo em seu conteúdo Será CSS e muito mais? Então você tem todos esses elementos HTML pendurados em sua página e você deseja acessar esses elementos ou modificá-los. Nesta aula, nós vamos aprender como utilizar dois métodos chamados seletor quadrado e seletor de consulta, todos para encontrar elementos na cúpula. O método seletor de consulta toma como argumento uma string contendo um seletor CSS. Queers Elector retorna o primeiro elemento que corresponde ao seletor especificado, enquanto Squares Selector todos retorna uma lista fora do elemento que corresponde ao seletor especificado . Vamos dar uma olhada no seguinte código HTML Aqui nós temos até a morte com um I D off menu e conteúdo, respectivamente, respectivamente, e então nós temos mais duas vidas com um valor de classe fora do item e adiciona cada um deles contido a gastar elementos. Agora vamos ver o que acontece quando você usa o seletor de coro e seletor queer todos os métodos neste código HTML. Então, se eu quiser acesso ao dedo do pé, a morte foi idee é cardápio. Tudo que eu tenho que fazer é chamar meu método seletor queer e passar o menu I D para ele. Não se esqueça de colocar o sinal de número primeiro porque é um I d. Por outro lado, se eu quiser acessar o elemento Dave que tem uma classe chamada item, bem, eu tenho que fazer é chamar meu seletor queer e dar-lhe o não estão em desta vez com um ponto na frente dele. Se eu quiser selecionar todo este imposto plano que estão dentro da nossa classe, esse item também são contend em nosso elemento de morte. Ganhe com um i d off menu. Tudo o que eu tenho que fazer é chamar meu seletor de consulta método todos porque temos vários itens e, portanto, o seletor Sears A apropriado. Até agora, você tem uma idéia geral sobre o que o cão é e você também sabe como encontrar elementos cujo seletor de inquérito e seletor queer tudo o que você será. O vento na maior parte do tempo está modificando a cúpula. Você não é elementos contêm propriedades que permitem que você obtenha e defina valores e métodos de chamada a funcionalidade cada elementos burros fornecer uma dispersão através do elemento de aceno e elemento HTML baseado mergulhadores, assim como vimos anteriormente com herança. Vamos dar uma olhada no seguinte código HTML e tentar modificar as coisas por aqui. Você pode ver um parágrafo, este plano alguns MIPs Laura indexados. Para aqueles de vocês que não sabem o que é o alarme Epsom, é um texto de preenchimento usado para demonstrar elementos textuais antes que o conteúdo em si produzido. Então vamos mudar a lei. Remit enviou uma mensagem de texto. Primeiro, precisamos obter um dedo do pé de referência, nosso parágrafo usando nosso seletor de consulta amigo velho. Para fazer isso, eu vou declarar uma variável chamada, em seguida, uma vez que seu valor para documento não consulta seletor, em seguida, passou o parágrafo I d para este método. Em seguida, vamos usar um conteúdo de texto frio propriedade para substituir o Lauren Ipsum por algum conteúdo realmente significativo. Então, usando nossa variável de parágrafo vai dizer Bogra conteúdo de texto ponto. Então eu vou definir o texto para trilho conteúdo significativo. Então, agora, se estivéssemos em nosso script, você pode ver que o texto mudou todos os seus elementos Jamil podem ter atributos. Eles fornecem informações adicionais sobre um elemento. Por exemplo, o atributo riff de cinzas off em um tanque para obter o valor fora em um tributo, vamos usar o método. Receba um tributo. Então aqui, se eu quiser obter o valor de atributos Ashraf tudo que eu tenho que fazer seu primeiro ano quadrados eleitor para obter uma referência para a hora que uma tag, em seguida, armazenou esta referência dedo uma variável. Eu chamei de “link”. Então eu me lembro do meu método get atributo sobre este valioso em. Já passei o nome fora do atributo. Se eu executar o script, eu devo obter esse valor. Se você quiser colocar um valor para o seu atributo, você pode usar o atributo de conjunto de métodos. Por exemplo, se eu quiser mudar isso do meu site dot com para outro site dot com, o que eu tenho que fazer é usar minha variável de link que tem a referência para a tag oito Esteve usando o método de atributo sit. Agora eu posso especificar o tributo em que eu quero mudar o valor, em seguida, o valor, o novo valor que eu quero. Então aqui, se eu rodar o script, eu deveria obter outro site dot com 19. Como criar seu site: Na lição anterior, aprendemos como modificar os elementos da madrugada usando JavaScript, mas os elementos HTML não são apenas X e atributos. Há também um parque estético para eles. Estou falando do estudo deles. O mais comum onde usado para vender cada elemento terminal é criando uma folha de estilo e colocá-la e colocar em regras de estilo dentro dela. Por exemplo, essa regra de estilo afetaria no elemento que se parece com isso. Além do INL Einstein, há outra abordagem que você pode usar para começar as coisas. Esta abordagem envolve o uso do mudo e JavaScript. É possível usar JavaScript para iniciar elementos, e é isso que vamos aprender. Você pode perguntar, Por que eu iria querer usar JavaScript para estilo no Element? Essa é uma boa pergunta quando você usa folhas de estilo ou em linhas vezes o estilo no efeito Texas assim que o elegante como a página é carregada. Esse seria o seu objetivo a maior parte do tempo. Mas às vezes você quer fazer algumas alterações dinamicamente, como esconder algo quando o usuário clica em um botão. Nesse caso, regras de estilo ou tempos de linhas não ajudarão você, então a solução é usar JavaScript. Existem duas maneiras de estilizar no elemento usando JavaScript. Uma maneira é definir uma propriedade CSS diretamente no elemento. A outra maneira é adicionar ou remover valores de classe de um elemento a fim de aplicar ou ignorar determinadas regras laterais Para definir uma propriedade CSS diretamente em um elemento, você pode usar o objeto Stein. Neste exemplo, eu tenho um elemento diff com um 90 de desconto na minha morte. Eu quero sentar o fundo fora deste elemento para uma cor azul. Primeiro de tudo, eu tenho a minha referência visual para o meu elemento def aqui. Eu não usei seletor quadrado, mas eu usei outro método chamado get element por i. D. Este é outro método muito útil para selecionar um elemento por sua I d notar como eu não coloquei qualquer sinal de número. Eu dou diretamente o valor da identificação. Em seguida, usando o identificação Em seguida, meu Dave valioso, Eu chamei o objeto estilo, em seguida, a propriedade de cor de fundo e defini seu valor como azul. Agora, se eu em torno deste script, você pode ver que eu recebo um aviso de fundo golpe como eu escrevi a propriedade de cor de fundo normalmente em CNN s s você escreveria com um traço entre fundo e cor se fizéssemos isso aqui, no entanto, JavaScript com reclamações. Então, para especificar uma propriedade CSS em JavaScript que contém um traço, basta remover o traço e capitalizar a primeira letra fora da segunda palavra. A segunda maneira de elementos de estilo é usando a lista de classes. AP em Classless. FBI fornece métodos e propriedades para manipular valores de classe fora de elementos dom, como adicionar ou remover classes. Vamos ver alguns desses métodos aqui. Eu tenho um elemento diff que tem uma idéia de recipiente na classe valor off descrição. Se eu quiser adicionar o valor de classe trouxe isso, por exemplo, para os atributos de classe fora do nosso elemento de morte. Primeiro, vou começar por obter uma referência ao elemento Dave. Ele estava no elemento get Por que eu d método. Então eu vou usar o treinador difícil e chamar o admitido na lista de classe e rápido o nome fora da nova classe que eu quero. Então isso deve sob os diferentes valores de classe que temos. Se eu executar este script, o que vamos obter é a descrição e quebrou que se eu quiser relacionar um valor de classe Tudo o que eu tenho a fazer é substituir o admitido pelo método remove. Isto deve alertar Lee para o vidro de descrição. Às vezes você deseja remover um valor de classe se ele existir ou fazer o oposto e nesse valor de classe para o elemento. Se não existe para facilitar isso, há um método Tuggle fornecido pelo FBI sem classe. A última coisa que fizemos foi remover o valor da classe de produto. Se eu quisesse, Toe acrescentou novamente, Bem, eu tenho que fazer é substituir mais. Nada com método de luta. Agora, se eu quiser meu script, o valor da classe de produto seria em novamente. Se eu voltar e copiar e acelerar esta linha, o valor da classe de produto deve ser removido novamente. Então o que devemos saber é sobre Lee a aula de descrição. Eu posso continuar fazendo isso o dia todo, então se eu não posso ser esta linha outra vez tentar copiá-la. O valor da classe de proteção deve ser adicionado em outro momento. Se eu quiser verificar para ver se um valor de classe existe em um elemento, eu posso usar o método contém. Este método retorna verdadeiro se o valor existe ou dobra caso contrário. A última coisa que fizemos foi no valor da classe de produto. Assim, as alegações compensadas devem retornar verdadeiro. Neste caso, eu vou para o para usar uma instrução if e ver se o valor da classe de produto existe. Vou substituir o método da selva por contém e dizer, se isto for igual a dois. Verdade, então eu não faria mal a uma mensagem dizendo que o produto de valor de classe existe. Como pode ver, essa é a mensagem que recebemos. 20. Como navegar no DOMs: anteriormente usamos consulta, seletor, Queer Seletor todos e obter elemento. Por que eu d toe acessar elementos html. Uma vez que fazemos isso, é responsável para se mover mais precisamente usando um monte de métodos e propriedades. Digamos, por exemplo, que queremos acessar em elementos pai. Para fazer isso, temos uma propriedade chamada Parent Node. Aqui temos um parágrafo com um parágrafo i d off. Eu acessar este elemento usando o método que vimos antes, que é seletor quadrado. Por alguma razão. Digamos que precisamos acessar o elemento de morte, que também é o pai do nosso parágrafo. A maneira de fazer isso é usando a propriedade do nó pai. Eu posso chamar esta propriedade na minha variável parágrafo. Então eu posso atribuir um dedo valioso. E agora temos um talento, Sesto, Sesto, nosso elemento de morte, que é o pai fora do nosso parágrafo. Se você quiser acessar um primeiro e último elemento pai, você pode usar métodos primeiro filho e último filho. Neste exemplo, o primeiro filho fora do nosso elemento de parágrafo é um nó de texto representado por algum texto, e o último filho está em um elemento de tag. Se você quiser recuperar os Filhos que são notas de elemento e não nós de texto, você pode usar para propriedades. Primeiro Elemento Filho e Último Elemento filho. Outra propriedade útil são as notas infantis. Esta propriedade retorna uma matriz que contém uma lista de filhos, muitas vezes elemento. Se você quiser acessar o próximo Devlin ou informar o seu sete frequentemente elemento, você pode usar as próximas sete e sete propriedades anteriores. Neste exemplo, encontramos o elemento da corte de sangue usando seu I D. Então acessamos seu próximo irmão, que é o elemento a. Este elemento tem um filho, e esta criança é um fixo. Saber que dizer e pensar. Então, isto tocou as varas? Eu uso a propriedade chamada dados. A propriedade sete anterior é usada da mesma maneira. Se aplicarmos aqui, teremos o elemento parágrafo em vez do elemento a. Se você estiver acompanhando e copiando o código, certifique-se de não deixar nenhum espaço ou quebras de linha entre os elementos de rua, pois em alguns espaços do navegador e quebras de linha são considerados, notas de texto também se certificam de usar o versão do Google chrome para que você possa obter o mesmo resultado que eu 21. Como criar e inserir elementos: Eu não gerenciei o General Element com o texto da cúpula três passos. Primeiro criamos o elemento, depois atribuímos atributos a ele. E, finalmente, inserimos no documento para criar um elemento que usamos para criar método elemento . Este elemento agora é criado, mas não inserido no documento, por isso não é visível, mas já podemos manipular adicionando algum atributo. Vimos Ho para adicionar atributos. Ele estava interessado atributos método. Mas também podemos definir atributos diretamente usando um D sair propriedades. Por exemplo, eu posso definir um I d. Atributo diretamente escrevendo o seguinte link Dodge I d. Em seguida, eu vou dar o valor que eu quero, por exemplo, meu link. Agora é hora de inserir o elemento criativo. Para fazer isso, vamos usar o método acontecer filho como você pode obter de seu nome. Precisamos saber a que elemento vamos adicionar o elemento criativo. Nós vamos adicionar o nosso um elemento dentro do nosso elemento parágrafo, então precisamos obter este elemento parágrafo primeiro. Para fazer isso, eu vou usar o elemento get pelo método I d. Agora posso usar o método da criança arma para adicionar uma imagem L. Agora que inserimos o nosso elemento, há algo faltando o conteúdo do texto. Felizmente, temos um método de nó de texto criado que nos ajuda a fazer isso. Vou declarar uma variável chamada Link Fixed. Há variável irá conter o valor ou o conteúdo de texto que queremos adicionar aos nossos elementos. É um documento que cria decks. Não digamos, por exemplo, meu site da Suker. Não, tudo o que temos que fazer é enviar o nosso elemento recém-inserido usando outra criança. Então eu vou chamar o link de valioso. Ele estava no tamanho da criança, consertado em JavaScript. Ele estava no tamanho da criança, Como muitas outras linguagens, o conteúdo das variáveis é passado por valor. Isto significa que, se um nome valioso, um contém ônix e atribuímos esse valor a outro valioso. Esse valor é copiado no novo. Se mudarmos o valor fora do nome também, o valor fora do nome um não altera isso. Suas variáveis são distintas. Além de passar por valor, JavaScript tem um passado por referência. Isso nos permite ter objetos de valor que apontam para o mesmo valor. Estou dizendo tudo isso porque quando manipulamos uma página usando o burro nós ganhamos para referências muito voltando ao nosso exemplo. Eu vou acessar os anos elemento recém-inserido na idéia vai dar-lhe para fazer isso. Eu vou declarar uma variável chamada meu link usando documento que get elemento por que eu d eu vou obter o meu link usando esta idéia apenas como minha alma antes de eu vou usar a propriedade riff hash para acessar diretamente o meu link. Então eu vou mudar este site para outro site para que não tenhamos pensado valioso. Isso contém uma referência para o elemento criado. E temos também a minha variável de link que também contém um referente a esse elemento. Aqui eu usá-lo o segundo valioso meu link para acessar a propriedade H Rafe e alterar o u R l. Mas se eu vir aqui e alertar o valor de cada propriedade ref usando o primeiro link valioso , o que eu vou obter não é o primeiro u l, mas o novo euro, que é outro ponto site com. Os valores verdadeiros apontam para o mesmo valor. É por isso que quando usamos um deles para alterar esse valor, podemos ver que mudança usaríamos o outro valioso também. E se quisermos duplicar um elemento? O que devemos fazer? Bem, você tem que cloná-lo para clonar um elemento usado o clone. Nenhum método. Este método leva um 1.000.000.000 verdadeiro ou falso. Se você quiser clonar o nó com seus filhos e eventualmente atributos diferentes, use true caso contrário. Use falso. Observe que o elemento clonado não é inserido até recordar o método filho arma para substituir um elemento por outro usado para substituir o método filho. Este método leva dois argumentos. O primeiro argumento é o novo elemento. O segundo argumento é o elemento a ser substituído. Assim como nota baixa. Este método pode ser usado em todos os tipos de notas, elementos, notas de texto, etc. Neste exemplo, o conteúdo de texto fora do link, que é o primeiro filho fora do elemento a, será substituído Aqui. Ali. Vice filho é executado no elemento a, que é o pai fora do elemento que queremos substituir. Para remover um elemento, use o método. Remova a criança. Este método toma como um argumento que elementos filho você deseja que seu movimento. Aqui usamos a propriedade nota libra com assim antes de obter o nó pai, que é o elemento parágrafo, em seguida, um usado remover filho para remover o elemento A. Não, que remover criança retorna o elemento excluído, que significa que é totalmente possível remover um elemento, em seguida, adicionado Mais uma vez, Como você pode ver, o burro é algo que podemos modificar de acordo com as nossas necessidades. Portanto, não há nada impedindo você de criar todos os seus elementos usando script Java. 22. Eventos: são ações que ocorrem quando o usuário ou o navegador manipula uma página. Um exemplo de um evento é um usuário clicando em um botão, fechando uma janela ou pessoa uma chave. Você pode responder aos eventos que desejar. Por exemplo, você pode exibir uma caixa de diálogo nos anos de tentativa de fechar a janela. Evite aborrecê-lo Com todos os eventos existentes, Aqui está uma lista dos principais eventos e ações que os desencadeiam. Não se preocupe, vou incluir esta apresentação de impressão de poder com o curso para que você possa ter esta lista e todos os outros slides também. Vamos aprender como realmente usar esses eventos. Vamos começar com algo fácil que não envolva a redoma. Veremos como usar os eventos com eles mais tarde. Aqui eu tenho um elemento span dentro de atributos chamados um clique. Este atributo tem um JavaScript chamado como um valor. Este código JavaScript é a função de alerta, exibindo uma mensagem desativada. Olá, Vamos de descrever e ver o que acontece. Como você pode adivinhar para este jogar a mensagem holo. Tudo o que temos a fazer é simplesmente clicar no texto que diz Quick, me Então, quando fazemos isso, você pode ver que uma mensagem dizendo olá aparece outro atributo. Quero mostrar-lhe o seu próprio foco aqui. Eu tenho qualquer elemento de entrada com um valor off take aqui e aqui. Eu tenho os próprios atributos de foco quando damos a este elemento o foco, sua mudança de valor de clique aqui para pressionar a tecla tab. Agora, quando o foco se apaga, o valor se torna clique aqui novamente. O elemento também tem em foco em casa. Atributo. Desta vez, quando damos ao elemento o foco, ele altera o valor fora da importação para você Agora tem o foco no link. Vamos rodar este script e ver o que acontece. É muito ter o meu elemento de importação com um valor off clique aqui, você fator o cuidado. Você pode ver que o valor mudou para pressionar o perú. Agora, se eu presidente for a tecla no meu teclado, o foco vai para o link e o valor da importação é alterado. Você sabe como o foco na linha agora que vimos como usar eventos sem os burros, é hora de envolver o tempo. Você pode perguntar por que usar o polegar Bem, se nós usamos o burro. Seremos capazes de criar o mesmo evento várias vezes, e também podemos usar o objeto de evento, o que lhe dá um monte de informações sobre os eventos acionados. Vamos enviar exemplo usando o evento clique aqui temos um elemento com um i D off link. Eu começo usando o método Queer Seletor para obter uma referência a esse elemento. Em seguida, eu uso meu elemento valioso e chamo o método ouvinte de evento de anúncio nele. O método ouvinte evento arte leva três argumentos, embora nós só especificado para aqui. O primeiro argumento é o nome do evento. Sem o avante, o segundo argumento é a função a ser executada. O terceiro argumento, que é opcional, tem a ver com borbulhar e capturar eventos. Falaremos sobre isso mais tarde. Vamos correr esta fruta e ver o que acontece. Como você pode ver, quando eu clico no elemento uma mensagem aparecer civil, você clica no link. Como eu disse antes, quando ele usou o burro, podemos criar várias vezes o mesmo evento para o mesmo elemento para que eu possa fazer o seguinte . Vou copiar isto em Basij. Então eu vou mudar de alerta para, e você tem uma segunda mensagem. Agora, se eu salvar isso e desenhar o interruptor, eu posso ver que quando eu clicar aqui, eu recebo a primeira mensagem dizendo que Você clicou em um link e eu recebo também a segunda Sra. Now vamos ver como remover um evento. Isso pode ser feito. Ele estava no método de ouvinte de eventos removido. Para remover um evento, você tem que passar os mesmos argumentos que você usou ao criar esse evento. Isso pode ser um problema se você deseja criar um evento com função anônima porque não temos uma referência a essa função para usar com o ouvinte de evento remove. Se eu entrar nesta linha e desenhar o script, você pode ver que eu recebo a mensagem quando eu clicar no link. No entanto, quando eu incomum isso e nós estamos no script, mesmo que eu clique no link, nada acontece. Lembre-se de quando vimos o ouvinte de eventos de anúncio pela primeira vez. Eu lhe disse que este método argumentos extras e que nós vamos ver o uso do terceiro argumento mais tarde. Bem, sou um homem de palavra. O terceiro argumento tem a ver com algo chamado engarrafamento e captura, borbulhamento e captura são passos muito distantes para a execução. Muitas vezes, a captura de eventos é executada antes de acionar um evento, enquanto o bubbling é executado após um evento ter sido acionado. Ambos definiram a direção de propagação com frequência. Evento. O que é um evento? Propagação? Vamos usar um exemplo para explicar. Se atribuirmos um evento clique nosso desenvolvimento e nosso elemento P e clicamos nos decks. Algum texto. Quais eventos serão complicados no início? Boa pergunta. Não, a resposta está em capturar e borbulhar. Se você decidir usar a captura, então o evento Dave será acionado primeiro. Em seguida, o evento de taxa vem depois. Por outro lado, se você anos borbulhando, esse evento dia será acionado primeiro. Então o DIV vem atrás dele. Observe que a face padrão é a face borbulhante. Vamos ver um exemplo para ilustrar o que eu disse aqui eu tenho para os elementos. O primeiro elemento passo tem uma idéia fora. Capturar um dentro deste o elemento que eu tenho um elemento parágrafo off eu capturaria o segundo elemento tem um I D off mas um e dentro deste elemento Dave, eu tenho um parágrafo com um i d off para a primeira coisa que eu faço é obter as referências ao meu elementos. Reparem como usei em Lee uma das nossas palavras-chave para definir quatro variáveis. Tudo que eu tenho que fazer é coma no pé depois de cada variável e um semi-cólon no final. Em seguida, eu criei meus eventos, e desta vez eu especifiquei o terceiro argumento, que quer leva verdadeiro ou falso. Se você especificar true como o argumento, isso significa que você estará usando a captura. Se você usar a captura, então o elemento da morte será acionado primeiro. Então o evento vem depois dele. Então vamos rodar nosso roteiro e ver o que acontece. Se eu clicar em Captain Face uma mensagem exibida, digamos. E se o evento for reto, então o Distrito de Eventos P. Se você especificar engana-nos, o argumento. Isso significa que você estará sumo borbulhando Se você usar borbulhar, o evento B será acionado primeiro, em seguida, fez a div. Um vem depois dele, Então, como você pode ver quando eu clicar no rosto borbulhante, o evento é acionado primeiro. Em seguida, o evento diff é jaker segundo 23. O objeto do evento: anteriormente, vimos como criar eventos em movimento. Vamos seguir em frente e ver o objeto do evento. Em primeiro lugar, o que esse objeto faz? Bem, o objeto de evento fornece informações sobre o evento acionado atualmente. Por exemplo, você pode saber qual elemento acionou esse evento. As coordenadas do cursor quais teclas são sua pessoa, coisa atual e muito mais. Este objeto pode ser acessado. Onley fn Evento tem um curado. acesso só pode ser feito através de uma função que foi executada pelo evento. Digamos um exemplo aqui. O objeto de evento é tendencioso por uma referência ao argumento functions. Eu nomeei o Argumento E, mas você pode escolher o nome que quiser. Alerta aqui irá exibir o tipo fora do evento que, neste caso, é um rápido vimos a propriedade type que nos diz qual tipo de evento foi disparado. Agora é hora de ver outras propriedades e métodos do objeto de evento. Uma das propriedades mais importantes fora do nosso objeto de evento é o alvo. Esta propriedade retorna são referenciados ao elemento cujo evento foi acionado. Por exemplo, eu posso alterar o conteúdo muitas vezes elemento que foi clicado. Não, é outro cenário quando você aplica alguns eventos como a maioria sobre clique etcetera. Nota aparente. Esses eventos também podem se espalhar entre as Crianças. Notas. É um exemplo para entender o que acabei de dizer aqui. Eu tive um desenvolvimento quando fiz com um pai de 80 de desconto. Este desenvolvimento tem duas crianças criança número um na criança número dois. Eu apliquei um evento de mouse sobre este pai. Quando este evento mais longo é acionado, o conteúdo de texto fora do nosso parágrafo vai mudar na exibição o i D fora do elemento gatilho . É executar o script e ver o que acontece, como você pode ver quando eu colocar meu musgo sobre o elemento libra e mensagem Então você e o elemento gatilho tem um ID off pai é exibido quando eu quero mudar um. A ideia mudou o filho dela. Um. A mesma coisa aconteceu quando passei para o carrilhão número dois. O I D mudou para o Canal 2, mas e se quisermos obter o elemento no qual aplicamos o evento? Neste caso, é o elemento pai. Tudo o que temos a fazer é substituir a propriedade target com atual John get propriedade depois alterar esta linha, o I t. Será sempre um pai, mesmo quando eu colocar meu mouse sobre os filhos. Outra informação muito importante que o objeto de evento oferece é a posição do cursor. Isso é amplamente utilizado, especialmente no script arrastar e soltar. Geralmente, obtemos a posição do cursor relacionada com o canto esquerdo da maçã fora da página do mundo para obter a posição fora do nosso cursor para as propriedades existem ovos cliente para a co-ordenada horizontal e cliente. Por que para a coordenada vertical? Como a posição de visita superficial muda sempre, a maioria dos movimentos, o evento de movimento do mouse está lá para o mais apropriado para usar na maioria dos casos para saber quais teclas são pressionadas. Temos três propriedades diferentes. Embora possa parecer demais, não faça 40. É muito simples. Tivemos o evento key up, que é acionado quando o usuário libera uma tecla no teclado. O evento K não, que é acionado quando o usuário pressiona uma tecla. O terceiro evento escapar Chris. Este evento está longe quando uma chave que produz um personagem valorizado s peito para baixo. A verdadeira vantagem do Cape Press é que ele pode detectar combinações K. Então, se eu pressionar Shift e um evento de alcaparras vai detectar um A maiúsculo onde são escalados e K para baixo . Defesa será demitida duas vezes se eu pressionar Shift e uma vez para o Shefki no 2º 1 Para a tecla A para obter o botão do teclado que foi pressionado, ganhar um evento de teclas. Ocorrem. Use a propriedade key. Esta propriedade retorna uma string que não agradece botões de placa, congee distrital, um único caractere como F ou T ou quatro ou vários caracteres como enter ou caps lock. Muitos elementos HTML mostram um comportamento padrão quando você interage com eles. Por exemplo, se você clicar em um link, ele irá redirecioná-lo para nossa página web. É possível bloquear esse comportamento padrão usando um método chamado Prevent Default. Vamos rodar o script e ver o que acontece aqui. Tenho o meu link. Se eu clicar neste link, nada aconteceu. Nosso método padrão de prevenção está funcionando como um atalho 24. Formulários: trabalhar com formulários é algo que você vai fazer muito. Formulários JavaScript são simples de usar, no entanto, você precisa obter algumas propriedades sob rebelde. Primeiro, podemos acessar propriedades fora de elementos de formulário diretamente usando seus nomes como valor desabilitado, verificado etcetera. Vamos ver um exemplo aqui. Tenho um elemento importante. Muitas vezes eu sou o próximo. O valor deste elemento é que preciso do seu foco, por favor. Começo por obter uma referência ao meu elemento. Ele não era para obter o elemento meu método I D. Então eu tive dois eventos para este elemento de entrada. O primeiro evento é o evento de foco. Quando o elemento de entrada recebe o foco, seu valor mudou também. Grande A. Tenha seu foco. Quando o foco sai do seu valor. Volte para eu preciso do seu foco, por favor. Vamos encontrar o guião e ver o que acontece. Agora o nosso íntimo de importação não tem que se concentrar. Quando eu clico nele, o elemento recebe o foco e é que você mudou muito bem. Eu tenho o seu foco quando o foco muda a conduta de valor para o antigo, que é eu preciso do seu foco, por favor. Quando você está nas propriedades desabilitadas verificar e ler apenas em HTML nós escreveríamos algo assim. Aqui tenho uma caixa de seleção para pré-selecioná-la. Use a propriedade marcada. Você pode ver que não. Esta propriedade leva-nos beber como um valor. Mas em JavaScript essas propriedades começaram realmente bilhões. Então, se eu quiser selecionar os talões de cheques, você escreveria algo assim no primeiro começo, obtendo uma referência para fazer o seu elemento como sempre fazemos. Em seguida, você especificar a propriedade marcada e dar quer true ou false listas drop-down têm suas próprias propriedades. Nós vamos aprender sobre Lee para quais são os mais importantes um índice selecionado que retorna o índice da opção selecionada e opções que retorna uma lista fora de todos os elementos de opções em nossa lista suspensa. Como de costume, digamos que um exemplo aqui eu tenho uma lista suspensa com diferentes opções. Eu começo por obter uma referência a esta lista usando seu I D. Então eu adiciono um evento de mudança a esta lista. Este evento de mudança é acionado sempre que eu escolher uma opção diferente. O que eu quero fazer é exibido o continente fora do elemento de opção selecionado, então eu usei opções e índice selecionado juntos para obter a opção que eu seleciono, em seguida, usando a propriedade text countin, eu posso obter o conteúdo desse selecionado opção. Vamos encontrar o guião e ver o que acontece. Como você pode ver quando eu selecionar a opção casual, ele é exibido. Se eu escolher uma opção diferente, ela também será exibida. Os formulários não têm propriedades Onley. Existem alguns métodos realmente úteis. É verdade uma forma tem dois métodos interessantes. 1º 1 é enviar que permite enviar o formulário sem a intervenção do usuário. O segundo 1 é redefinido quem redefine os campos de formulário. Se você tiver alguma experiência com formulários HTML, provavelmente você sabe que esses dois métodos têm a mesma regra que enviar e redefinir nos elementos de importação. 25. Ferramentas para desenvolvedores: ao contrário do que se pode pensar navegador não apenas exibir com páginas. Eles também fornecem um set off com o bug em ferramentas para que os desenvolvedores acessem seu aplicativo Web . Estas ferramentas são conhecidas como ferramentas de desenvolvedor ou ferramentas de morte para abreviar. Nesta lição, vamos dar uma olhada à distância e aprender a mexer com o Sobretudo. Vou usar o Google Chrome para ver os meus exemplos. Eu trabalho neles para fazer o mesmo para que você possa me acompanhar. Outros navegadores também fornecem funcionalidades semelhantes ao que vou mostrar a vocês, mas as escadas para chegar lá serão diferentes. Para abrir o número de mortes, você tem três maneiras. O primeiro caminho é ir para o menu principal de migalhas. Selecione mortais e clique nas ferramentas do desenvolvedor. A segunda maneira é à direita, clique em e selecione Inspecionar. O terceiro caminho é o controle deprimido. Mude a nossa opção de comando ou. I Se o seu próprio Mac, o que você vai ver é uma barra de troll com um monte de vitamina ele. Cada item literalmente faz um teste específico. O painel Elementos dá a você uma visão fora do seu burro e permite que você inspecione os elementos para baixo e edite-os também. Você visitará este painel com bastante frequência se quiser identificar o código HTML de alguma parte da sua página, como ver se um elemento tem uma ideia, um tributo e qual o valor atribuído a ele. Outra funcionalidade poderosa e muito usada é o Conselho do Conselho fornece muitas funções para os desenvolvedores para testar sua aplicação Web. Como Logan, informações de diagnóstico durante o processo de desenvolvimento e interagindo com o documento e répteis que está em uma concha alertam o conselho. O FBI fornece um método muito poderoso sozinho. Eles notaram que a informação chamada conselho que log usando conselho essa lei. Eu posso ver o valor fora, meu resultado é valioso. Se eu voltar ao conselho na primeira fase, você pode ver que eu ganho valor por usar o conselho para o bug é muito mais superior do que sua e outra sanção. Se você usar o conselho, você pode verificar se seu código está funcionando sem aquelas caixas de diálogo irritantes e interrompendas . O Conselho que o método log também é muito prático. tentado visualizar o conteúdo, muitas vezes objeto se eu usar a outra função. Tudo o que recebo é uma mensagem de disciplina, objeto , objeto , o que não diz muito mas com o conselho, podemos exibir o conteúdo do nosso objeto, como podem ver aqui. Se os desenvolvedores querem construir umaplicativo JavaScript grande e complexo, aplicativo JavaScript grande e complexo, eles precisam de uma maneira eficiente e rápida de descobrir a causa por trás de um erro e corrigi-lo. É aqui que a morte dobram com as ferramentas do menu. Vem para o resgate e faz o inseto em muito. Use-o muito mais fácil em suas ferramentas de desenvolvedor. Clique na final da superfície. Certifique-se de selecionar o distante cada arquivo Daniel à esquerda ou qualquer multa com que você está trabalhando agora. Isso fará com que o conteúdo desse arquivo apareça à direita. Digamos que queremos ver se nossa função de multiplicação está retornando o valor correto . Para fazer isso, eu vou girar o navegador para parar na instrução return para ver qual é o valor off por que é A maneira de fazer isso é sentando um ponto de interrupção para definir um ponto de interrupção clique à esquerda aqui . Uma vez que você faz isso, você pode ver o número sendo destacado. Agora precisamos atualizar a página para que o navegador atinja o ponto de interrupção no momento em que o pagamento da página é imposta modo. Se eu superar o valioso, você pode ver que é valor. Devemos saber que você pode remover um riacho foi clicando no número da linha. Se eu quiser retomar a execução fora do meu frio, tudo que eu tenho que fazer é clicar no jogo. Se houver alguns outros pontos de quebra no código, eles também serão atingidos. 26. Obrigado por assistir!: Parabéns. Chega ao fim deste curso. Dê a si mesmo uma salva de palmas. Você definitivamente merece. Obrigado por aprender JavaScript comigo. Eles se divertiram tanto durante este curso. E espero que você também. Depois de seguir junto com este curso deve agora entender as bundas essenciais fora JavaScript. Se você quiser levar suas habilidades de JavaScript para o próximo nível, então você tem que continuar praticando. Sabe o que dizem? A prática torna perfeita. Então continue escrevendo, citando, construa seus próprios aplicativos e junte-se à ampla comunidade de desenvolvedores de JavaScript.