Transcrições
1. Apresentação do curso: isto tinha mais uma natureza bônus. Estou me sentindo generoso hoje. Não sei porquê, mas agora vamos falar nesta natureza bónus sobre a Polly Force. E, por favor, não se sinta viciante. Vai ser difícil. E há uma razão para inserir especificamente o poli cai aqui e não mais tarde. Quero que tenhas uma ideia da escola de teatro. Então, quando chegarmos às seções mais complicadas, você vai ficar tipo, oh, eu me lembro que fizemos isso na seção política. Então, sente-se e aproveite isso mais tarde, vai ser forçado. Mas o que é uma abundância Basta pegar uma vara de volta. Lembre-se que cada provedor de navegador crimes saída estrangeira, Brexit thes ar apenas cos. E todas essas empresas estão tentando competir umas com as outras e ganhar quota de mercado. Por causa disso, eles usaram as próprias regras. Nem todos os navegadores seguem um conjunto de padrões porque as empresas estudantis pensam que sabem melhor por causa disso. Quando novos recursos saem e codificam John um script em um HTML cinco, ele nem sempre é suportado por um navegador específico. Então, o que isso significa? Isso significa que estamos em apuros? Enfrentaremos dentro da realidade que você não pode usar todo o código moderno em um navegador. Você tem uma de duas opções. Um único recurso de idioma usado que estão disponíveis em seu navegador. Não é bem uma solução, pois não? Não, esta segunda solução está certa, nosso código moderno. Mas então somos adeptos a trabalhar no Brasil mais velho. Está bem, fixe. Parece uma ótima solução. Mas como é que fazemos isto? Bem, esse é o objetivo de todas essas estações. Sente-se, pegue um café. Eu tenho um aqui e apenas aprender sobre partículas. Aproveite, mas rapidinho. O que é abundante? Bem, vamos apenas olhar para a definição do dicionário. Uma festa cheia é o plug in e fornece a funcionalidade de novos navegadores, mas para versões mais antigas. E é isso que você pode meio que. Sua apólice era uma espécie de patch em que você apenas pegava código novo e você corrige para que
ele pudesse funcionar em um irmão mais velho, e isso é tudo o que há para ele. Não se intimide. E se você é muito sorrateiro, você pode estar pensando aplicado. Isso não é muito parecido com transpirar? Trance Pilot leva sua sintaxe e convertido em código de máquina. Agora piloto transe pode ir mais longe transpired, pode tomar novo código moderno como o conceito, você gostaria de perdas, e ele pode transponder código em coisas que navegadores mais velhos podem entender minha queda como funções. Mas infelizmente, os pilotos da
Trans só podem nos levar antes de transferirem tudo. Por exemplo, eles não podem transe funções membro pilha em matrizes e seus contratos empilham coisas como promessas e é todo o nascimento, ou de outras coisas. Eles não podem drones e encher essas situações. Precisamos de uma abundância. Então, como sabemos se devemos usar um piloto de festa completa ou um piloto de transe? Bem, ele é muito amplamente para um tipo de regras de alto nível. Um se seu novo Syntex em você provavelmente poderia usar um transponder. Mas se é um novo método ou um novo objeto, provavelmente
deveríamos estar usando um grande “quem “, o suficiente divagando Pegue um café e te vejo nos livros. Vamos aprender sobre Polly Force
2. O que é um navegador: Acho que não há melhor lugar para começar do que com o navegador. E como eu tenho certeza que você sabe, um Prowse é apenas o programa usado para exibir arquivos e nunca obter o chicote. Sabemos que usei cromo o tempo todo no meu iPhone. Eu uso safári. Estes são navegadores, e a principal funcionalidade dos navegadores é apresentar um recurso que escolhemos. E ele faz isso solicitando um do servidor e exibindo-o na janela do navegador. E se, por quê, eu? Este processo tem que ser feito super duper rápido. Porque, sim, você e eu somos muito impacientes quando se trata de Google quando se trata de votar páginas maneira
na Web e metade promove rápido. Íamos discutir isso mais tarde? Mas, por enquanto, saiba que os pesquisadores do Google sugeriram que os tempos de carregamento da página são inferiores a 100 milissegundos. Não que possamos conseguir isso. Só estou dizendo, se pudermos, isso nos dá a ilusão de respostas instantâneas no site porque nosso processo de
memória sensorial visual dentro de nosso cérebro funciona em 100 milissegundos. De qualquer forma, é só um pouco por isso que eu Então nós sabemos que a principal funcionalidade do Brasil é apresentar um recurso que nós escolhemos para nós. Mas de que recursos estou falando? Quente do mais óbvio é HTML. Cada site que você carrega tem que começar com este momento, mas eles também outros recursos. Talvez queiramos carregar como imagens. PDF XML, Jason apreende JavaScript e assim por diante e assim por diante. Mas isso é tudo bem e bom. Então sabemos que precisamos de um recurso. A próxima pergunta é, bem, leitores, o navegador encontrar esse recurso que nós não vamos. E a resposta para isso é que a localização do recurso especificado pelo U. R I o recurso uniformizado identificou Ok, já. Você só quer ver um exemplo. Bem, vamos criar um site fictício,
meu site ponto com, meu site ponto com e uma vez que você entra nisso, você é tudo o que você está vendo na tela em sua linha de vestido. O navegador dividirá isso em três partes distintas. Consegues adivinhar que partes são? Bem, você pode até mesmo usar intuitivamente. Qual seria o 1º 1 será http. E este é o protocolo. Este é o conjunto de regras que regem a forma como os navegadores falam para o serviço, vamos entrar no brevemente para que este seja o primeiro aspecto de decompô-lo. Em segundo lugar, decompõe o seu nome de serviço. Este é o site que você quer ir visitar, e para que o seu navegador para realmente se conectar aos chicotes sobre, neste caso, o meu site ponto com. Para recuperar as informações que solicitamos, ele precisa se comunicar com o servidor de nomes que converte o nome do servidor em um endereço
IP. Um endereço I P é literalmente que é um endereço. É um lugar onde seu navegador pode ir e ensinar. Esse arquivo do navegador da Web é capaz de se conectar ao servidor Web no endereço I
p resolvido , geralmente na Porta 80. Então esse é um segundo item. Temos um protocolo, temos o nome do servidor, e por último, temos o recurso real que queremos coletar. Assim que você navegar estiver conectado ao servidor Web usando o protocolo http neste exemplo, o navegador lerá a linguagem de marcação de hipertexto que indexou muito html, e esta é a linguagem de alteração usada para grandes documentos na World Wide Web. E então, é
claro, o que acontece a seguir? As filhas exibem para você na tela para que eles tenham uma visão
muito, muito alto nível do processo que seu irmão passa, a fim de servir um arquivo para sua página web.
3. Os navegadores seguem um conjunto de padrões: visto que navega principal função é apresentar resultados para nós e em muitos casos que Diesel começa com. Mas agora você pode estar se perguntando como navega direito é alguém que cuida disso é isso é regras e padrões que, e essa é uma boa pergunta. E a resposta. Dívida sim, é um consórcio, uma grande organização chamada W, e apenas significa World Wide Web Consortium. E esta é apenas uma organização é definida especificações quanto a como navegadores funcionam. Em teoria, cada um dos conjuntos de regras parece ótimo, mas na prática vivemos em um muro capitalista, e o que isso significa é que toda empresa quer melhorar os outros navegadores tão históricos, e é apenas escolher o que regras que eles querem seguir. E isso é você adivinhou que é chamado de problemas sérios de compatibilidade quando se trata de
codificar os alguns navegadores, exceto e isso causou problemas para autores da Web e, por sinal, ambos é. Tudo o que quero dizer é alguém que coloca em conteúdo na página da Web para que você veja um monte de código mais antigo que temos que redefinir código para diferentes navegadores. Agora, a boa notícia diz, isso está meio que caindo. Agora, muitos navegadores estão começando a se comportar. Vou mostrar-vos exemplos, depois procurarei. Mas o que é interessante é que essas especificações definidas pelo W três c eles não definem você são eles não definem interface de usuário. Mas ao longo dos anos, através de muitas tentativas e erros fora da UE, os
meus elementos começaram a estar em conformidade uns com os outros. Todos esses navegadores começaram a imitar. Eles aprenderam que usando falar certa página da semana elementar para estar em certos lugares. E com o mesmo, deixem-me mostrar-vos um exemplo muito rápido. Ao comparar com navegadores Bem, vamos começar com a navegação mais popular na parede e eles descreveram Você pode ver um graxeball. Temos uma bola de atualização com botões para frente e para trás. Temos um dois. Bem, eles vieram no seu item. Isso é bastante padrão. Agora, se compararmos isso com Mazzella para que na atualização do botão Voltar, isso
também é possível . E o ponto que estou tentando fazer com tudo isso é que você vai se deparar quando você programando sua carreira. Você vai se deparar com um monte de código antigo que tem problemas de compatibilidade com diferentes navegadores. E por essa razão você vai ver códigos, mas pronto para atender a diferentes versões irmãos. Mas a boa notícia é que isso está começando a cair por razões que acabamos de discutir. Então, sem mais delongas, vamos entrar em algumas coisas de carne.
4. O que é um polyfill: considerar isso uma natureza bônus, porque nós estamos indo para ir em um pouco de atenção. Mas acho que é muito importante entender que é um bom exemplo do que estamos falando. Então, pegando um pau de volta, nós vimos isso por muitos anos. Diferentes navegadores só seguiram uma pequena parte fora das especificações do Leste definidas pelo W três C. E isso significa que os navegadores tinham regras diferentes e alguns navegadores seguiram certos códigos HTML e CSS e outros não. Esse é o primeiro problema. O segundo problema é que também
temos outros padrões, como o script Sigma. E, claro, o problema novamente é duplo. Um determinado navegador não segue todas as recomendações Sigma Scripts e script Two Sigma é atualizado. mesmo com as especificações W três C. Assim, ao longo do tempo, novas funções e novos métodos são criados. Então, o que isso significa? Bem, isso significa que os navegadores mais antigos não entendem o código desligado. As novas regras fazem sentido, certo, e é por isso que mencionamos festa cai na palestra anterior. Então, o que é uma queda de poli? Bem, no seu núcleo, é muito simples. Upali cai apenas um pedaço de código que fornece um fallback se certos recursos não existem dentro desse mecanismo de navegadores na terra Java Script. Este será um motor JavaScript Net Browsers, mas não precisa ser John Streets, e isso é importante. Muitas pessoas pensam em Polly Falls apenas para JavaScript, mas você também obtém Polly Falls para código HTML e CSS, que também entrará em minúsculo, mas mais tarde. Mas vamos nos concentrar na peça mais forte porque isso é o que é interessante, e isso é o que é mais complicado quando se trata de Dave. Agora Polly Falls geralmente segue um padrão, e o padrão começa com uma pergunta simples. O futuro existe dentro do navegador? E se a resposta é sim, bem, então não precisamos de um pol Se tudo o que podemos simplesmente recorrer ao motor de navegadores para lidar com dívidas, certo HTML CSS JavaScript. Isso fica mais interessante fora do curso se o recurso não existe dentro do irmão, e é aqui que temos que usar uma queda poli mantendo o controle do sempre em evolução HTML cinco em CSS três suporte nos navegadores da Web de hoje pode ser uma tarefa esmagadora, e pode ser bem assustador. Claro, nós podemos usar todas as animações CSS para criar. Alguns estavam batendo. Mas devemos? E quais navegadores suportam esse determinado recurso? E o que fazemos com todos os navegadores que não entendem esse código? E, claro, este é nós, Polly Falls entrar na foto e no site, então este é apenas um dos muitos html cinco, por favor. É útil para encontrar Polly Falls que fazem um trabalho específico. Html cinco, por favor. Havia uma lista completa de HTML cinco elementos e ver é suas três regras com uma visão geral do suporte de navegadores em qualquer Polly Falls para a distância de cada elemento. Antes de seguirmos em frente, só
quero dizer que mencionamos Babel como um exemplo de queda de poli. Agora Babel era Mawr direcionado ao script Java para lembrá-lo. Meu script Versão 6 foi uma grande atualização do JavaScript. Eles trouxeram novos recursos e muitas adições sintáticas, mas aqui seis foi mais tarde renomeado Dois anos 2015 neste foi para ficar para refletir as mudanças no ciclo de lançamento. Então, quando será usado? O Babel. Se pretender suportar o Internet Explorer, por exemplo, ou se pretender utilizar as funcionalidades de script mais recentes num browser que ainda não o suporta. Coisa que usamos Babel, que eu sei que estamos passando por muita coisa. Mas nada é melhor do que com um exemplo. Então, por que não construímos nossa própria festa de outono, e isso ajudará você a entender como essas coisas funcionam. E hoje, vamos implementar nossa própria Polly Fall para o aumento do ano para cada método. Isto foi introduzido em Java Strip 1.6 ou um recruta para a tradição na realidade, para cada um é um muito bem apoiado destaque hoje. Mas escolhi mais pelo fato de que é bastante simples de reconstruir. E posso guiá-lo através da construção desta festa passo a passo. Mas devo constatar, neste momento, que esta implementação não será,
de modo algum, abrangente. Isso só vai ser uma maneira de você realmente solidificar a compreensão do que um poli feliz. Então, se você realmente queria entrar no nitty gritty de certas Polly Falls para certas funções, eu recomendo visitar Mozilla Documentation Network ou indiano são colocados um link no final
desta palestra. Certo, então dissemos que vamos jogar boliche para cada festa cheia. E lembre-se que a primeira dica Waas Qual é a primeira pergunta de Polly para tem que
pedir para que ele seja implementado? Isso é certo. O suporte do navegador permite o recurso? Então, o primeiro passo é verificar se quatro cada método é suportado nativamente pelo nosso navegador. Vamos dar uma olhada.
5. Testando para verificar se o forEach() () é suportado por nosso navegador: para determinar se os quatro métodos existem em nosso navegador. Podemos usar o console, enfraquecer direito, um pouco de JavaScript. Então vamos abrir o cromo, que é o que estou fazendo aqui. E agora vamos acessar o console. E muito poucas pessoas vão saber disso. Chamamos isso de protótipo. São dois lugares diferentes. Podemos escrever script Java dentro chrome, os primeiros e mais óbvios lugares no console. Por exemplo, podemos console log Oi, querida, e, como seria de esperar, que iria retornar alto para o console. Este é o lugar onde a maioria das pessoas vão para escrever script Java, mas pode ser complicado porque temos que executar cada linha de código linha por linha. Há um pouco de distância, um, ou divertido e intuitivo e apenas um pouco de distância. Para onde vamos? Bem, na fita de fontes e dentro das fontes, Ted, podemos criar o que eles chamam e novo snippet, e podemos chamar nosso arquivo de qualquer coisa. Vamos chamar isso de apoio nativo Taste porque é isso que estamos fazendo agora. Como provamos com ela antes de cada método existir? Bem, a primeira coisa que você precisa saber é que o quatro cada método existe no protótipo de cada matriz. O que isso significa é que quando criamos uma matriz automaticamente tem acesso a todos os métodos e propriedades atestam que protótipo fora qual deles deve ser o quatro cada método. Então vamos apenas provar se os quatro retorna em encontrar por causa de um não retorno indefinido, isso significa que ele não tem suporte para ele para cima. O navegador não sabe o que é. Então, uma maneira de fazer isso. E de muitas maneiras eu entendo que eu estou apenas fazendo um método rápido e sujo. Nós existimos o objeto array. Nós acessamos seu protótipo e apenas protótipo. Deve ser um método de quatro polegadas se for suportado nativamente, e isso não deve retornar sob fogo. E se ele retornar indefinido, sabemos que ele não existe. Agora há duas maneiras de executar este script Java. Você pode empurrar o controle, entrar no seu teclado ou podemos clicar no local em. Vou clicar no lugar e aqui vamos nós. Ele retorna. Verdadeiro. Isso significa que cada quatro não é igual a indefinido. E aí está que acabamos de confirmar que cada um deles é apoiado nativamente na minha versão atual do crime. Ok, então nós vimos nosso baraza faz suporte antes de cada método. Está em cada array que criamos. E está na teoria do protótipo fora que, a fim de ilustrar o que é um político, vamos apenas fingir que nosso navegador é vendido que ele não sabe antes de cada função. Então, daqui em
frente, coloque isso na parte de trás da sua mente. Vamos fingir que está sob fogo antes que cada mito não exista no nosso irmão. Legal. Acho que já chega desta palestra. Passamos por muita coisa em um curto espaço de tempo. Na próxima natureza, vamos começar a construir este poderoso.
6. Qual é o método foreach(): pouco antes de começarmos a construir nossa queda Polly, você precisa entender o que está reconstruindo e para entender o que está reconstruindo. Obviamente, precisamos entender o que os quatro cada método significa realizar em seu núcleo antes de cada método é apenas uma maneira de loop através de sua matriz e usar. Seis introduziu a matriz para cada método. O que você faz é chamar este mito em seu A e quando você tem que passar em uma
função de retorno de chamada para executar em cada iteração fora do loop. E no caso de você estar se perguntando, um retorno de chamada é apenas uma função que só é executada apagada. Outra função ist terminou executado. Daí a palavra chamada de volta. Certo, então conhecemos os quatro. Cada método requer que passemos em uma função de retorno de chamada nesta função de callback aceita dois argumentos principais. Bem, na verdade, ele aceita três argumentos, mas o terceiro argumento é um array que você quer negociar através. Eu nunca tive que usá-lo, então eu vou apenas me concentrar nos dois argumentos principais que você passar para esta
função de retorno de chamada. O primeiro é o valor do item atual no loop e o segundo é o índice desse item. E você pode nomear essas variáveis o que quiser. Isso é o que a função de retorno vai levar. E nós vamos ter que mais ousado dinamicamente desde o início, que você vai ver em um momento e apenas dando um passo atrás. Basta lembrar que o quatro cada método é um método aplicado ao protótipo de matriz. Vimos isso quando tivemos que ver se ele é suportado nativamente. Saímos do protótipo de matriz para cada método e para cada um é apenas uma maneira para nós agrupar através de uma matriz. E JavaScript é uma besta muito curiosa porque eles são tantas maneiras diferentes de
realizar a mesma tarefa. E também é incrível assim porque, como desenvolvedores, nos
dá muita flexibilidade para usar o que achamos que é melhor. O que isso significa é que antes de cada método não é apenas o único método que podemos usar para agrupar através de uma taxa, nós também temos o quatro método que
temos quatro em, nós temos quatro off e nós ainda temos outros. Mas os quatro de cada método vem com uma pequena caverna, mas isso só funciona em um aumento. Então, se você realmente quer contar ou você quer excesso de loops em um objeto, então antes de cada um provavelmente não vai ser seu amigo. E a outra coisa com quatro cada um
é, que alguns desenvolvedores argumentam que ele sofre problemas de desempenho. Vá devagar, e se isso é uma preocupação para você, então você pode contornar isso. Você pode usar bibliotecas como Loaded e eu não quero entrar em Lodish agora. Mas é basicamente apenas uma biblioteca de utilitários e dirigiu um script que nos leva a muitas coisas
comuns, como fazer um loop através de um aumento e os códigos escritos de uma forma que é muito, muito eficiente. Desempenho eficiente, muito rápido. Ok, bem, se você é como eu, ler um monte de palavras em uma tela não está realmente ajudando a entender o que é um quatro cada . Então, antes de começarmos a construir a nossa festa cheia, deixem-me mostrar-vos o que é um quatro cada, mostrando-lhes um exemplo e, em seguida, enfraquecer o mergulho direto nele, puxando para cima muito próprio partido cheio. Vamos apenas dar uma olhada em um exemplo rápido
7. Exemplo prático de foreach(): Ok, então vamos começar mostrando o que antes de cada método faz também. Vamos abrir o crime novamente e você pode ver que temos até mesmo exemplos anteriores na tela. Vou cortar isso em tempo real com você. E para provar isso, deixe-me mostrar-me magicamente segundo a segundo. Só me dê um segundo. Lá vamos nós. Tudo
bem, aqui estou eu com você codificando em tempo real, e eu só quero mostrar a vocês o que cada método significa fazer. E quero dar-vos um exemplo que não é tão fácil. Você sabe, eu posso usar um array e nós apenas fazer um loop através do console rand desses itens. Mas eu sempre tento, e quero dizer, eu acho que você no ponto agora, especialmente com este curso que você entende em um script de trabalho de alto nível é então
vamos criar duas matrizes e pegar todos os elementos no vento ou Chuva. Nós o empurramos para o mínimo secundário. É algo mais diferente. Então, primeiro é. Isso é crédito no arquivo, outro trecho, e é só chamar isso para cada um. Agora, a primeira coisa que eu quero fazer é criar um array. É simplesmente fixe. Levantem a matriz um. E vamos ter isto cheio de comida. Vamos apenas dizer que leite, mel e eu não sei deve criar uma matriz para, e nesta fase, é apenas uma matriz vazia. O próximo passo é você adivinhou. Vamos criar o nosso para cada loop. Vamos fazer isso. Então vamos acessar a matriz um. E nesta matriz um, devemos ter acesso aos quatro cada método nativamente porque sabemos que cada matriz em nosso Baraza tem um protótipo e seu protótipo tem os quatro a cada minuto. E lembre-se o que os quatro cada método tomou? Qual foi o argumento para fornecer nele? Isso é certo. Função de retorno de chamada. Então vamos fornecer uma função de retorno de chamada. A função callback levou dois argumentos. Will realmente levou três, lembre-se, mas o terceiro 1 eu só queria nem arquivar propósitos. É preciso dois, e o primeiro argumento é o item real no raio. E por causa da discussão, vamos chamar esse item. Podemos chamar-lhe o que quisermos. E o segundo item que passamos esta função é o índice e novamente para a simplicidade. Vamos chamá-lo em dias. Agora. O que isso nos permite fazer é que este para cada método vai iterar sobre matriz um
e cada vez que ele classifica sobre o array um. Vai pegar cada item nessa matriz, e vai nos jogar de volta e o item termina. O que queremos fazer com isso? Bem, vamos empurrar o item para a nova matriz para Então vamos excesso de matriz para Vamos empurrar cada item para o Saray outro me empurrar que é muito semelhante aos quatro cada em dívida no protótipo de matriz que significa que temos acesso a ele
nativamente direto para fora da caixa. Vamos usar o Template Little aqui e vamos existir. O item Lucia dizer, foi adicionado o seu número e eles vão dizer excesso as Índias E na última coisa que eu quero fazer é eu quero mostrar-lhe como esta matriz se parece. Então vamos executar esta função empurrando o controle. Entra e lá vamos nós. Podemos ver qual é o resultado na tela. Milk tem sido editores número zero sobre ele tem sido sempre o número um e deveria ter sido editores número dois. E, claro, podemos até melhorar este casaco. Sabemos que a nova e melhorada maneira de fazer as coisas é o Aris no Texas. Você pode se livrar da função palavra-chave e podemos colocar uma Paris no Texas. Sim, e podemos executá-lo de novo. Desculpe, temos que atualizar para atualizar nosso co. Vamos limpar o console e executá-lo. Aqui vamos nós obter exatamente o mesmo resultado. Mas agora, usando o novo e melhorado Aero Syntex antes de avançarmos mais uma coisa, eu preciso mencionar o que este quatro cada método e que é o que é isso? Referindo-se a 11 maneira de degustação. O que isso se refere é, vamos apenas console, fazer logout console, registrar isso e um jogo. É só fazer re fresco. Está limpa a consola e está a funcionar. O que isso nos diz é que a palavra-chave this está se referindo ao objeto window. Isso faz sentido, e nós vamos entrar em mais detalhes mais tarde, então não quero pular sobre por que isso acontece agora. Eu vou falar sobre isso, então apenas aguente para que morcegos com a gente para cada método. Na verdade, são necessários dois argumentos. O primeiro argumento foi a função de retorno de chamada, o que fizemos. Mas o segundo argumento aqui também é interessante que nos permite definir o que queremos que isso aponte. Então, por exemplo, se você quisesse que isso apontasse para Ray um, poderíamos apenas passar a matriz um para o segundo argumento. Certo, vamos nos refrescar. Está claro que este console nesta executar isso novamente. Olhe ainda se referindo ao objeto de janela. Este é um novo fora da seta. Sintex. Se voltarmos à nossa antiga função, ele faria e nos livramos do erro. Agora fazemos exatamente a mesma coisa. Vamos fazer isso de novo. Lá vamos nós. Recebemos isso referindo-se ao array real. Certo, então tenha isso em mente com a herdeira Syntex. Ele realmente lida com a palavra desta forma diferente. Mas como os quatro cada método é mostrar apenas dois argumentos, primeiro argumento é uma pensão maneira legal. O segundo argumento é o que você quer que isso se refira. Mas se você está usando isso, você tem que voltar para a velha maneira de escrever uma função que eu sei que é muito, mas você está fazendo isso vamos continuar e começar a escrever nosso próprio poderoso
8. Como construir nossa forEach(): Ótimo. Sabemos o que cada um faz. Agora o que? Eu quero que você faça isso. Suponha que nosso navegador não tem idéia do que um quatro polegadas dizer que ele não é nativamente suportado pelo nosso irmão. Portanto, queremos construir um poderoso em nosso protótipo de matriz. A Primeira Profunda vai estar escrevendo o início do nosso código. E eu ia parecer algo assim. Ok, deixe-me apenas apontar que está no protótipo do nosso objeto de matriz. Então queríamos encontrar os quatro cada método. Podemos nos chamar do que quisermos, mas para nossos propósitos, quero que chamemos para cada um e colocamos no protótipo da matriz JavaScript. Objeto global que conhecemos para cada um é um método. É por isso que temos a função, palavra-chave e pescoço para cada método leva dois argumentos. O primeiro argumento é um retorno de chamada. E lembre-se que Colback que leva três argumentos, esse item de texto, esse índice e eles estão certos. Não costumo usar o raio deles. É por isso que estamos nos concentrando apenas no item e no índice. Mas na verdade leva três argumentos e a primeira coisa que precisamos testar para o nosso Polly Fall em nosso código personalizado é que callback tem que ser uma função tem que ser uma função que leva thes itens como suas entradas. Então vamos mudar para o console e vamos começar a direita para fora primeiro, mas de casaco.
9. Verifique se a retorno de chamada é uma função: como mencionado. A primeira parte construindo nossa Polly Fall terá que ser determinar se essa
função de retorno é essa a função. Então vamos entrar nisso. Vamos começar a puxar para cima, Polly. Queda. Então o que eu vou fazer aqui é eu vou criar um novo arquivo e eu vou chamar isso abundante e o que nós queremos. Esta Polly cheirou duas bêbadas. Queríamos estar no protótipo de cada ereto. Então, queremos acessar o objeto ray em JavaScript em seu protótipo. Queremos definir uma nova função chamada para cada um. Agora, neste caso, você e eu sabemos que nosso navegador precisa ser suportado. Mas como eu estou fazendo isso dessa maneira, eu realmente vou estar substituindo a funcionalidade normal para cada um. Então, na verdade, vamos criar uma nova Polly para uma nova função. Sabemos que este quatro cada um não é método e este mito que leva dois argumentos, o primeiro argumento é uma função de retorno de chamada no nosso caso. Vamos chamar de volta. Podemos chamar-lhe o que quisermos. E lembre-se, o segundo argumento foi o que queremos definir. Isto é isto. Chamou-nos isso de argumento. Ogg isso e aí você tem. Foi assim que começamos a construir a queda da festa. Agora a primeira coisa que queremos fazer é verificar se o cool back é uma função. E fazemos isso usando scripts Java no método parafuso chamado type off. Isso é um operador. Então o que nós queremos fazer é que nós queremos provar se tipo de deck legal. Se não existe uma função, então o que queremos que aconteça? Bem, queremos parar o nosso código porque tem de ser uma função. Então o que queremos fazer é que queremos jogar e você digita era, e o que queremos fazer é que você quer jogar de volta na chamada de volta, e queremos dizer que não é uma função apenas para que o usuário tenha algum feedback sobre o
que é um bêbado. E sabemos que se isso não lançar tipo era, eles não são código pode continuar. Podemos continuar nosso código aqui. Então, aí está. Vamos testar se esse código funciona ou se fizemos algo errado. A primeira coisa que eu posso ver você ainda nem provou. É. Eu deveria ter tido que igualar sons aqui. Na verdade, quero ser o mesmo. Top é função. Vamos ver se isto funciona. Está limpando nosso console e vamos correr. Claro, eu realmente não executei a função para cada função. Então o que eu devo fazer ouvir este pouco para encontrar uma nova matriz iluminada é igual a fumaça, mel e açúcar e agora leva. As saídas são para cada método. Acabamos de sair para cada um e vamos apenas executar. Não vamos passar em uma função. O que você acha que vai acontecer? Bem, vamos tentar executá-lo tipo tribunal era indefinido não é uma função. Esta é exatamente a era que jogamos aqui. É por isso que lançamos uma era. Quero dizer, mesmo se você colocar em algo que não é uma função como nessa nota, vamos fazer o log do console A. Por
exemplo, isso é agora, então nós já definimos. Vamos renovar limpar o console e executá-lo. Aqui vamos nós. O log do console não é uma função, então isso só mostra porque nós realmente lançamos uma era, porque estamos dando feedback para o usuário dizendo, Ei ,
pessoal, você tem que realmente passar uma função nos quatro método. Então vamos fazer isso. Deixe-me mostrar-lhe o que isso significa? Tudo bem, bem, vamos jogar a função. Então vamos passar-lhe uma função que você vai Neste caso, a função está completamente vazia. Então, vamos atualizar a página. Limpe o console. É executar esta função e você vai. Nós não temos cabeça e era e nós ainda não parar código dizendo legal muitas vezes. Era não foi lançada. Vamos apenas fazer o registro do console. Sim, podemos continuar. Hoje você vai. Vamos ver se isto funciona. É executar nossa função e você pode ver o amor para a tela como sim podemos continuar. E isso prova que nosso core beck é realmente uma função incrível. Certo? Então esta é a primeira parte da construção da nossa própria Polly. Você pode ver que não feito por qualquer meio porque nós nem sequer entrou no que a
função callback deve fazer. E isso é certo em toda matriz e, em seguida, nos permitem manipular e trabalhar com o item e o índice. Eles veriam como fazer aquele troféu
10. Como escrever nossa função callback: Ok, fique comigo. Fique comigo. Porque agora nós vamos realmente terminar de escrever nossa função de retorno de chamada. E antes de o
fazermos, temos de saber o que queremos fazer outra vez. E lembre-se de como antes de cada um é um loop, significa que precisamos saber o quanto precisamos fazer loop caso contrário, vai ser indefinidamente. Em nosso exemplo, definimos uma matriz com três itens de fumaça, mel e açúcar. Então a primeira coisa é, por que acessamos isso? E a mais óbvia Anta usou para usar a palavra-chave “this”. Mas a que se referirá isso? Maneira mais fácil de novo. É só para consolar o mercado. Vou te mostrar algumas maneiras de provar o que é isso. Mas esta é a maneira mais intuitiva e vamos ver o que é. É limpar o console e está certo. Temos Cônsul há muito tempo, isto para a tela, e isto é teoria. Podemos ver que leite, mel e açúcar, e contém três itens. Então isso é legal. Sabemos que outra maneira de verificar o que é isso e isso defini-la em uma variável. Digamos aceso. Vamos chamar de comprimento. Lane para comprimento é igual a este pensamento eo que podemos fazer especialmente. E isso é o que é divertido quando se trabalha na guia fontes com nosso próprio arquivo, podemos colocar um ponto de interrupção aqui, e o que você pode fazer é executar essa função. Então vamos executá-lo. Desculpe, vamos atualizar primeiro aqui o console. E agora vamos colocar um ponto de ruptura aqui nesta corrida. O que vai fazer é parar o código neste ponto. E o que é interessante aqui e onde você quer olhar para é a seção escopo dentro de
ferramentas Dave , e você pode ver que Lane está atualmente sob encontrar certo porque nós pausa que oferece executado esta linha. Mas assim que pisarmos e executarmos esta linha, Len
ansioso é igual a três para que possamos ver aqui que isso está apontando para o Irã mesmo para pairar sobre ele. Esta é a nossa decisão, Dave Tools. Mostra a você o que isso está se referindo. Então é por isso que podemos acessar o método in bolt length neste array. Incrível, certo. Ok, então nós estabelecemos que nós temos a propriedade comprimento. Vamos remover esse ponto de ruptura e é apenas continuar. Teoh, execute nosso código e todos nós terminamos na liga final espanada também. Olhe através do poder, certo? E, claro, podemos usar a variável caída tradicional. Eu comecei a Zira, e nós vamos aplicar este loop desde que eu tenha menos do que comprimento. E cada vez que ele iterou através desta função, nós vamos aumentar. Quero que saibamos que este é o padrão para o grupo que todos conhecemos e amamos. E agora o que estamos querendo fazer é encontrar a nossa função callback, vai aqui e lembre-se que argumentos são função callback tomou. Tente pegar três argumentos. Então vamos chamar nossa função de retorno de chamada, e vamos dar-lhe três argumentos. Três argumentos são o item, que é o array, e nós vamos existir o item real. Então temos que passar o número do índice. O segundo argumento é o índice em si e o argumento alimentar. Lembra-se do coração? Veja, nós realmente não precisamos disso, mas nós podemos, neste caso apenas para o bem de completude, nós temos que acrescentar isso. Nós temos que realmente passar lá dentro Ray em si. Quão legal é isso? Nós praticamente fizemos agora. Então o que acontece é que podemos usar isso para cada método. Lembramos que a função leva três argumentos. O item que índice e nós apenas chamamos de argumento isso e tudo, podemos fazer as coisas com eles como quisermos. Em nosso caso, vamos apenas console item bug em dias em tudo isso apenas para que você possa ver que ele está funcionando como esperado, que é executar esta função. Você vai ter acabado de criar nossa própria Polly cheia. E está funcionando como esperado. Quão incrível é isso? Mas há mais uma coisa que temos que fazer, não é? Lembra quando olhamos para isso foi em uma dessas lágrimas. Não era um suporte nativo para cada um. Lembre-se disso. Tivemos que esta palavra-chave neste casaco este é o padrão em negrito reunião de quatro polegadas e que este se refere ao objeto janela. Mas nós poderíamos postar um segundo argumento nesse exemplo, nós olhamos, nós passamos na matriz um e nós usamos isso para os socorristas. Bem, como faríamos isso aqui? Quero que penses em nós, e depois mostro-te na próxima palestra. Como fazer isso
11. O que significa que isso significa isso: vamos terminar com a parte final do nosso abundante, e que é corrigir este problema. Então, para facilitar as coisas, deixe-me excluir o registro anterior do console. E eu só quero te mostrar. Se cancelarmos amar isso na tela, o que você esperaria que acontecesse? O que você acha que vai ser mostrado no console? Bem, vamos dar uma olhada. É executar a função e, em seguida, você vai para o objeto janela. Por que isso e o que é ainda mais estranho? Isso só mata o console de novo. O que é ainda mais estranho como nós colocamos uma pausa aqui e começamos a executar isso, Vamos executar a função e olhar para essas variáveis locais novamente. Certo, escopo. Vou ficar em todo o código que chegarmos ao array. Agora chegamos aos quatro de cada função, então ele vai saltar para a nossa garota personalizada. Vai verificar com os retornos de chamada, não com uma função. Vai passar por isso. E isto é o que é interessante, certo? Que isso eu pairar sobre isso quando eu usei esta palavra-chave com no tribunal que se refere ao raio. Mas quando chegamos lá fora com quando chegamos a este log console ele realmente se refere ao objeto
janela. Se eu continuar a executar isso, vamos nós estamos pisando agora nós neste bloqueio console nós lado de fora fora do quatro cada função e agora nós sabemos pairar sobre isso. Você pode ver que isso se refere ao objeto de janela. Como somos nós não faz sentido. Pelo menos você sabe script Java, porque faz sentido e eu vou mostrar-lhe o porquê em um segundo. Mas antes de lhe mostrar o porquê e entrar na gritty nitty dele. Basta dar um passo para trás e olhar para as diferentes maneiras que acabamos de executar funções. Quando executamos para cada um, fizemos isso como um núcleo de método. Executámo-lo como um método. Isso é quando nós realmente executar a função callback. Olha como fazemos isso. Isso é certo. É uma função regular. Nós não existimos. Método Zika antes de chamá-lo, estamos apenas executando sua função. E pode parecer na superfície que isso é uma diferença muito sutil. Mas acontece que a diferença sutil causa uma profunda correção. Mas deixa-me mostrar-te porquê. Deixe-me saltar para a outra tela rapidamente e mostrar-lhe por que isso acontece eu sinto sua dor . Eu sei que pode ser difícil entender isso e o que ele deve se referir a diferentes áreas do seu código. Mas esta é apenas uma visão geral muito rápida e de
alto nível sobre isso e por que ele está fazendo o que está fazendo. Isto tomou um exemplo raro, e está criando matriz com três valores em um cão, um gato e um rato. E vamos deixar de fora o nosso código. Sim, um com o qual temos trabalhado sem política, e vocês notarão quando formos executar isso para cada método. Como a atriz disse anteriormente, essa função está sendo chamada de método. Então nós sabemos isso neste caso confuso. Mas saberemos que isso foi referido ao array neste caso. Mas quando temos a nossa função de retorno de chamada, é
aqui que as coisas ficam muito interessantes, porque o script Java lida com isso muito especificamente quando se trata de chamar funções em Harley of court. Quando passamos uma função para o quatro cada método fora da matriz, o valor deste é a janela de objeto global. Em outras palavras, essa sanção será um método fora da janela de objeto, e esta é apenas a maneira que JavaScript funciona quando você tem uma função que não está sendo chamada como um método,
então, por padrão, essa função é realmente omitida fora do objeto de janela. Seja qual for o objeto global, dependendo do ambiente de script Java. Por exemplo, se você estiver executando e nó, o objeto global não será o objeto janela. É chamado, ironicamente, global. Então, podemos dizer que é uma espécie de como o quatro cada método de chamada volta está chamando janela legal grande. E é por isso que quando você usa
isso, ele está se referindo ao chamado retorno de chamada neste caso, a janela, o objeto janela. Quem? O caso dela. Isso é em um nível muito alto, o que está acontecendo em segundo plano? Mas a pergunta que você provavelmente está fazendo agora está boa. Legal, eu entendo. Mas como resolvemos o problema? Como definimos o que isso deve se referir? T. E se eu quisesse que isso se referisse à minha matriz, não ao objeto vencedor? E como se vê, há uma solução muito simples para isso. Vamos dar uma olhada
12. Como terminar nossa polyfill personalizado: Parece que essa Polly nunca vai acabar. Confie em mim
, vai. Estou farto disso. Então vamos fazer isso em uma política totalmente funcional. Então vimos isso se refere ao objeto global. Mas como definimos o que queríamos ser? Bem, uma solução simples para isso é usar o método legal. O que é o método de chamada será novamente o seu embutido em JavaScript. E isso só nos permite chamar a função, chamar o método e definir o que queremos que isso se refira. E é isso que queremos aqui. Então deixe-me mostrar rapidamente o que é antes de executá-lo novamente. Vamos criar um novo trecho, e ele é apenas chamado de todos nós método e deixe-me mostrar-lhe o que esta calma se isso acontecer. Em primeiro lugar, vamos definir uma função chamada comida. E se eu quero dizer você para script Java, eu não sei por que, mas muitas vezes quando você está fazendo código de teste, você define comida e você define barra, então você verá muito disso acontecendo. por isso que decidi chamar-lhe comida. Não há nenhum significado especial ou valor por trás disso,
e tudo o que queremos que a disfunção faça é que queremos que esta função consolar registre isto. E o que acha que vai acontecer quando executarmos comida? Esta é uma função que está sendo chamada em um método? Onde está essa função irregular? Claro, esta é uma função regular, então o valor disso deve ser o objeto de janela. E vamos rodar este código. Lá vai você. Podemos ver que é o objeto da janela, e eu quero mostrar a vocês como o método do núcleo funciona. E para fazer isso, é apenas para encontrar um objeto. É uma barra acesa igual a um objeto vazio. Agora vamos executar a função alimentar novamente. Mas vamos fazer isso com o método central. Então, acessamos a função. Nós acessamos o método de chamada de parafuso negativamente, e o primeiro argumento é o que queremos que isso se refira nesta barra de caso. Agora, se eles fossem argumentos na função alimentar, poderíamos fazer encomendas aqui, mas eles não são. Então, é um exemplo muito simples. Mas agora o que acha que vai acontecer? Bem, é limpar o console e isso é código esgotado. E lá vai você. Não é o objeto janela em seu porque nós dissemos ao motor quando usamos isso que nós
queremos nos referir a bar neste caso o tribunal anti objeto. Então isso é exatamente o que a calma se ele faz, é agora implementá-lo em nossa bela para resolver nossos problemas. Então a primeira coisa que temos que fazer é permitir para nós colocar em um segundo argumento no quatro cada chamada de função que você pode ver no topo Nós definimos que os dois argumentos, um callback e um argumento isso agora quando não colocar em ogg isso, ele só vai voltar em descobrir que vai tratar o argumento da dívida é indefinido, e neste caso, nós nunca o usamos de qualquer maneira, então ele realmente não se encontrou, mas agora nós realmente vamos usá-lo. Então isso e agora a próxima coisa que temos que fazer é mudar nossos retornos de chamada. Provavelmente, porque agora não estamos apenas querendo executar a função diretamente, é? Queríamos sair pelo método de chamada, e lembre-se, o primeiro argumento é o que queremos que isso se refira, e é isso que vamos pausar em Dhakal todo o resto. Em vez disso, o mesmo nos chama e lembre-se do que eu disse, se não estiver definido, ou
seja, se não passarmos em um argumento, vai resultar como indefinido. E isso,
nesse caso, apenas se
referiria ao objeto global, que é o que queremos de qualquer maneira, então ele resolve e prová-lo para você. Vamos nos certificar de que está trabalhando. É apenas salvar aqui são console e executar o nosso código. Não queremos pontos de ruptura. Deixe-me remover o ponto de ruptura. Continue a executar o código. Desculpe. São pegar isso que te vê. E isso é o bom de trabalhar no console. Nós temos todos esses zeros jogados de volta em nós e sabemos exatamente que eu conserto. Desculpe, eu disse que tudo isso é um segundo argumento, mas isso realmente tem que se referir a algo. Neste caso, queremos que nosso array seja este não os objetos globais que eu não poderia adiar isso. Então vamos limpar o console novamente e tentar executá-lo e você vai. Isso agora se refere à nossa matriz lenta em sua mente, tanto quanto a minha, e para provar isso a você. Se removermos array, devemos obter o objeto globo novamente. Então vamos deletar isso. Não passar nada. Console assassino, Limpar o console e Mrs cercam a função. E voltamos ao objeto da janela que acabamos de criar a nossa festa e sei que isto foi uma espécie de tropa tangente e pensei, sabes que mais? Se você não entende o que uma linda sempre vai te frustrar, então deixe-me algumas palestras repassando por isso. Espero que tenha gostado. Mas vamos começar sobre o que este curso é realmente, realmente sobre. Que as próximas idades espero que tenha gostado da seção Savona. Continua.
13. Outro: Sabe, você dominou isso tão bem. E como eu
mencionei, espero que você não esteja se sentindo intimidado por isso e saiba que tem sido um pouco difícil. Entramos em muitas funcionalidades que ainda não discutimos. No curso de não se preocupe se você está um pouco perdido,
mas uma parede faz sentido no final de seu curso,
a única coisa que eu só quero mencionar é um ponto final é que o script Java é a linguagem usada para escrever mel para morcegos. O Poly completo em si não precisa ser usado US $4 script. Na verdade, você pode criar um pontífice tudo para implementar vários recursos do navegador além de desemprego. Bem, que outras características e falar sobre? Que outras funcionalidades podemos criar? Uma quantidade abundante, bem, praticamente qualquer coisa que você queira, como tela SPG, armazenamento
na Web, vídeos de armazenamento
local e de sessão. HTML cinco elementos. Sees é um design responsivo com soquetes. Geolocalização é suficiente? Como pode ver, há muita coisa que podemos fazer. Então, foi uma lição muito importante para você passar. Ainda bem que continuaste comigo e vejo-te na próxima secção. Aproveite