Perguntas de entrevista em JavaScript - entrevista em codificação 2022 | Oleksandr Kocherhin | Skillshare

Velocidade de reprodução


1.0x


  • 0.5x
  • 0.75x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 1.75x
  • 2x

Perguntas de entrevista em JavaScript - entrevista em codificação 2022

teacher avatar Oleksandr Kocherhin

Assista a este curso e milhares de outros

Tenha acesso ilimitado a todos os cursos
Oferecidos por líderes do setor e profissionais do mercado
Os temas incluem ilustração, design, fotografia e muito mais

Assista a este curso e milhares de outros

Tenha acesso ilimitado a todos os cursos
Oferecidos por líderes do setor e profissionais do mercado
Os temas incluem ilustração, design, fotografia e muito mais

Aulas neste curso

    • 1.

      Apresentação

      0:54

    • 2.

      Tipos de entrevistas

      1:30

    • 3.

      Entrevista e trabalho são coisas completamente diferentes

      1:01

    • 4.

      Como mapear usuários para obter nomes de usuário

      9:41

    • 5.

      Diferença entre nulo e indefinido

      2:36

    • 6.

      Como erguer

      4:45

    • 7.

      Fechamentos

      6:04

    • 8.

      Currying

      12:58

    • 9.

      Como adicionar elementos à matriz

      4:06

    • 10.

      Arrays concatenando

      3:06

    • 11.

      Verifique se o usuário com esse nome

      4:25

    • 12.

      Remova todos os duplicados na matriz

      4:29

    • 13.

      Como classificar o array

      4:07

    • 14.

      Entrevista não é o que você pensa

      2:12

    • 15.

      Função de intervalo de escrita

      3:09

    • 16.

      Como escrever função shuffle

      3:19

    • 17.

      Encontre o número de Occurences de valor mínimo na lista

      2:35

    • 18.

      Isto

      5:33

    • 19.

      Cursos

      5:09

    • 20.

      Protótipos

      7:04

    • 21.

      Eu falhei a entrevista. E depois?

      2:19

    • 22.

      Módulos

      9:41

    • 23.

      Implementar função de Debounce

      5:37

    • 24.

      Como implementar função de aceleração

      4:19

    • 25.

      Destacar todas as palavras mais de 8 letras com amarelo

      3:52

    • 26.

      Adicionar um link

      1:32

    • 27.

      Dividir cada frase para uma linha separada

      4:28

    • 28.

      Delegação de eventos

      3:58

    • 29.

      Pedido de HTTP Xml

      3:11

    • 30.

      API de busca

      2:14

    • 31.

      Callback básico

      3:04

    • 32.

      Array de sincronismo paralelo

      5:53

    • 33.

      Converter Callback para promessa

      2:51

    • 34.

      Mapa de dados em promessas

      6:58

    • 35.

      Dados de mapeamento reformulados no Async

      3:14

    • 36.

      Você deve usar vocabulário correto

      1:04

    • 37.

      Gerente de pedido de design

      6:39

    • 38.

      Implementar comparação rasa

      8:12

    • 39.

      Implementar comparação profunda

      2:58

    • 40.

      Como criar função de memorização

      3:45

    • 41.

      Fibonacci

      3:15

    • 42.

      Palindrome

      1:27

    • 43.

      Anagrama

      3:36

    • 44.

      Como encontrar vogais

      2:42

    • 45.

      Converter em capa de título

      5:38

    • 46.

      Converter a entrada de tempo dada em formato de 12 horas para 24

      7:37

    • 47.

      Como mapear dados

      4:55

    • 48.

      Substituir parâmetros em URL

      4:49

    • 49.

      Mensagens de validação

      4:46

    • 50.

      Lista aninhada

      9:45

    • 51.

      Trabalho de casa

      0:47

  • --
  • Nível iniciante
  • Nível intermediário
  • Nível avançado
  • Todos os níveis

Gerado pela comunidade

O nível é determinado pela opinião da maioria dos estudantes que avaliaram este curso. Mostramos a recomendação do professor até que sejam coletadas as respostas de pelo menos 5 estudantes.

96

Estudantes

--

Projetos

Sobre este curso

Este curso é excelente para qualquer entrevista de programação javascript que você pode ter vindo. Entrevistas de programação precisam de muito conhecimento, mas a melhor maneira de se preparar para entrevistas é muito prática! Neste curso, você vai completar 59 perguntas de entrevista javascript que vêm de entrevistas reais javascript. Não há excersises que ninguém pergunta aqui. Em todas as perguntas vamos começar uma tarefa primeiro, você vai tentar resolver cada problema e depois vou mostrar soluções diferentes para cada problema passo para diferentes níveis de programador. Vamos mergulhar profundamente nas habilidades, conceitos e técnicas necessárias para resolver cada problema.

Quando tiver concluído este curso, você terá masterizado as 59 perguntas de entrevista que vamos cobrir, mas você também terá aprendido os conceitos, habilidades e técnicas, que são necessárias para você se destacar em qualquer outra pergunta de entrevista que você pode ser feita. Você vai se sentir muito confiante em qualquer entrevista de programação javascript que você vai ter. Além de tudo isso, você vai fortalecer suas habilidades de programação javascript e fundamentos de javascript em geral.

Tópicos principais do curso:

  • Fechamentos

  • Como erguer

  • Currying

  • Aulas e protótipos

  • Módulos

  • Como trabalhar com DOM

  • Javascript sincrônico (Callback, promessas, Async espera)

  • Memoization

  • Como transformar dados com tarefas do mundo real

  • Como criar funções próprias utilitário

Conheça seu professor

I am a full-stack developer with a passion for learning and teaching what I know. I have been programming for around 10 years and teaching for almost 6 years.

I believe in learning through doing and this philosophy is present in every course that I teach. I love exploring new web & mobile technologies and my courses focus on giving you the edge in our fast-moving industry.

Visualizar o perfil completo

Level: Beginner

Nota do curso

As expectativas foram atingidas?
    Superou!
  • 0%
  • Sim
  • 0%
  • Um pouco
  • 0%
  • Não
  • 0%

Por que fazer parte da Skillshare?

Faça cursos premiados Skillshare Original

Cada curso possui aulas curtas e projetos práticos

Sua assinatura apoia os professores da Skillshare

Aprenda em qualquer lugar

Faça cursos em qualquer lugar com o aplicativo da Skillshare. Assista no avião, no metrô ou em qualquer lugar que funcione melhor para você, por streaming ou download.

Transcrições

1. Apresentação: Bem-vindo ao meu curso, perguntas de entrevista em JavaScript com tarefas práticas. Neste curso, resolveremos juntos 59 perguntas de entrevista mais populares que eles receberam ou foram feitas nos últimos dez anos, e eles cobrirão todo o conhecimento do JavaScript. Este curso está totalmente focado nas tarefas de coordenadas. É por isso que eu recomendo que você tente implementar cada tarefa sozinho. Primeiro, depois disso, vamos implementá-lo juntos de maneiras diferentes para diferentes níveis de conhecimento. No final deste curso, você estará muito melhor preparado para sua entrevista em JavaScript conseguir um emprego. Quem sou eu? Meu nome é Alexander cohered hint, e eu sou desenvolvedor web, tinha mais de dez anos de experiência. Ele, bem como um instrutor profissional com vários cursos sobre tecnologias da web. Fiz o meu melhor para colocar todo o meu conhecimento dentro deste curso e queria compartilhá-lo com você. Então, seja bem-vindo a bordo e vamos começar. 2. Tipos de entrevistas: Existem três tipos diferentes de entrevistas que você pode obter. Primeiro de tudo, é pai teórico. Você acabou de receber algumas perguntas sobre seu trabalho e experiência e assim por diante. Este é um tipo normal de entrevista para desenvolvedores mais avançados, onde eles desenvolvedores mais avançados, onde eles já têm muitos anos de experiência porque o entrevistador entende, ok, esse cara estava trabalhando no desenvolvimento web, por exemplo, com JavaScript nos últimos cinco anos, o que realmente significa que ele tem conhecimento suficiente e não faz sentido verificar suas habilidades de programação. O segundo tipo popular de entrevista é a entrevista coordenada. E, na verdade, eu diria que esse é o tipo de entrevista mais popular. As pessoas muitas vezes misturavam entrevistas teóricas com desafios de codificação, o que realmente significa que você está recebendo algumas perguntas teóricas e então você deve codificar algo. Na maioria das vezes você está usando caneta e papel e não computador. Neste curso, resolveremos juntos 59 desafios JavaScript diferentes que você pode obter. Esses desafios são abordados em quase todo o JavaScript que ele encontrará nas entrevistas. E o último tipo de entrevista é a entrevista de check-in do projeto. Normalmente, o entrevistador queria ver seu código. Então, se você tem algo para mostrar, é muito mais fácil para você, porque você não deve responder apenas a perguntas aleatórias, mas você pode falar sobre seu projeto, sobre seu código e assim por diante. que realmente significa que eu recomendo a entrevista implemente algum projeto porque antes de tudo, você terá algo para mostrar ao entrevistador. E em segundo lugar, você terá algo para falar sobre o que você pelo menos sabe. 3. Entrevista e trabalho são coisas completamente diferentes: Então, normalmente, para conseguir um emprego, você deve passar por uma entrevista. E é assim que ele está funcionando em quase todas as empresas. Mas o principal problema com isso, sua entrevista nem sempre está relacionada ao seu trabalho, que realmente significa que algumas das entrevistas podem ser feitas perguntas difíceis, não do mundo real, mas você deve respondê-las para conseguir um emprego, mas você nunca usará esse conhecimento mais tarde em seu trabalho diário. Aqui está o problema. Existem algumas semelhanças entre introduzir e trabalhar, mas na verdade elas são diferentes. E no mundo perfeito, sua entrevista deve ser um espelho do seu trabalho real na empresa. Mas, infelizmente, nem sempre é assim. É por isso que você deve conhecer os dois. Você deve saber como passar na entrevista e você deve saber como trabalhar. Neste curso, a maioria dos desafios é conhecimento completamente real que você deve conhecer e que você precisa tanto em sua entrevista quanto na vida cotidiana. Mas ele também incluiu neste curso algumas perguntas que não estão relacionadas à sua programação diária, mas você precisa conhecê-las apenas para sua apresentação. 4. Mapeando usuários para obter nomes de usuário: A primeira tarefa que queremos olhar é soar assim. Você precisa escrever um código para se livrar de nomes de uma matriz de usuários. E como você pode ver aqui, temos uma variedade de usuários. E, na verdade, é apenas uma variedade de objetos. Vemos esse nome e essa propriedade ativa. E, na verdade, essa é uma tarefa relativamente fácil, mas é muito bom começar a entrevista. E entrevistadores experientes saberão que você está sob estresse, o que significa que você deve receber vários exercícios fáceis apenas para relaxar um pouco e você pode ser mais focado e mais produtivo. E, na verdade, até mesmo um exercício fácil pode dizer entrevista bastante qual estilo de código você está usando, como você nomeia suas variáveis e como você está escrevendo seu código para ele possa entender em que nível você e quais perguntas ele precisa fazer a você? Então, agora eu recomendo que você publique este vídeo e tente implementá-lo sozinho. Se você quiser apenas acompanhar, então vamos codificar isso. E, na verdade, existem várias maneiras de implementá-lo. Normalmente, os iniciantes começarão com loop for porque é a abordagem mais fácil do que eles sabem. Por exemplo, aqui depois do nosso usuário três, podemos escrever aqui para loop. Portanto, temos aqui para o índice let de zero para o usuário inclinado. Então, aqui temos um comprimento menor do que o usuário e aqui temos oito plus plus. Agora, dentro do nosso loop for, queremos acessar cada nome e empurrá-lo em alguma glória. É por isso que antes de queremos criar uma matriz, vamos nomear nomes e ele será um array vazio. Agora, dentro de um loop for, podemos escrever nomes para saída e aqui dentro do acesso em nossos usuários com eu vi que este é o nosso nome de ponto de usuário atual. Nesse caso, colocamos um nome online desse usuário neste direito. E depois do nosso loop for, podemos apenas console.log nosso em seus nomes e verificá-lo e navegá-lo. Estou relacionado na página e, como você pode ver, nosso resultado é Chegg. John Mike Isso é exatamente o que precisamos implementar e sim, resolvemos nossa tarefa. E se você é um iniciante, essa solução é totalmente boa. Mas você pode fazer melhor porque toda vez que você tenta codificar melhor uma entrevista, você mostra que é um desenvolvedor melhor. É por isso. Vamos contar esse código e tentar novamente. Então, o que podemos usar aqui em vez de loop for é para uma função rica para nossa matriz. É aqui que podemos simplesmente escrever os usuários ponto para rich e, dentro, devemos fornecer uma função de retorno de chamada. O que é mais importante, temos um acesso aqui a cada uso e agora dentro de uma lata fazer o que quisermos. E como você pode ver aqui, não temos índices e nosso código está muito melhor. Então, o que queremos fazer aqui é exatamente a mesma coisa como fizemos anteriormente. Criamos aqui nos nomes reais e agora dentro do nosso loop para cada loop queremos empurrar para dentro de nossos nomes, nosso nome de ponto de usuário. E, como você pode ver em comparação com nosso código antigo, esse código é muito mais fácil de ler. Vamos um pouco comum aqui nosso console.log e verificar se ele está funcionando. Como você pode ver, estamos obtendo exatamente o mesmo resultado. Portanto, este é o nível dois de gravação no código, mas na verdade a melhor maneira de resolver essa tarefa é usar a função de mapa adicional. E, na verdade, isso tornará seu código o mais simples só porque você está usando a ferramenta certa para a tarefa certa. Neste caso aqui, podemos escrever que queremos recuperar nossa matriz de nomes e aqui queremos percorrer nossos usuários com a função map. E se você não sabe o que o mapa está fazendo bem, percorrendo cada elemento dentro de nossa matriz e retornará alguns de seus dados para cada elemento em nossas chaves em vez de nosso objeto, queremos retornar um único nome. É aqui que? Aqui podemos escrever que temos um usuário e queremos retornar seu nome de ponto de usuário. Vamos verificar se está funcionando. Como você pode ver no navegador, estamos recebendo exatamente a mesma saída. Mas esta é a melhor variante para essa tarefa e mostra que você sabe, o que você está fazendo para solução é quase sempre de baixo nível, o que significa que você precisa exatamente implementar o que você estão fazendo. Neste caso aqui, precisamos dizer que estamos empurrando elementos para nossos novos nomes de array. E também o que você pode ver aqui, criamos a matriz de nomes antes de usar o loop for, o que realmente significa que nossa lógica e nossa variável adicional não têm nada juntos. No nosso caso, aqui estamos escrevendo o resultado diretamente para nossos novos nomes de variáveis. Então você resolveu essa tarefa com sucesso e agora está recebendo a próxima. Precisamos voltar aos usuários ativos, o que significa que nosso primeiro ponto aqui é válido, mas isso deve ser todos usuários ativos. E, na verdade, poderíamos usar qualquer método que quisermos aqui para resolver isso. Por exemplo, poderíamos usar aqui para loop e escrever mais simples dentro do que se condição. E podemos verificar aqui se nosso usuário está ativo e se essa propriedade é verdadeira, então, dentro, queremos empurrar nosso elemento para o nosso. E você está certo. E, como você pode ver no navegador, estamos recebendo aqui apenas dois usuários porque nosso último usuário está inativo. Isso é totalmente bom, mas temos aqui dois problemas. Primeiro de tudo, nosso código é de baixo nível. E em segundo lugar, misturamos aqui a lógica junto com filtros e elementos e os mapeamos. E isso é ruim porque quando seu código é mais complexo, então é mais difícil dividi-lo. E, na verdade, a solução para cada um será exatamente a mesma. Mas vamos dar uma olhada na solução desse mapa. Na verdade, o que queremos fazer aqui. Queremos, em primeiro lugar, filtrar nossa matriz e entrar em contato com os usuários ativos. E depois disso, queremos aplicar nosso mapa para que possamos aqui mesmo filtro de pontos. E temos exatamente a mesma lógica que temos aqui acesso ao nosso usuário e devemos retornar aqui um predicado com verdadeiro ou falso. No nosso caso, será o ponto do usuário ativo, portanto, se nosso usuário estiver ativo , deixaremos dentro de nossa matriz. Em ambos os casos, vamos jogá-lo fora e depois desse trabalho chamar nosso mapa para mapear nomes. O que é importante neste código aqui quando não misturar merkin e filtrar juntos, o que significa que é mais fácil suportar esse código. Agora temos outra tarefa. Você está recebendo certos usuários por idade decrescente e, claro, as primeiras regras também colocam. que significa que nós, em primeiro lugar, devemos resolver o Ray e depois precisamos filtrar nossa taxa e mapear nossos nomes. E como você pode ver aqui agora, além disso, estamos recebendo propriedade de idade. Esta é a nossa propriedade pela qual classificaremos nossa taxa. E, na verdade, em JavaScript, se você quiser pesquisar algo, você deve usar apenas uma única função JavaScript e ela não é classificada. Você não pode fazer isso de forma diferente se não souber como uma função de resort está funcionando. Você pode ir para os desenvolvedores mozilla orig para este URL e aqui está um site de protótipo real. A ideia principal é que são a função de pesquisa colin em nossa matriz e dentro passamos um comparador de funções com A e B e, no nosso caso, será o primeiro usuário e o segundo usuário e , em seguida, o segundo usuário e terceiro usuário, o que significa que ele está comparando elementos um por um. E aqui devemos devolver alguma coisa. Como você pode ver por dentro, podemos retornar menos um. Se A for menor que B A, então vamos auditar. Agora devemos retornar de um se A for maior que B e estivessem retornando zero se forem iguais. E isso é exatamente o que devemos fazer aqui. Então, em todos os três casos, devemos escrever o mesmo código, mas nas duas primeiras variantes será meio fugly porque na verdade devemos fazer a classificação antes do nosso código aqui. Então, vamos comentar nosso código aqui e queremos aplicar certo e aqui queremos escrever o tipo armazenado do usuário e estamos recebendo aqui nosso comparador. Então, temos aqui o usuário um e o usuário dois e queremos compará-los por idade. É por isso que podemos escrever aqui. A idade de um ponto do usuário é menor que o usuário nessa idade. E se for verdade , então aqui temos um operador ternário dois que queremos retornar menos um. Em outro caso, queremos devolver um. Vamos salvar isso e verificar se está funcionando. Estou pulando para o navegador para carregar a página e estamos pegando John e verificamos. Vamos verificar o sal no topo. John é 18 e Jack é 20, o que significa que com os nossos dados ordenados corretamente, mas em ordem decrescente, como você pode ver aqui de deve ordenado em ordem decrescente, o que significa que queremos trocar aqui não menos um, mas um, e aqui será menos um. Vamos verificar o resultado que estamos recebendo, primeiro lugar, Jack e depois John. E esta é a classificação correta também você deve se lembrar dessa operação de classificação em JavaScript mutações e array. Este é o caminho aqui com a classificação de código regular e não atribuímos nosso resultado a alguma propriedade porque ela simplesmente muda nossa matriz de usuários e, em seguida, estamos fazendo outras coisas com ela. Mas, como você pode ver aqui, esse código é realmente separado do nosso loop completo porque devemos fazê-lo antes de nossas operações internas. Agora vamos comentar esse código e tentar usá-lo com nosso mapa e filtro. E aqui é muito mais fácil de fazer porque simplesmente queremos aqui depois nossos usuários chamem ponto de classificação e, depois disso, chamar filtro e mapa. Como você pode ver aqui, quando sou comentado, está muito bonito. Temos aqui nossos usuários estavam fazendo nossa classificação. Depois disso, fazemos nossa filtragem e, em seguida, mapeamos. E antes de tudo, esse código é muito mais fácil de ler. Você tem aqui encadeamento e você está obtendo seu resultado nesta única propriedade. Além disso, é importante que não estejamos misturando operações diferentes. Primeira palavra a ser inserida, depois filtre e depois mapeie. E se precisarmos ajustar um deles, não precisamos mudar a lógica de outro. Vamos verificar se está funcionando e inundando a página e estamos obtendo exatamente o mesmo resultado. Então, como você pode ver, você pode resolver até mesmo a tarefa simples de maneiras diferentes. Se você quiser mostrar na entrevista que é um desenvolvedor avançado, você deve usar uma ferramenta específica para sua tarefa específica. É aqui que a cadeia de pensamento, mapeamento e filtro aqui é muito melhor do que usar o loop for. 5. Diferença entre nulo e indefinido: Você pode ter uma pergunta como essa. O que fará logado no primeiro exemplo e no segundo exemplo? Para responder ao cisalhamento corretamente, você deve entender a diferença entre nulo e indefinido dentro do JavaScript. Como você pode ver aqui, temos dois exemplos. Primeiro exemplo, não atribuímos nada à nossa variável, o que significa que essa variável ainda não está definida. É por isso que quando aqui nós o console registramos essa variável, ela será igual, indefinida aqui depois disso, estamos no login do console o tipo dessa variável, o nome do título também será indefinido aqui temos nosso segundo exemplo. Estamos dentro da nossa variável dois foram atribuídos valor nulo. Aqui estamos o login do console var2. E isso você pode entender aqui nós temos nosso valor. Agora, isso é o que veremos na tela. Mas o tipo de variável dois será um objeto porque não existe esse tipo como agora, é por isso que o tipo de variável é um objeto. Vamos verificar isso. Estou recarregando a página e estamos chegando aqui indefinida. Esta é a nossa variável um aqui. Portanto, o valor dele é indefinido. É o tipo de indefinido é indefinido como string. Agora, após esse registro do console trabalho e trabalhar por aqui, estamos recebendo agora esse é o nosso valor e o tipo de variável é um objeto. Você realmente deve distinguir em JavaScript entre nulo e indefinido. Ele é indefinido. Isso significa que a variável é declarada, mas o valor ainda não foi atribuído dentro dessa variável. Isso é exatamente o que temos aqui na linha três. E agora em JavaScript há um valor de atribuição, o que significa que é um valor que podemos atribuir dentro da variável. No nosso caso aqui estamos assinando agora dentro da variável para. E mesmo que você tenha respondido corretamente aqui, entrevistador pode perguntar, mas qual é realmente a diferença entre agora e depois defini-la quando precisamos usar agora e quando precisamos usar indefinido. E, na verdade, é complicado porque normalmente em idiomas normais, temos apenas uma única propriedade, que significa que o venerável não existe. Por exemplo, botão Novo JavaScript. Temos duas coisas diferentes. Nós o indefinimos e agora temos. E, na verdade, isso realmente depende do estilo do seu código e da sua equipe porque você pode usar os dois dentro do projeto. Mas, por exemplo, prefiro usar sempre online e tentar ter o mínimo indefinido e assim possível. Mas, obviamente, se você está tentando encontrar um valor dentro da matriz, você obterá o indefinido e não agora porque não encontramos nada. Então, a resposta aqui de que é bom usar os dois. Não há realmente algo melhor em um ou outro. 6. A piscar: Você pode ser perguntado na entrevista a pergunta como esta, o que será registrado no console aqui? E como você pode ver aqui, temos o log do console cheio e, em seguida, foo é igual a um. E, na verdade, esta é uma questão típica sobre içamento. Erro de elevação significa que a declaração da sua variável irá bolha para a parte superior do arquivo. E é assim que funciona em JavaScript quando você está usando a palavra-chave var ou a palavra-chave de função. Então a questão é o que veremos aqui, temos aqui console log f2 e f2 é uma variável, mas como você pode ver, não é declarado. E na segunda linha temos foo é igual a um. Na verdade, chegaremos aqui e estreitaremos. Vamos verificar isso. Estou recarregando a página e estamos recebendo foo não é definido por isso acontecer porque sim, a primeira linha que é executada é log do console e foo não está definido dentro de um arquivo. É por isso que temos esse erro. Então, a resposta correta aqui, teremos um erro porque foo não está definido. O principal problema é aqui que normalmente você terá algumas chances apenas de responder no papel sem qualquer uso de computador. Porque, obviamente, os programadores não estão usando computadores todos os dias. É por isso que você realmente não pode testá-lo no navegador. E você precisa entender como tudo isso está funcionando de antemão. Depois de uma transferência correta, você provavelmente será perguntado algo assim. A próxima pergunta, então, ficaremos bem, estamos aqui para o login do console, mas depois disso temos var foo é igual a dois. E, na verdade, aqui a enorme diferença porque a primeira pergunta que tivemos aqui, f2 é igual a uma, mas não tivemos uma criação da variável. Mas aqui temos var2, que na verdade é uma criação da variável. Mas você pode pensar, ok, nós deveríamos acontecer após o log do console, que significa que ainda teremos um erro que foo não está definido porque o Y2 acontece mais tarde. Mas, na verdade, esta é uma resposta errada porque a ideia principal é que enquanto a declaração está borbulhando para o topo do arquivo, o que significa que é exatamente mesmo código como aqui, var foo, e aqui estamos apenas atribuindo f2 para sintonizar. Este é exatamente o mesmo código. É assim que o JavaScript interpreta esse código. É por isso que se abrirmos um navegador, você pode ver que estamos ficando indefinidos, por que está acontecendo, porque na verdade aqui temos var foo e, neste caso, estamos f2 é indefinido porque não atribuímos nenhum valor depois disso, temos um log de console para, estamos ficando indefinidos. E só depois disso estamos atribuindo a forma incitar, o que significa que não será um erro, não será verdade, será indefinido. É. Esse processo é chamado de içamento. Se você respondeu corretamente, você pode obter mais uma pergunta sobre içamento. Como você pode ver aqui, é a pergunta três. Temos aqui total igual a três, depois console log foo e, em seguida, var foo. E acho que agora você saberá a resposta. Sim, temos aqui Portanto, e ele borbulha para o topo do arquivo, o que significa que, na verdade, este fu é exatamente como está escrito aqui, o que significa que na primeira linha estamos definindo completo propriedade no próximo slide onde o pé de entrada ou três. E depois deste formulário de login do console de trabalho, o que significa que será igual a três. E não importa que guerra esteja acontecendo no final. Ele será borbulhado até o topo. Vamos verificar isso. Estou recarregando a página e estamos recebendo três e isso é exatamente o que estávamos esperando. Você pode obter exatamente a mesma pergunta, mas não com palavras, mas com palavra-chave de função, se você tiver algum lugar em sua função de código e, em seguida, o nome da sua função, e então dentro de você está certo, em alguma lógica, essa definição específica vai bolhar para o topo, que realmente significa que realmente não importa em que linha do seu código você é, certo? E função foo, será a primeira linha que será executada em JavaScript, o que realmente significa que se aqui antes de eu chamar foo, está totalmente bem. Como você pode ver no navegador, não estamos recebendo nenhum erro porque esta função foo é borbulhada para o topo e funciona exatamente da mesma forma como var. E aqui está mais uma coisa importante que você dominou para sua resposta. Você deve mencionar que podemos usar const e lead, e não temos problemas com eles porque tanto CONST quanto lead e não borbulhando. O que significa que se fornecer aqui const um igual a um, ele não borbulhará em nenhum lugar. Se for definido na 17ª linha, então ele existirá no 17º voo, o que significa que não temos problemas com o Constant LED. E a forma como o JavaScript interpreta nosso código é exatamente da mesma forma que estamos vendo na tela. Então você pode simplesmente dizer que você está usando CONST e lidera em cada projeto e você não tem nenhum problema com borbulhamento da variável ou com o içamento. 7. Fechamentos: Essa é com certeza uma pergunta que eles ouvem em cada entrevista JavaScript. É por isso que você deve entender o fechamento de água. Como você pode ver aqui, temos uma tarefa, criamos uma função de contador que tenha incremento e obtenha funcionalidade válida. E, na verdade, você pode não obtê-lo dessa tarefa, mas essa é uma tarefa em relação às cláusulas porque devemos criar uma função onde dentro restaure algum valor e temos dois métodos públicos. É assim que você normalmente precisa implementá-lo. Queremos criar nossa função de contador privado, por exemplo. E isso é privado porque estamos iniciando o lado contábil, que não está disponível fora. E, na verdade, isso é apenas uma função. Mas se você ouvir em entrevistas que você deve ou algo dentro da função, depois de chamar essa função, então você tem uma pergunta sobre o fechamento. O que queremos fazer aqui, queremos que criemos nosso contador. Vamos nomear a contagem e, por padrão, será 0. Agora devemos retornar nossa API pública, esses dois métodos aumentam e obtêm uma funcionalidade justa. É por isso que estamos fazendo aqui voltar e por dentro queremos devolver duas coisas. Primeiro de tudo, é uma função de incremento. Esta é apenas uma propriedade onde estamos passando dentro do nosso valor. E o que queremos fazer, queremos mudar essa contagem que temos no topo aqui. Estamos bem aqui, contamos mais iguais, e aqui está o nosso valor que queremos aumentar. E, na verdade, pode ser que queremos aumentá-lo por padrão, apenas por um. É por isso que faz sentido passar aqui um, neste caso, podemos simplesmente chamar incremento e funcionará fora da caixa. E o próximo método estará aqui, GetValue porque queremos recuperar nossa contagem. E, na verdade, aqui esta é apenas uma função que retornará nossa contagem. E a ideia principal é que essa é nossa API pública. Isso é o que está disponível dentro dessa função depois de chamá-la, vamos verificar isso. Vamos criar aqui nosso contador e estamos dois pontos aqui, nossa função de contador privado. E, na verdade, o que eu quero fazer aqui, quero consolar o log antes de tudo, nosso ponto contador GetValue. Este é um método para obter nosso contador. E em segundo lugar, queremos chamar o ponto do contador, e aqui está o incremento para incrementar o valor R e depois contabilizar mais uma vez para verificar o valor. Mais uma vez, vamos verificar se está funcionando. Estou recarregando a página, estamos recebendo 01. Mas o mais interessado na ideia do que temos dentro deste balcão privado, se estivermos aqui, balcão privado, você pode ver que esta é uma função e, na verdade, não temos nenhuma acesso a essa contagem de propriedades. Esta contagem de propriedades neste caso é privada. E dado se eu estiver aqui contador, você pode ver que estamos recebendo um objeto com dois valores, obter valor e incremento, e não temos acesso à nossa propriedade de contador dentro. Esse código está funcionando, mas é realmente complicado e complexo porque isso é um fechamento. O que significa closure ever? Encerramento significa que acessamos dentro de uma função para o escopo externo, que realmente significa aqui, por exemplo, dentro do incremento que estamos usando count e não temos um desconto dentro disso função. Nós o temos lá fora aqui no topo e exatamente o mesmo em relação a obter valor. Temos este contador aqui na parte superior, não dentro desta função, o que significa que colagem ou função tem acesso a todas as propriedades dentro de si e todas as propriedades que foram definidas antes. Por que é importante porque eles na verdade, com este único forro, contador de contras é igual a balcão privado, estamos criando um fechamento porque agora estamos contador existe. Temos um encerramento e temos essa referência a este contador. É por isso que toda vez que estamos chamando GetValue e incremento, ele está funcionando e está referenciando essa contagem no topo. E você pode dizer, ok, mas está soando como mágica. Eu não entendo como ele está se parecendo em JavaScript. E é aqui que o Console Directory pode nos ajudar se escrevermos dentro do console, não no log do console, mas no diretório do console. E por dentro eu quero passar uma função. No nosso caso, ele é contrariado GetValue e oculto aqui, insira. Aqui não vemos um corpo, mas, em vez disso, nossa função é um objeto. E estamos interessados aqui em parte que se chama escopos. E isso é exatamente o que estamos interessados depois abrimos aqui escopos, temos aqui um fechamento de propriedade, e este é exatamente o nosso fechamento, como você pode ver aqui, temos um balcão privado de fechamento. Aqui, contagem é igual a um, o que significa que exatamente nós temos essa contagem de leads igual a 0, e agora é fechamento interno. É por isso que ele está disponível para nós dentro do JavaScript. E as perguntas mais antigas sobre cláusulas eu exatamente o mesmo. Por exemplo, você pode ser feita a pergunta, você precisa criar uma função que armazenará dentro da string secreta, e nós apenas a retornaremos quando chamarmos essa função novamente, ela irá parece algo assim. Por exemplo, vamos criar um segredo privado de função. Aqui não passamos nada para dentro, mas queremos fazer por dentro é criar nossa cadeia secreta. Então, vamos apenas criar um segredo e ele é igual a quatro. Então esse segredo é exatamente nosso fechamento. Para que ele esteja disponível fora, devemos retornar aqui uma função. Simplesmente retornamos aqui uma função, e essa função retornará um segredo. Isso significa que quando estamos criando fora de uma função que podemos nomear, por exemplo, obter segredo, ela deve chamar aqui nossa função secreta privada. A ideia principal é que a função secreta privada devolva uma função. Nesse caso, r obtém Secret é uma função. E agora podemos console log hour fica secreto e simplesmente chamamos isso. E, na verdade, como você pode vê-lo console, estamos recebendo essa tela cheia de volta. É por isso que nossa string secreta é realmente um fechamento e está disponível fora após restaurar esse segredo privado dentro da propriedade adicional. Nesse caso, estamos iniciando divulgação depois que nossa função foi executada. E o fechamento é um padrão super popular dentro do JavaScript. É por isso que você deve saber como usar fechamentos. 8. Currying: Você pode ter uma pergunta como essa. Escreva uma função que ajuda a conseguir multiplicar e b e retorna produto de a e B. E, como você pode ver aqui, temos essa notação estranha. Multiplique-os a e B, não como dois argumentos, mas esta é a primeira chamada da função, e esta é uma segunda cor da função. E, na verdade, se você está recebendo essa pergunta, isso significa que você está indo na direção da corrente. E atual é uma possibilidade especial em JavaScript de carregar uma função. E então podemos chamá-lo assim. E, na verdade, aqui podemos implementar essas coisas com corrente super básica. Vamos experimentar isso agora. O que eu quero fazer, quero criar a função de multiplicação. E aqui estamos recebendo nosso a, então será o número um, por exemplo. Aqui queremos retornar uma função porque, como você pode ver aqui no topo, estamos chamando o resultado da multiplicação a, b, o que significa que estamos multiplicando master return a função. Então aqui podemos escrever que estamos recebendo uma função que obterá B. Este é o número dois, por exemplo. E aqui dentro queremos multiplicar nosso número 1 e num2. Nesse caso, nossa segunda função nos proporcionará multiplicação do número um e do número dois. E é assim que podemos usá-lo. Podemos escrever aqui o log do console. Queremos chamar aqui, multiplicarei a função e estamos passando um, por exemplo, dois. E depois disso estamos chamando b. Esta é a nossa segunda função e estamos passando no S3. Vamos dar uma olhada no navegador. Estou recarregando a página e estamos recebendo seis, o que significa que esse código está funcionando. E, na verdade, você pode escrever essa função de multiplicação de maneira melhor. Você pode simplesmente omitir aqui os retornos e, em seguida, será um simples forro único. Temos aqui a função multiplicar e estamos ficando entorpecidos aqui. Então queremos retornar aqui uma função, e estamos chegando aqui num2. E queremos multiplicar nosso número um, multiplicando o número 2. Essa é exatamente a mesma lógica, mas está raciocinando a única linha. Agora, eu virei e disse o código anterior. E vamos verificar, como você pode ver, estamos obtendo exatamente o mesmo resultado, mas isso não é realmente atual. Se você resolver essa tarefa, normalmente você será perguntado, ok, mas o que você escreveu aqui? O que isso significa? Por que precisamos de uma notação tão estranha? E, na verdade, você deve dizer que estamos falando aqui sobre o atual, há uma próxima pergunta que você pode obter é criar um tipo de função. E esta é, na verdade, uma pergunta difícil. E se você não tiver nenhuma experiência as funções atuais, provavelmente não será inseguro. É por isso que aqui veremos como podemos criar um tipo de função e por que precisamos delas e realmente carregamos funções funcionam exatamente como eu multiplico aqui. Então, podemos escrever no navegador, por exemplo, Kyrie, e essa é a nossa função. Devemos sempre passar para dentro da função que queremos cobri-la. Neste caso, temos, por exemplo, uma função com a, B e C. Então, temos três argumentos e queremos apenas somar um mais B mais C. O ponto principal é que o resultado do cardi é um função e vamos nomear isso carregou alguns. É assim que estamos usando o atual, o que podemos fazer com o carro em alguns mais tarde, podemos escrever aqui nossos argumentos. Temos três argumentos, como queremos, por exemplo, podemos escrever aqui 123, assim como três argumentos normais. Também podemos chamá-lo com 123, o que significa que não estamos obtendo um resultado até que estejamos recebendo três argumentos. Por exemplo, temos apenas um argumento aqui, um, então ele retornará a função parcialmente aplicada, que significa que estamos recuperando uma função. E então, se chamarmos essa função e passarmos dois argumentos, então estamos recebendo argumentos suficientes e retornaremos um resultado. E, claro, também deve ser possível chamar a função assim. Primeiro de tudo, estamos chamando isso com um e depois estamos chamando com 23. É assim que a função normalmente carregada está funcionando e nós a criaremos agora. O que queremos fazer aqui, queremos criar uma função curried. E como eu disse, isso é algo mais avançado e na verdade, é uma boa ideia escrever essa função era o arquivo de script ECMO. Então, essas palavras-chave de função, só porque estamos escrevendo algo que será usado como uma biblioteca. É aqui que eu quero escrever uma função, e aqui estamos recebendo uma função. E, na verdade, aqui no topo, vamos tentar, nosso uso, então entendemos do que estamos falando. Dissemos aqui que queremos que nós carregamos alguns. Estamos chamando aqui nossa função atual. E dentro estamos passando uma função com a, B e C. E aqui queremos somar a, B e C. E, na verdade, não consigo nem escrevê-la aqui na parte inferior após nossa consulta. Assim, podemos testar se está funcionando, na verdade, como você pode ver aqui, como nossa função atual. E estamos entrando na função. Este é o nosso Fn, este abc e a mais b mais c é nossa função aqui. Mas queremos fazer agora queremos saber quantos argumentos temos aqui. É aqui que eu quero criar uma propriedade que se chama arity. Aqui podemos apenas escrever comprimento da função e obteremos a quantidade de argumentos aqui. Vamos verificar isso. do registro do console. E aqui está nossa aridade. Estou procurando no navegador e estamos recebendo três, porque aqui temos três argumentos, a, B e C. Agora queremos retornar aqui uma função porque sabemos que a função atual é sempre uma função. Isso é y aqui Vamos escrever a função, vamos nomeá-la, por exemplo, f1. E aqui eu quero espalhar nossos argumentos e vamos verificar o que temos aqui dentro, console log F1 aqui nossos argumentos. E, na verdade, quando eu recarrego a página, como você pode ver, não recebemos nada porque não chamamos esse carro em algum. O que devemos fazer depois, devemos chamar soma desencorajada como uma função e podemos passar para dentro de algo. No nosso caso, podemos passar 123. Esses são nossos três parâmetros. Estou recarregando a página e estamos chegando aqui f1, 123. Então, estamos recebendo todos os argumentos como uma matriz. Essa é nossa ideia. E, obviamente, também podemos chamar essa função apenas com uma. Em seguida, obteremos uma matriz com apenas um argumento. O que eu quero fazer dentro, quero verificar quantos argumentos recebemos ou se temos argumentos suficientes ou não. É aqui que aqui dentro do retorno podemos comparar o comprimento dos argumentos, este é o comprimento de nossa matriz é maior ou igual aridade. Isso significa que estamos recebendo argumentos suficientes para sair da função. Então, aqui eu quero consolar o registro de argumentos suficientes. Nesse caso, eu só quero retornar aqui nossa função e chamá-la com nossos argumentos. Estou espalhado em nossos argumentos novamente, e isso colocará aqui todos os argumentos assim como eram anteriormente. Vamos verificar isso. Estou recarregando a página e temos uma mensagem de argumentos suficientes. E, na verdade, aqui podemos registrar o que estamos recebendo de volta. Nesse caso, devemos obter nosso resultado. Estou recarregando a página, estamos recebendo seis. Está funcionando corretamente, o que significa que nosso código já funciona quando estamos passando três argumentos ao mesmo tempo. Mas não funcionará quando estamos passando menos do que isso. É aqui que devemos escrever aqui L Condição e dentro podemos escrever, por exemplo, o login do console precisa de mais argumentos. E agora, depois que este livro queria retornar uma função, como eu já disse, se passarmos, por exemplo, incentive apenas um argumento. Ele deve retornar uma função onde podemos passar argumentos adicionais. É por isso que aqui devemos retornar uma função e podemos nomeá-la, por exemplo, F2. E por dentro passaremos mais argumentos, o que realmente significa que este é o nosso primeiro carvão, esta é a nossa segunda cooperativa. Por exemplo, aqui quando passamos a soma atual, essa também é uma função atual. Vamos nomear isso parcialmente carregou alguns. Aqui chamamos carregou alguns. Agora aqui eu quero construir uma soma parcialmente correta para que possamos verificar o que ela faz. Como você pode ver aqui, nós não precisamos de argumentos, e aqui está nossa função era mais argumentos. E, na verdade, aqui queremos passar alguns argumentos. Por exemplo, podemos passar aqui 23, e serão exatamente esses mais argumentos que escrevemos aqui. O que queremos fazer agora, queremos concatenar nossos argumentos com mais argumentos para colocar todos os nossos argumentos dentro da chamada da função. É por isso que aqui podemos criar uma variável, novos argumentos, e queremos concatenar aqui nossos argumentos. E estou chamando aqui concat e estou passando insight mais argumentos. Agora, aqui não precisamos chamar nossa função fn como fizemos aqui, mas devemos chamar nossa função F1 porque queremos essa verificação para argumentos suficientes repetidas vezes, que significa que nós estão chamando isso recursivamente. É por isso que aqui eu quero retornar a função F1 e eles querem espalhar todos os nossos novos argumentos. Aqui é onde aqui três pontos e novos argumentos. Vamos verificar isso. Estou recarregando a página aqui. Estamos conseguindo atender meus argumentos e argumentos suficientes. O que isso tem um meio? Aqui está a nossa soma atual. Passamos aqui um argumento, estamos entrando em células. Este é o nosso log do console precisa mais argumentos e aqui está nossa função adicional. É aqui que estamos chamando essa função e estamos passando aqui são mais argumentos. Essa é essa variável. Agora aqui nós o concatenamos, nosso. Isto é o que passamos aqui e 23, e chamamos de nossa F1. Estamos chegando aqui novamente, temos argumentos suficientes, e aqui estamos chamando nossa função e estamos recebendo seis. Agora vamos remover todos os registros do console e verificar como ele está funcionando. O que eu quero tentar aqui é o nosso correto como podemos chamá-lo, podemos chamá-lo com 123 e estamos recebendo seis. Está funcionando. Agora podemos chamá-lo com um. Como você pode ver, estamos recebendo de volta uma função e agora podemos chamá-la com 23 é que você pode ver que estamos recebendo seis também, o que significa que está funcionando. E agora podemos chamá-lo aqui com fezes e depois disso com três e estamos recebendo seis, o que realmente significa que está funcionando corretamente com qualquer quantidade de argumentos. E aqui nós carregamos alguma função em que temos dez argumentos. Então aqui estamos fazendo alguma operação com argumentos Stan. Então aqui chamaremos essa função recursivamente até obtermos todos os argumentos necessários. Como você pode ver, escrever a função de carreira não é o TGA. E se você nunca fez isso antes, é difícil escrever isso diretamente na entrevista, especialmente apenas no pedaço de papel. A última pergunta que você pode obter aqui, ok, mas por que precisamos da função curry? E o que sua função atual pode fazer? É por isso que aqui queremos agora usar nossa função de carreira em nosso projeto real. E o que podemos fazer aqui, podemos chamá-lo de duas funções, obter e mapear. Vamos experimentar isso. Eu quero criar uma função get e eles querem carregar. É por isso que estou chamando esse tipo de função. E por dentro estou passando uma função com duas propriedades. Primeiro de tudo, será propriedade e, em segundo lugar, será um objeto. E o que queremos retornar aqui, só queremos pegar um objeto por chave e ele será propriedade. Vamos verificar como ele funciona. Como você pode ver aqui temos nosso get e aqui estamos passando dois argumentos. Primeiro de tudo propriedade, por exemplo, AD e, em segundo lugar, nosso objeto, por exemplo, um D1. Nesse caso, estamos recebendo um de volta. O que podemos fazer aqui, agora podemos porque é carregado, basta chamá-lo com um argumento, apenas com AD. Isso, você pode ver que estamos recebendo de volta uma função atual agora podemos armazená-la em algum lugar e reutilizar. Por exemplo, podemos criar aqui uma função adicional, obter ID, e estamos chamando aqui get com apenas ID de propriedade. Agora, como você pode ver no navegador, podemos usar a função GetId em todos os lugares em seu aplicativo em qualquer objeto para obter o ID apropriado dele. Agora podemos fazer exatamente o mesmo com o mapa. Por exemplo, aqui eu quero criar um mapa e eles querem carregar uma função de mapa. Aqui estamos recebendo uma função que é um argumento do mapa e dos valores que é uma matriz. Aqui eu quero apenas chamar valores JavaScript simples que mapeiam e, em seguida, passar nossa função para dentro. Mas agora nosso mapa é carregado, o que significa que podemos usá-lo em todos os lugares como mapa de cenoura, por exemplo, podemos passar dentro de um mapa, obter ID. E agora aqui como o segundo argumento, podemos passar uma matriz e apenas ter aqui id igual a um. Como você pode ver aqui, temos diretamente uma matriz de IDs com a ajuda do mapa. E, na verdade, aqui boop passa dois argumentos, mas também podemos cobri-lo. Por exemplo, podemos nomear uma função aqui, const, obter IDs, e aqui nascemos para chamar nosso mapa no GetID. Nesse caso, temos uma função aplicada parcial, obtemos um d e podemos usá-la para obter ideias de muitos array. Por exemplo, aqui estamos certos e temos ideias. E estamos chamando essa função na matriz com objetos dentro. E temos aqui um D1. E como você pode ver, está funcionando. Essa é exatamente a necessidade da corrente para escrever JavaScript e forma funcional. E aqui está, esse é um tópico bastante avançado. É por isso que é completamente bom se você não conhece esse tópico como iniciante, mas pelo menos você deve ter algum entendimento básico do que é atual e por que você precisa dele? 9. Adicionar elementos à matriz: Você pode obter uma pergunta como essa e apresentar sobre a adição de elementos à matriz. Como você pode ver aqui, devemos tentar funcionar que obtém uma matriz e um elemento e retorna uma matriz com o acordo. Isso, na verdade, parece muito fácil, mas você pode resolvê-lo de maneiras diferentes. É por isso que você deve resolvê-lo corretamente e pelo menos dizer ao entrevistador da maneira correta. Então, normalmente, os iniciantes usarão aqui array push, e então estamos construindo algo assim. Portanto, temos uma função, por exemplo, anexar, e estamos entrando em argumentos, array e nosso novo elemento. E o que estamos fazendo aqui, estamos usando o array push e estamos passando para dentro R, L. E depois disso estamos retornando esse novo array. Então nós apenas escrevemos aqui o log do console anexar, e aqui estamos verificando, ok , Por exemplo, temos nossa matriz 12, e aqui nosso terceiro elemento três. Agora vamos verificar se está funcionando onde recarregar a página e estamos recebendo 123, e você acha que você constrói essa função corretamente. Mas aqui está o problema. Na verdade, quero escrever aqui nossa matriz. Vamos nomeá-lo, por exemplo, números, e não salvamos 12. Agora aqui dentro depende, eu quero apenas passar nossos números. Mas depois disso eu quero consolar números de log, estava recarregando a página e estamos recebendo 123123. O que isso significa? Temos essa função append e estamos retornando aqui a matriz. E a maioria das pessoas pensará que quando estamos usando essa função, estamos criando uma nova matriz. É aqui que normalmente eles podem escrever novos números. Aqui estamos chamando nossa função de anexação e pensamos, ok, não modificamos nosso raio mais antigo, mas apenas obtemos novos números porque função append retorna para nós uma matriz. Mas, como você pode ver, esses dois arrays são completamente iguais porque push real do array modifica o raio mais antigo e não cria uma nova matriz. E isso geralmente é um bom exemplo de código ruim no aplicativo. Por que isso? Imagine que você tem uma parte do seu aplicativo e você tem o array desse número e , em algum momento, sua função disciplinada de coluna para obter novos números. Mas então, do nada, sua matriz de números antiga modificada, o que você não pretendia fazer. É por isso que você acha que em sua aplicação alguma mágica pode acontecer apenas porque os dois pontos dessa função modificam alguns dados fora dessa função, essa é uma abordagem ruim. Como podemos corrigi-lo e torná-lo melhor. Não devemos usar aqui array push. Não é seguro. O que queremos usar aqui, por exemplo, operador spread, podemos escrever aqui que queremos retornar uma nova matriz e queremos espalhar todos os elementos da nossa matriz que estamos recebendo como argumento. E se você não sabe qual é o spread, este é um operador ECMO Script seis, esses são três pontos. E o que estamos fazendo aqui, estamos espalhados em todos os elementos dessa matriz dentro de nossa nova matriz, o que significa essencialmente que estamos criando uma cópia dessa matriz. Agora mova um para adicionar esse elemento no QRA a seguir. É por isso que acabamos de tentar o elemento coma. Vamos verificar isso agora. Estou recarregando a página e aqui estamos recebendo outra resposta. Estamos chegando aqui 123 e aqui 12, o que realmente significa que esta única linha que retornará para nós nova função de matriz é completamente segura porque não estamos modificando nenhum dado fora dessa função. É por isso que essa implementação é muito melhor se você for perguntado mesmo algo tão trivial, como empurrar elementos para o array também tem o executivo o mesmo comportamento com objetos. Se estivermos passando para dentro de uma função, um objeto e quando mutados lá, então estamos mutando objetos fora de nossa função, e isso é ruim. E você também pode usar spread com um objeto para criar um novo objeto. Nesse caso, estamos no lado seguro. Se você não soubesse que essa função como aqui é chamada pura porque antes de tudo, essa função retornará o mesmo resultado toda vez quando a chamarmos com os mesmos argumentos. E, em segundo lugar, não modifica nenhuma variável fora da função. Isso é y, esta é uma função segura e pura. 10. Arrays Concatenating: Já falamos sobre elementos ocultos para a matriz e por que Bush nem sempre é a melhor abordagem. Mas você também pode ter uma pergunta semelhante. Por exemplo, aqui temos uma tarefa, escreva uma função que concatenará dois arrays. E, na verdade, você pode usar aqui push e será uma resposta errada. É por isso que aqui você pode realmente escrever as matrizes de mesclagem de função. Aqui estamos recebendo dois arrays, por exemplo, array um e array para. E aqui você pode escrever o array um, Bush, e aqui você se espalhou da matriz dois. E depois disso, você pode simplesmente retornar o array um. E, na verdade, muitas pessoas não vão escrever código assim porque aqui você está usando push e então você está espalhado em array para, mas você pode pensar sobre essa abordagem. Agora, para ver o problema, devemos criar, primeiro lugar, nosso resultado. Aqui dentro do resultado, precisamos usar dois arrays. Array 1, por exemplo, será apenas um e nosso array dois aqui será, por exemplo, 23. Agora queremos chamar nossa corrida de fusão e passar e disse antes de tudo array um e segundo array dois. E vamos verificar e bloquear o console o que estamos recebendo. Então, antes de tudo, resultado, depois array um e matriz dois. Estou recarregando a página e estamos recebendo 12312323. Esse é exatamente o problema, como se não fosse o vídeo anterior. Bush mutate array. Este é o caminho aqui, estamos mudando o array um, mesmo se não quisermos alterá-lo. É por isso que empurrar neste caso não é a melhor abordagem. O que podemos usar aqui é eu, o concat de matriz, que tem toda a abordagem de JavaScript ou apenas um operador de spread, assim como fizemos anteriormente. Então, em vez desse retorno e do impulso real, podemos escrever aqui antes de tudo, array one dot concat, e temos função concatenar na matriz. E aqui estamos espalhados em nossa matriz dois, vamos verificar o Sul onde recarregar a página aqui é o nosso resultado 123 e aqui matriz um e matriz de dois a três. Essa é exatamente a abordagem correta porque concatenar não muda uma matriz. Nesse caso, ele retornará para nós em uma nova matriz. É por isso que está tudo bem. Se você não quiser usar re concat, você sempre pode usar apenas um operador de spread. Aqui usaremos o array um como um spread. Aqui estamos espalhando nosso tubo de raios. E, na verdade, o resultado será exatamente o mesmo em que obter 123. E, na verdade, eu realmente gosto dessa abordagem porque ela é mais flexível e você pode mesclar não apenas raça, mas também objetos. Você pode adicionar novos elementos aqui e é mais moderno. Se você, por exemplo, tiver uma pergunta para concatenar três matrizes ou mais, também é possível, na verdade, até mesmo o array concat pode trabalhar com vários arrays, como você pode ver aqui na documentação aqui temos três matrizes diferentes. Você pode escrever primeiro concat de ponto de matriz e, em seguida, você tem uma matriz secundária e terceira. E, na verdade, funcionará corretamente, mas na verdade você pode fazer exatamente o mesmo com spread aqui você está espalhado na matriz um, matriz dois, matriz três. Se você precisar. Ambas as variantes são possíveis. 11. Verifique se o usuário com esse nome existe: Você pode ter uma pergunta. Verifique se o usuário com esse nome existe na matriz de objeto. Obviamente, não pode ser nome ou não usuário. Mas a ideia é que você precisa verificar uma propriedade do objeto dentro de uma matriz. Na verdade, existem diferentes maneiras de implementar isso. E a pior maneira possível é usando for-loop. Porque, como eu disse anteriormente, for-loop é de nível super baixo e não é uma ferramenta certa para essa tarefa específica. Vamos ver como se parece com o loop for. Então, aqui queremos criar uma função, por exemplo, se o nome existe. E aqui devemos passar dois argumentos. Primeiro de tudo, é um nome e, em segundo lugar, é um conjunto de nossos usuários. Agora, dentro da propriedade criativa de máscara, que será booleana, e isso nos mostrará que temos esse usuário dentro de uma matriz. Aqui podemos fazer um lead existir e, por padrão , ele será falso. Agora devemos escrever um loop for. Então aqui temos nosso lead I de 0, eu menos que o comprimento dos usuários. E aqui estamos fazendo I plus plus. Agora, o que queremos fazer dentro de cada elemento, devemos verificar seu nome. É aqui que estamos verificando os usuários. nome do ponto é igual ao nosso nome. E se for igual, então queremos atribuir por dentro existe. Após nosso loop for, queremos retornar nossa propriedade exists. Sim, esse código funcionará. Vamos verificar isso, mas é um nível super baixo, como você pode ver, temos, por exemplo, chamado John. Vamos tentar aqui, Jon e ouvir coma nossos usuários. Como você pode ver, estamos passando porque ouvimos esse usuário com esse nome dentro da matriz. Se eu estou escrevendo aqui completamente, estamos ficando falsos. Mas o problema com esse código, ele não mostrará que você é um desenvolvedor avançado. É por isso que eu queria mostrar a vocês três outras possibilidades de escrever esse código. E, na verdade, todas essas três possibilidades são ocasiões. Meu favorito será uma única linha aqui, para que possamos criar uma função é que o nome existe, e aqui estamos recebendo nome e array. E como você pode ver aqui, eu não tentei aos usuários butter ray, porque agora podemos usar essa função em qualquer dado. Agora, o que eu quero chamar aqui é a soma de pontos da matriz. E se você não sabe o que Sam está fazendo, você pode chamar alguns sobre o raio dado alguns predicados. Então você quer verificar algo lá dentro. No nosso caso, alguns retornarão um canudo se tivermos pelo menos um único elemento que atenda a nossa condição. Dentro de alguns, podemos conduzir o elemento. E queremos verificar aqui, nome do elemento é igual aos nossos nomes que foram passados para dentro. E este é literalmente o mesmo código que escrevemos aqui, mas muito menor. Vamos verificar o som. Estou recarregando a página e só estou digitando o nome dele existe como você pode ver onde se tornar verdade. Então, na verdade, algumas são a melhor solução para essa questão, mas também é possível usar outras soluções. Então, vamos comentar isso e tentar novamente. Temos aqui novamente dois argumentos, nome, matriz. Agora, dentro, podemos tentar encontrar o elemento com esse nome. É aqui que aqui vamos criar um elemento e estamos usando aqui array dot find onde obter nosso elemento. E aqui queremos verificar o nome do ponto do elemento é igual ao nosso nome a partir do topo. Mas, neste caso, nosso elemento é, na verdade, um objeto. Não é um booleano. É aqui que ele vai cervejar o elemento wrapper em booleano para retornar booleano e não um objeto. Nesse caso, ele funcionará corretamente. Estou recarregando a página, pois você pode vê-la como funciona exatamente assim. Então, as principais diferenças que foram dominam um pouco mais de código porque devemos convertê-lo em booleano. E a última coisa que podemos usar aqui não está bem, mas encontrar índice. E se você não sabe o que acha que o índice está fazendo é exatamente a mesma lógica, mas estamos encontrando o índice desse elemento. Se pudermos encontrar o objeto com esse nome dentro da nossa matriz. Aqui não estamos recebendo nosso índice de botão Element. E depois disso, saberemos que se esse índice for menor que 0, esse item não foi encontrado. Aqui. Podemos tentar retornar índice maior que 0. Neste caso, sabemos ou K É maior que 0. Temos esse elemento dentro da matriz. E, como você pode ver, esse código está funcionando exatamente da mesma forma. Minha abordagem seria soma, a próxima abordagem ficaremos bem. A busca do índice também está boa, mas você não deve usar for-loop porque é altamente ineficiente para essa tarefa. 12. Remova todos os duplicados na matriz: Você também pode obter uma tarefa como essa. Remova todas as duplicatas no array. que basicamente significa que se você tiver uma matriz de números e você tiver, por exemplo, 112, você precisa viver no 12. Vejo aqui três maneiras diferentes de resolver nosso problema. Vamos tentar com a melhor solução. Por exemplo, podemos criar aqui uma matriz exclusiva de função. Estamos recebendo aqui nosso array para remoção de duplicatas. Aqui o que queremos fazer cupom para retornar uma matriz e queremos espalhar dentro do novo conjunto e onde o bisão dentro da matriz, se você não sabe o que é o conjunto em JavaScript, é um objeto que permite que você armazena valores exclusivos de qualquer tipo. Isso significa que se estivermos bem aqui e você disse que estamos passando dentro da matriz, por exemplo 112, onde o Enter oculto, como você pode ver, temos o conjunto apenas de 12 porque dentro do nosso conjunto os elementos podem ser duplicado. É por isso que, como você pode ver, se nos espalharmos no seu conjunto e colocá-lo na nova matriz. Para converter revés em array, obteremos nossos elementos exclusivos. E, na verdade, muitas pessoas não sabem sobre essa solução, mas essa é a melhor solução porque é, primeiro lugar, um único forro. Em segundo lugar, raramente é desempenho se você fizer não, essa solução, não é ruim. Você sempre pode construir essa lógica por conta própria. A parte mais importante que mesmo o FOR loop aqui, se você estiver usando a incursão forEach não é tão ruim. Vamos verificar isso. Por exemplo, temos aqui a mesma função, matriz exclusiva, e queremos escrever aqui um loop. E, claro, precisamos armazenar nosso resultado em propriedades adicionais. Então, vamos fazer aqui o resultado que será o nosso array exclusivo. Agora, aqui eu quero percorrer cada elemento do nosso array com a função forEach. Aqui estamos recebendo nosso item como todos os elementos da nossa matriz. Agora, o que queremos verificar aqui, se já tivermos esse item dentro do nosso resultado, podemos verificar aqui o resultado inclui pontos. E se você não sabe, inclua, verifique se temos o acordo dentro uma matriz e queremos passar para dentro do nosso item. Portanto, isso retornará verdadeiro se for incluído. Mas, na verdade, devemos colocar aqui banco para ter uma negação. Se ele não incluir esse elemento dentro da matriz , queremos empurrá-lo para o nosso resultado. Então resulte Bush e aqui com o item. Então, como você pode ver, mesmo para cada loop aqui não é tão ruim porque está isolado dentro de uma função onde mais simples percorre cada elemento e estamos empurrando nosso resultado diretamente no novo array. E, claro, no final, devemos retornar nossos resultados. Então, aqui vamos retornar o resultado e verificar se ele está funcionando. Aqui está nossa função matriz exclusiva 112. E como você pode ver, estamos recebendo 12 de volta. Mas, obviamente, nossa função não funcionará com objetos ou matrizes dentro, e isso é completamente normal. Então, se você tem aqui um objeto com um igual a um, e aqui você tem mais um objeto com um igual a um. Como você pode ver, estamos recebendo dois elementos e isso é totalmente bom porque são dois objetos diferentes e não podemos compará-los. E, na verdade, podemos derivar isso para ricos usando Reduce. Desta forma, escreveremos exatamente o mesmo botão de código da maneira mais funcional. Então, aqui vamos criar nossa matriz exclusiva de função. Estamos recebendo aqui nossa matriz e queremos diretamente retornar um re, reduzir. E aqui dentro devemos passar nossa função com acumulador e cada elemento. Aqui temos uma função e, como argumento padrão, temos aqui uma matriz vazia, exatamente como tínhamos aqui onde escrevemos resultado é igual a matriz vazia. Agora, o que queremos fazer dentro, queremos verificar nosso acumulador inclui, então estamos verificando nosso resultado. Se tivermos nesta matriz resultante nosso elemento. Então, se o tivermos, simplesmente retornamos acumulador para não mudarmos nada. Em outros casos, queremos empurrar esse elemento para o acumulador e não estamos usando o array push, mas estamos usando spread. Aqui. Estou espalhado no acumulador e depois estou adicionando nosso elemento. Dessa forma, esse código é completamente funcional. É fácil de entender e não teria esse impulso desagradável aqui. Vamos preencher a página e verificar se ela está funcionando. Como você pode ver, ainda não funciona com assuntos, o que é totalmente bom. E funciona com primitivas Porque aqui um foi removido do nosso array. Como você pode ver, você tem três variantes diferentes para implementar a exclusividade no array. E, na verdade, todas essas reversões estão completamente boas para mostrar na entrevista. 13. Classificando o array: Já tivemos um certo exercício quando mapeamos nossos usuários em um dos vídeos anteriores. Mas aqui eu quero falar sobre cirurgião, um pouco diferente. Como você pode ver, você pode obter a pergunta, classificar a matriz de números. O que realmente significa que temos uma matriz, por exemplo, 351, e devemos classificar. Para isso, estamos usando determinada função em JavaScript. Simplesmente escrevemos tipo. Aqui devemos passar uma função e temos essas condições. Quando menos de b, estamos retornando aqui menos um se maior que, maior que 10 se forem iguais. E anteriormente escrevemos aqui a e B, e aqui podemos escrever um menor que b, então estamos retornando menos um. Em outro caso, estamos devolvendo um. Além disso, é importante lembrar que certos retornos, o resultado do certo, que significa que podemos colocá-lo em variável, por exemplo, resultado, mas também mudará nossa matriz que criamos. E, na verdade, não faz sentido aqui porque isso gerou array em tempo real. Mas se as pessoas colocam na variável, então faz sentido. Aqui temos nossa matriz e aqui estamos certamente, vamos dar uma olhada no exemplo. Sou login do console aqui, array e resultado. E como você pode ver no navegador aqui, estamos recebendo exatamente a mesma matriz classificada. Isso está acontecendo porque as mutações de classificação existem em uma matriz e devemos nos lembrar disso. Além disso, há mais um ponto importante a ser lembrado. Na função de comparação, podemos retornar um número maior que 0 e menor que 0, e será exatamente o mesmo. Será antes de a e classificar a antes de B, que realmente significa que podemos escrever nosso código um pouco diferente e não com menos 11, podemos simplesmente retornar aqui um menos b. Por que isso? Porque temos aqui dois números, por exemplo, três menos cinco. Neste caso, será menor que 0. E então teremos essa condição classificar um antes B. Vamos verificar isso. Estou recarregando a página. Estamos recebendo de um a cinco como anteriormente, se as pessoas aqui, b menos a, então elas serão classificadas em outra direção. Como você pode ver, estamos recebendo cinco a um, o que realmente significa para classificação, podemos classificá-lo retornando menos 11 ou algo menor que 0 e maior que 0. Além disso, é importante lembrar que podemos usar a classificação nas primitivas Louis. Se você estiver tentando classificar aqui um objeto, ele não fará nada porque você não pode realmente comparar objetos, mas pode classificar propriedades e objetos do site. E temos uma tarefa de classificar uma matriz de nossos livros pelo sobrenome do autor. Aqui podemos usar exatamente a mesma função AND de pesquisa. Estamos escrevendo aqui, livros classificam pontos, e aqui estamos recebendo como argumento, livro um e livro dois. E agora devemos compará-los corretamente. Então, antes de tudo, devemos encontrar um sobrenome do primeiro autor e do segundo autor. Aqui vamos escrever um sobrenome incrível, um. E aqui pegamos nosso livro one.org. E aqui queremos dividir nosso nome com espaço e chegar aqui primeiro argumento. Nesse caso, teremos o sobrenome do nosso incrível. Agora vou copiar colar esta linha e aqui também temos o LastName também, e aqui está o livro dois. E agora, após este fim de semana, compare essas duas cordas. É por isso que aqui podemos escrever ou LastName um menor que o ASO, ferramenta LastName, então queremos retornar menos um. No outro caso, retornaremos um. E, na verdade, como você pode ver aqui, devemos usar menos 11 porque não são números em que o país subtrai strings. E como você pode ver aqui no navegador, não registramos nada no console. Agora vamos registrar nossos livros no console porque, na verdade, quando mudamos nossa matriz, vamos recarregar a página. E como você pode ver, esses são nossos livros. Mas agora, em primeiro lugar, temos Susan Collins. Como você pode ver, ele é classificado porque anteriormente tínhamos aqui rolando, depois Mary Lou e depois John jawline, o que realmente significa que esse código está funcionando. E é assim que você está classificando a matriz de objetos por alguma propriedade. 14. Entrevista Não É O Que Você Acha: Muitas pessoas, especialmente iniciantes, não entendem o propósito da entrevista corretamente. Eles acham que devem ir à entrevista, responder a várias perguntas e conseguir um emprego. E não é assim um alto porque o inteiro é, na verdade uma comunicação entre várias pessoas onde quer que lado quisesse esclarecer algumas perguntas sobre outra pessoa. Por exemplo, se estamos falando de entrevistador, ele está interessado em seu conhecimento e obviamente, como você vai se encaixar em sua equipe. Não se trata apenas de responder a perguntas. É mais como ping-pong. Você está fazendo uma pergunta e entrevistador fazendo as perguntas. Não deve ser como apenas entrevistador fazendo as perguntas e use simplesmente responder porque neste caso, primeiro lugar, você pode obter respostas sobre suas perguntas. E em segundo lugar, você não está mostrando que está interessado nesta empresa ou nessa posição específica. Quando você está falando com o cara da tecnologia e o especial com cada um, você deve mostrar que está interessado. Você deve fazer algumas perguntas sobre a empresa, sobre a equipe. Quantos dias úteis você tem? Tem horas extras aqui, frequência as pessoas estão vivendo a empresa, quanto tempo as pessoas normalmente trabalham na empresa e assim por diante. Porque antes de tudo, você quer saber quais são as condições de trabalho nesta empresa e não apenas obter alguma empresa com más condições de trabalho. E, obviamente, posso entender que, se for a sua primeira loja, você quer ir a qualquer lugar, você simplesmente quer começar a trabalhar e eles entendem isso totalmente. Mas se você não quiser sofrer mais tarde, faz muito sentido fazer essas perguntas. Além disso, você deve gostar de líder de equipe ou entrevistador, e normalmente será seu futuro chefe porque você trabalhará muito com essa pessoa e isso vai o mesmo com a equipe. É uma boa ideia conhecer toda a equipe, pelo menos para verificar qual é o clima dentro do vapor? As pessoas são amigáveis umas com as outras? Eles estão felizes com as condições de trabalho e assim por diante? E o mesmo que posso dizer sobre verificar o escritório. É muito estranho às vezes quando você não tem permissão para ver todo o escritório porque este será um lugar onde você estará trabalhando e você deve estar satisfeito com as condições de trabalho. Eu recomendo que você peça o curto prazo no escritório para que você possa pelo menos ver as condições de trabalho. Você tem luz suficiente lá, quais monitores você tem e assim por diante. 15. Função de intervalo de escrita: Você pode obter um exercício de codificação para implementar o intervalo. O que isso tem um meio? É uma função auxiliar que se parece com isso. Por exemplo, se estamos chamando o intervalo de um a 50, ele gerará para nós uma matriz 123456 e assim por diante até ser deslocada. E isso é realmente muito bom ajudante quando você precisa gerar alguns dados. Por exemplo, você deseja gerar quinto usuários aleatórios. Nesse caso, seu assembler gera esse array e, em seguida, para cada elemento que você está mapeando e novo usuário aleatório. É por isso que esse ajudante existe em quase todas as bibliotecas auxiliares, como por exemplo, um dash ou Lambda. E a diversidade é uma solução de pensamento de resultados aqui usando for-loop. É aqui que você pode escrever essa função assim. Você tem aqui um intervalo de funções, e você tem aqui início e fim, por exemplo, de 150. E então, dentro, devemos escrever um for-loop do ponto inicial até o endpoint. Este é y aqui, deixe-me igualar estrelas. Portanto, não estamos começando de 0, mas do estilo aqui estamos bem em eu menos ou igual, e aqui estamos fazendo eu mais. Agora, dentro desse loop for-loop, devemos empurrar cada índice para o nosso resultado. Isso é y. Vamos criar aqui nosso resultado principal. Este é o nosso array. Agora, dentro, podemos escrever impulso de resultados e estamos empurrando aqui nosso eu. E agora apenas retornamos nosso resultado. É assim que você pode criar uma função de intervalo usando for-loop. Vamos verificar no navegador, estou escrevendo aqui função range uma vírgula 15, e estamos recebendo nossa matriz de um a 50, o que significa que nosso código está completamente bom, mas é super baixo nível e podemos fazê-lo melhor. Nível mais avançado é alavancar nosso array. Podemos escrever na matriz do navegador e, em seguida, nosso fim, por exemplo 15. E como você pode ver, isso retorna primeira matriz vazia onde reservamos 50 elementos e o que podemos logo após essas teclas de ponto. E agora estamos apenas chamando essas chaves e estamos recebendo iterador de matriz. Agora, se tentarmos espalhar esse iterador de matriz dentro do array, como você pode ver, estamos recebendo nossas 50 chaves a partir de 0 a 49. E depois disso, simplesmente precisamos mapear cada elemento e adicionar nosso ponto de partida a ele. Então aqui podemos escrever mapa de pontos, e aqui temos cada elemento e estamos escrevendo elemento mais estatísticas em nosso caso, por exemplo, mais um, e estamos obtendo exatamente o mesmo resultado. Este é um array de um a 50. É por isso que essa variante é um pouco mais avançada. Aqui podemos criar nossa função de alcance e estamos chegando aqui Stat. E agora, por dentro, queremos retornar essa lógica. E como você pode ver, esta é uma matriz onde estamos fornecendo e estamos fazendo chaves e estamos espalhados neste rater de matriz dentro de nossa nova matriz. E estamos mapeando cada elemento. E onde eu não ouvi nosso ponto de partida, vamos recarregar a página e verificar se ela está funcionando. Então estou passando dentro da função laranja 150 e estamos recebendo uma boa matriz de um a 15. E é assim que as pessoas normalmente escrevem essa função dentro das bibliotecas auxiliares. Por exemplo, lambda, embora traço. 16. Função de Shuffle de escrita: Você pode obter uma pergunta na entrevista. Escreva uma função que implemente o Shuffle. O que significa shuffle? Você simplesmente altera as posições dos elementos dentro de uma matriz. E, na verdade, não é tão fácil implementá-lo com o uso, por exemplo, para cada um. Mas aqui podemos alavancar o método aleatório para classificar elementos aleatoriamente. Isso é realmente o que queremos ouvir. Vamos criar nossa função de itens aleatórios. A ideia principal é que aqui estamos recebendo nossa variedade de itens. E isso pode ser o que for. Pode ser, apenas um número, pode ser um objeto ou talvez até mesmo uma matriz de matrizes. Deve funcionar em qualquer caso, é por isso que o que queremos fazer**** deseja percorrer cada elemento e criar para cada elemento e um objeto com chave e valor. E, na verdade, eles estão lá dentro. Teremos alguma chave aleatória gerada por aleatório. Também teremos o valor deles. Esse é exatamente o valor do nosso elemento. Nesse caso, podemos classificar por esse campo, nossa matriz e, em seguida, apenas remover essa chave aleatória. Vamos fazer isso agora. Estou aqui diretamente para devolver nossos itens. E antes de tudo, estou chamando o mapa. E aqui temos acesso a todos os elementos. Vamos nomeá-lo item alto. E o que queremos fazer, queremos que cada elemento retorne um objeto com duas propriedades. Vamos nomear esse tipo de propriedade porque, na verdade, isso é apropriado para classificação. Aqui. Acabamos de tentar matemática aleatória. Aqui teremos nossa propriedade aleatória e a próxima será valor. Dentro do valor, estamos armazenando nosso item. Na verdade, quando verificamos nosso código no navegador agora, estamos apenas chamando nossos itens aleatórios, por exemplo, era 12. Como você pode ver de volta, estamos entrando na classificação de objetos e aqui o número aleatório e o valor são o valor do nosso item. E isso é realmente extremamente bom porque aqui dentro do valor, podemos armazenar números, objetos ou matrizes. Na verdade, não importa para nós. Após nosso mapeamento, queremos classificar nossos elementos dentro dessa matriz por essa determinada propriedade. É por isso que aqui podemos escrever tipo e estamos recebendo aqui o item um e o item dois. Aqui. O que queremos fazer, queremos escrever o item uma classificação de ponto menos o item dois pontos tipo e, na verdade, saberemos esse tipo usando propriedade numérica, o que realmente significa que aqui podemos simplesmente usar substrato e não escreva menos 11. Ele irá classificá-lo corretamente. Mas para nós, a água não importa porque só precisamos classificá-la para mudar de posição. E depois de mudarmos de posição, queremos obter nossa especificação de valor. Para isso, devemos experimentá-lo mais um mapa. E aqui temos, vamos citar um porque esse é nosso objeto e queremos ler aqui um valor de ponto. E, na verdade, este é o nosso item que foi armazenado aqui dentro de cada objeto. Vamos verificar isso. Estou recarregando a página aqui, itens embaralhados 12. Estamos chegando a um. Estou chamando de novo aqui para um novamente aqui 12, o que significa que ele está trabalhando com qualquer elemento e ele simplesmente embaralha. E, na verdade, esta é uma maneira incrível de resolver isso porque estamos aproveitando aqui matemática aleatória. E para cada elemento estamos criando esse tipo em valor n. Simplesmente classificamos esses números aleatórios e agora estão embaralhados. Depois disso, estamos recebendo nossos itens de volta. Essa é a maneira mais fácil e correta de embaralhar elementos dentro da matriz. 17. Encontre o número de ocorrências de valor mínimo na lista: Você pode ter uma tarefa como essa. Encontre o número de moedas de valor mínimo na lista. que realmente significa que temos uma matriz de números e, em primeiro lugar , devemos encontrar o valor mínimo dentro e depois calcular quantas vezes temos esse valor. E, na verdade, se você tentar usar aqui o loop FOR, então será realmente tedioso porque você precisa usá-lo duas vezes. Primeiro de tudo, para encontrar o valor mínimo dentro da matriz. E em segundo lugar, para calcular quantas vezes temos esse valor dentro. É aqui que, na verdade, devemos encontrar a função correta dentro do JavaScript para resolver com mais facilidade. E, na verdade , temos essa função dentro do JavaScript e é chamada de mínimo de matemática. Como você pode ver aqui, estamos passando insights vários argumentos e isso retornará para nós o menor. É por isso que podemos usar essa função, mas ela não funciona com matrizes. O que podemos fazer em vez disso, podemos escrever o mínimo de matemática e não podemos passar dentro da matriz, mas podemos usar um operador spread aqui, e ele converterá nosso array dois argumentos. Aqui podemos ter um array 123 e estamos recebendo de volta um. E isso é exatamente o que queríamos. É por isso que, como você pode ver em uma única linha, podemos substituir nosso for-loop, o que será muito mais difícil de escrever. Primeiro de tudo, aqui vamos nomear o valor médio. Aqui queremos chamá-lo em nosso array. E vamos criar aqui nossa matriz, que será 123. E aqui queremos espalhar nossa matriz. Encontramos nosso valor mínimo na matriz. Agora, como podemos descobrir quantas vezes temos esse valor dentro da matriz. E, na verdade, a variante mais fácil aqui é usando filtro. Se filtrarmos nossa matriz por este item mínimo, obteremos uma matriz de nossos itens mínimos. E então simplesmente podemos obter um comprimento dessa matriz. Vai parecer algo assim. Podemos chegar aqui nosso array mínimo. E o que queremos fazer é filtro de matriz. E aqui temos acesso a cada elemento e apenas comparamos se nosso elemento for igual ao nosso valor mínimo. Neste caso, dentro de mim, uma matriz, não, temos apenas nossos valores mínimos. Agora podemos escrever aqui apenas o comprimento do ponto do array min do log do console , e ele retornará para nós exatamente quantas ocorrências desse valor mínimo temos dentro da matriz. Vamos verificar esse tempo recarregando a página por obtenção de uma. Se adicionarmos aqui 11 duas vezes, então aqui temos três deles. E como você pode ver, nosso código está funcionando e as linhas de emoção não foi resolvido nosso problema. É por isso que eu recomendo que você sempre tente encontrar a ferramenta certa para o salto certo. 18. - Este: Neste vídeo, analisaremos todas as questões relacionadas a isso e ao contexto dentro do JavaScript. Você pode adivinhar alguma pergunta como esta. O que será bloqueado aqui? A primeira tarefa que você está recebendo, você tem uma função com palavra-chave function. Isso é importante. Agora, dentro, estamos apenas escrevendo o log do console, e agora temos dois pontos para obter item. Então, a questão é o que veremos dentro do nosso registro do console? E, na verdade, no navegador, você pode ver que estamos vendo janela e você pode pensar, ok, dentro de funções, isso sempre é referenciado na janela, mas isso não está correto. Em vez disso, funções, isso está fazendo referência ao objeto global. Pode ser janela, pode não ser defendida, pode ser outra coisa. Tudo depende do contexto. Mas se você definir uma palavra-chave de função diretamente no código JavaScript sem nenhum aninhamento, ela será janela. Agora você está recebendo a pergunta número dois. O que será bloqueado neste caso? Como você pode ver aqui, temos um item de objeto com título e método getItems dentro do método get item, console de trabalho faça login aqui estamos chamando item ponto get item. No caso de objetos, quando temos métodos dentro de objetos, estamos sempre referenciando esse objeto. Isso significa que quando estamos recarregando a página, estamos recebendo isso e este é um objeto com título e obter item. Nesse caso, podemos usar todas as propriedades dentro do nosso objeto porque elas estão disponíveis para nós dentro disso, quando estamos falando de objetos, isso sempre faz referência ao nosso objeto. Aqui está nossa tarefa número três, o que será registrado neste caso? Como você pode ver aqui, não temos um objeto, mas uma classe. E também temos dentro do título e do método getItems, e também teremos isso dentro. Agora estamos criando a instância de nossa classe e chamamos um método getItems de nossa instância. Isso é importante lembrar que métodos internos em nossa classe, quando temos uma instância, temos uma referência à nossa instância, como você pode ver no navegador aqui temos isso e podemos veja esta palavra item. Isso realmente significa que esse objeto é uma instância da nossa classe de itens. E por dentro temos nossa bola título. Podemos usar todas as propriedades dessa instância dentro disso. Mas agora estamos recebendo uma pergunta sobre o que acontecerá se escolhermos uma função dentro do nosso método? Então, na verdade, o que estamos escrevendo aqui é função, por exemplo, alguma função. E dentro estamos bem neste log do console. E depois disso estamos apenas chamando nossa função de soma, que significa que definimos a função com palavra-chave function dentro do nosso método e estamos chamando-a aqui diretamente. A questão é o que será o log do console dentro disso? Como você pode ver no navegador, isso é indefinido porque, como eu disse, em vez disso funciona, não estamos referenciando a janela, mas estamos referenciando objeto global. E, na verdade, a palavra-chave window sempre está fazendo referência a objeto global. Portanto, neste caso, nunca fará referência à nossa instância. E isso é importante lembrar, o que significa que se você tiver uma função dentro da sua classe, esse interior não estará correto. Ele não fará referência à nossa instância da classe e não podemos usar propriedades dela. E exatamente o mesmo problema que você terá não apenas com a definição da função assim, mas se você estiver escrevendo, por exemplo, um mapa para matriz dentro do seu item get, e aqui você tem uma função para cada item. Agora, se escrevermos o log do console dentro, ele também não estará correto. Como você pode ver no navegador, estou recarregando a página. Estamos ficando indefinidos em três vezes porque aqui estamos usando palavra-chave function e, em seguida, definir função que ela está referenciando indefinida. Ambas as variantes são problemáticas. E agora a questão é como podemos corrigi-lo e obter a referência às nossas teorias. E temos duas soluções para isso. Em primeiro lugar, a solução que é mais antiga, e também é usada quando estamos embutidos em JavaScript toda a versão. Para isso, podemos simplesmente definir antes disso, por exemplo, com um sublinhado e estamos atribuindo referência auditiva à nossa lista. Isso estará correto porque estamos dentro do nosso método. Agora podemos considerar aqui não isso porque aqui as referências fortes, mas isso foi sublinhado. Aqui temos outra referência. Agora vamos recarregar a página. Como você pode ver, temos uma referência de caracteres para nossa instância de como item. Essa é geralmente uma abordagem mais antiga e é usada na etapa de compilação do JavaScript que a melhor abordagem será usar uma função de seta aqui em vez da palavra-chave function. Então, podemos simplesmente usar aqui a função de seta do magma Script seis. E agora, quando fizermos login no console dentro disso, ele terá a referência correta. Como você pode ver, o resultado é exatamente o mesmo Porque função de seta está obtendo o contexto do nosso pai. O que realmente significa daqui que estamos recebendo contexto que temos dentro do item de guitarra. Aqui temos uma referência à nossa instância. É por isso que eu recomendo que você sempre use funções de seta e não palavras-chave de função e, em seguida, você não terá problemas com o contexto. Então, para resumir essa palavra-chave de função interna, você sempre tem uma referência a um objeto global. Dentro de objetos, você tem uma referência ao objeto em si. Dentro das classes, você tem uma referência a uma instância da classe e função interna, dentro, por exemplo, método ou diretamente dentro da classe, ela será referenciada a indefinida. É. 19. Cursos: Uma das perguntas mais populares na entrevista é, claro, as aulas. Você pode ter uma pergunta como essa. Projete uma classe para funcionários que pegue um DNA chamado construção de objetos de urina. E aqui está uma propriedade celular. Como você pode ver, não estamos recebendo requisitos super rigorosos aqui e temos alguma flexibilidade para implementá-lo. É por isso que recomendo que você pense sobre isso e implementado da melhor maneira possível. Primeiro de tudo aqui, mas queria criar uma classe e vamos nomeá-la de funcionário. E agora, como cabeça, precisamos ter um construtor com o nome DNS dentro. Isso é y. Vamos criar um construtor e estamos recebendo nosso AD e nome. E depois disso, vamos atribuí-los à Sadie. Aqui está nosso AD e esse nome é igual ao nome. Então, estamos recebendo essas duas propriedades. Mas você pode fazer melhor porque você deve mostrar que você é um bom desenvolvedor. É por isso que é muito bom verificar se passamos dentro dessas duas propriedades. Então, podemos simplesmente adicionar, ok, se não passarmos o AD ou não passarmos o nome, então queremos lançar um erro. É por isso que eu queria jogar aqui na Nova Era. E aqui dentro podemos escrever, por exemplo, nosso ID e nome de funcionário são obrigatórios. Porque, na verdade, isso é o que está dizendo na tarefa e é bom cobrir esse recurso. Além disso, como você pode ver, temos uma linha e ela tem uma propriedade salarial, o que realmente significa que podemos definir o salário. Não é como se estivéssemos conseguindo isso no construtor. Precisamos de funções setter e getter para nosso salário. Primeiro de tudo, podemos definir esse salário definido e será uma função, nossa configuração para o salário, e estamos passando dentro do nosso salário e apenas o armazenamos dentro disso. Portanto, esse salário de pontos é igual ao nosso salário. Isso não é tudo porque também queremos obter seu programa se o salário estiver disponível dentro da nossa classe. Mas realmente queremos construir essa classe de maneira avançada, o que realmente significa cupom para ter alguma API pública e alguns métodos para obter nossas propriedades. É assim que eu recomendo que você crie, ganhe salário e não precisamos de nada aqui, e queremos retornar aqui esse salário de pontos. E também faz sentido criar dois getters para nosso ID e nome. Aqui podemos criar o método GetId e dentro, estamos retornando nossa ID de ponto. E também podemos criar aqui o método getName, e ele retornará nosso nome de ponto. Então, como você pode ver com um pensamento bastante sobre nossa classe, e ela é implementada da melhor forma possível. Agora aqui podemos tentar usá-lo. Então, aqui estamos criando nosso funcionário com novo funcionário e estamos passando ID e o nome do site porque eles são obrigatórios. E, na verdade, podemos verificá-lo, podemos recarregar a página e estamos recebendo ID do funcionário e o nome são obrigatórios. E isso é bom verificar. Aqui está nosso nome 81, por exemplo, cheque. E agora nosso funcionário não lançará um erro. O que podemos fazer agora podemos escrever salário conjunto de funcionários e estamos passando, por exemplo, 1000 dentro. E agora podemos verificá-lo. Então, vou recarregar a página e aqui está nosso funcionário com um nome e salário DNS, mas também teremos um getters, por exemplo, salário retornará ao nosso salário e getName retornará o nome. O que realmente significa que implementamos nossa classe da melhor forma possível. Mas agora você está recebendo uma segunda tarefa. Projetar uma classe para gerente, que é funcionário e pode ter propriedade de departamento, o que realmente significa que aqui, seu entrevistador quer ver a extensão da nossa classe porque podemos criar uma nova classe com base em nossa classe de funcionários. Este é y aqui na parte inferior, podemos criar uma nova classe Manager. Aqui queremos usar extensões para aproveitar a funcionalidade de nossa classe de funcionários. E, na verdade, isso é quase t dt. Isso levará tudo da nossa classe de funcionários, mas também precisamos criar um departamento. É por isso que só precisamos de um setter e getter, assim como fizemos anteriormente. Vamos criar aqui conjunto departamento e aqui dentro estamos passando departamento ou apenas nome. E aqui estamos salvando nosso nome dentro também precisará obter, então obtenha o Departamento. E não precisamos de nenhum argumento aqui e queremos retornar nosso departamento de pontos de lista. E, na verdade, também é super importante ter bons nomes em todos os lugares. Como você pode ver, não estou nomeando coisas como set ou apenas em pleno terror. Normalmente, tento tornar esses nomes o mais prontos para a produção possível. Estamos usando aqui, por exemplo, departamento de conjunto, departamentos para que fique claro do que se trata. E isso realmente mostra na entrevista que você é um bom desenvolvedor e pode escrever código de alta qualidade. Aqui temos nosso departamento de conjuntos e temos o Departamento. Agora vamos criar nosso chip gerenciado. Então, apenas criamos um novo gerente e devemos passar para dentro como sempre, ID e nome, por exemplo, John. E agora aqui podemos verificar nosso gerente. Podemos fazer um departamento definido e estamos passando por ele, por exemplo, o desenvolvimento. Agora podemos verificar nosso gerente. Então não dissemos departamento e há uma função de departamento GET que retornará para nós o departamento. É assim que normalmente você responderá a perguntas sobre aulas ou extensão das aulas. 20. Protótipos: No vídeo anterior, falamos sobre as aulas e como estendê-las. Mas a próxima questão do revisor de mudanças pode ser aulas ocasionais. Mas temos aulas realmente em JavaScript? Temos outra coisa porque não temos nenhuma classe em JavaScript e elas são criadas como um gatilho para protótipos. É por isso que agora devemos projetar exatamente as mesmas classes apenas usando protótipos JavaScript sem o uso de classes. E, na verdade, você precisa fazer isso pelo menos uma vez. E então, você sabe, quais são os problemas aqui? Primeiro de tudo, temos nosso funcionário da classe e, em segundo lugar, gerenciamos o chip, e agora queremos refletir isso para protótipos. Primeiro de tudo, devemos mover todos esses métodos fora porque, na verdade, podemos experimentá-los dentro da função. E, na verdade, o que é um protótipo? Esta é uma função. Não usamos a palavra-chave class e usarei y aqui porque estamos falando de protótipos. Portanto, esta é a versão mais antiga do JavaScript. Então aqui eu tenho um funcionário var, e esta é apenas uma função normal típica com palavra-chave de função aqui, estamos recebendo um nome DNS. E, na verdade, este também é nosso construtor. Não precisamos de construtor aqui. Verificamos diretamente, ok, se tivermos ID e nome, então estamos lançando um erro. Mas se não, estamos sentados aqui este AD e esse nome, o que realmente significa que esta é nossa classe típica quando estamos fazendo isso com protótipo. Agora precisamos ajustar todas as nossas funções. Como você pode ver aqui, eu tenho essas funções e agora, em vez de apenas definir o salário como um método, devemos experimentá-lo dentro de um protótipo. Estamos dizendo protótipo de ponto de empregado, salário conjunto de pontos. E isso será uma função. Aqui, simplesmente dizemos que é igual a palavra de função, e aqui está nossa função. E precisamos fazer exatamente o mesmo em todos os métodos. Portanto, protótipo de ponto de empregado GetId é igual, e aqui está a nossa função e a mesma com getName e também com bom salário. Aqui está o protótipo, getName é igual a função. palavra-chave aqui recebe salário também o mesmo protótipo de funcionário, obter salário igual a função. E agora refatoramos com sucesso nossa classe para protótipo. Não foi tão difícil porque não nos estendemos. Por enquanto, quero comentar o gerente, então não estamos recebendo nenhum erro. Agora vamos verificar e navegar por ele. Estou recarregando a página e agora temos aqui nosso funcionário, como você pode ver, o código está exatamente o mesmo. Esta é a instância do funcionário. Aqui temos, por exemplo, o método GetID. Estamos recebendo um. Aqui, temos salários para que possamos ganhar e obter salário. E tudo está funcionando, o que significa que é assim que você afeta sua classe. Dois protótipos. E agora temos um gerente e estendemos, e será mais difícil. Então aqui temos um gerente, dissemos departamento e pegamos o Departamento. E sim, também deve ser uma função. Então, aqui podemos escrever var. Aqui temos nosso gerente e sabemos que isso é uma função. Também não teremos dito departamento e levaremos o Departamento para dentro. Nós os escreveremos depois. Mas aqui também, o problema, nosso gerente estende nosso funcionário, mas estamos entrando nos mesmos parâmetros e, na verdade, não queremos escrever aqui ID e nome, mas podemos tentar aqui, params. E nós só queríamos lançar todos os campos que estamos recebendo e usando aqui nosso funcionário. E para isso podemos escrever código assim. Podemos escrevê-los jogar aplicar. Aqui dentro estamos passando esses argumentos de coma. E o que isso essencialmente faz, ele usa argumentos dessa função aqui, isso. E como você pode ver aqui, também escrevi que programas não os usavam por enquanto. Mas se você conseguir uma tarefa para estender o gerenciador com algum campo, você pode escrever aqui estes, por exemplo, imagem é igual a imagem de ponto de params. E neste caso, você também deve passar seu gerente e uma imagem. Isso é totalmente possível, mas não precisamos disso para nossa tarefa. É por isso que simplesmente usamos aqui empregado aplicar esses argumentos e o que ele faz, literalmente faz parte do nosso empregador. Como você pode ver aqui, temos esse ID e nome, e na verdade estamos chamando essa função, mas estamos dando a ela outro contexto onde dado dentro do contexto do nosso gerente e argumentos disso função. Mas aqui está uma enorme diferença que eu quero mostrar a vocês, na verdade, quando estamos pulando para o navegador. E aqui no protótipo do gerenciador, você pode ver aqui em uma função de construtor. Mas aqui se eu escrever protótipo de funcionário, você pode ver aqui todas as funções que tínhamos anteriormente aqui no topo, porque na verdade esta única linha está apenas chamando o construtor do funcionário . Não tem nada a ver com esse protótipo, o que realmente significa que essas funções IN, disse que protótipo de funcionário e gerente não os obtém. E isso é super importante porque estamos estendendo essa aula. Isso significa que queremos tê-los diretamente dentro do nosso protótipo e queremos copiá-los. Como podemos fazer isso. Podemos escrever aqui protótipo de ponto de gerente igual, e aqui queremos usar a criação de objetos porque queremos clonar nosso protótipo de funcionário. E por dentro estamos passando nosso protótipo de ponto de empregado. Nesse caso, estamos clonando todas essas funções de nosso funcionário para nosso protótipo de gerente. Então, vamos verificar o que estamos recebendo aqui. Estou recarregando a página e aqui , protótipo de ponto do gerente. E, como você pode ver, agora é uma cópia do nosso funcionário. E podemos escrever aqui protótipo de ponto gerenciador, ponto GetId, por exemplo. E estamos recebendo esse método. Obviamente, é indefinido porque esta não é uma instância, mas a classe, mas temos acesso a esse método dentro. Mas aqui também está um grande problema quando estamos escrevendo aqui o construtor de pontos protótipo de ponto do gerenciador. Estamos recebendo o construtor do nosso funcionário e não o gerenciamos e isso é errado. É por isso que o que devemos escrever aqui também, construtor de pontos protótipo de ponto gerenciador. E queremos atribuir aqui nossa função de gerente. Neste caso, estará 100% correto. E como você pode ver onde eu chego em referência ao nosso gerente, essas são duas linhas que são super importantes quando você está fazendo extensão com o protótipo. Porque antes de tudo, você quer obter todos os métodos de nosso funcionário. E em segundo lugar, você precisa substituir, construir uma volta para o nosso gerente. E agora podemos usar o departamento SAT e obter o Departamento. Isso é exatamente o mesmo que era anteriormente. É protótipo de ponto de gerente. E aqui estamos atribuindo nosso departamento de conjunto e aqui gerente dot prototype.js departamento. Aqui, é claro, precisamos escrever a palavra-chave function exatamente o mesmo deve estar aqui no topo. Nesse caso, implementamos o gerente com sucesso, assim como foi feito aulas anteriores do Lucas. Vamos recarregar nossa página e verificar. Como você pode ver, estamos recebendo nosso gerente com ID e nome, mas também teremos um conjunto de funções Departamento. Podemos escrever, por exemplo, aqui desenvolvimento. E agora não dissemos Gerente, também desenvolvimento. E temos uma boa função de departamento GET. E, obviamente, podemos usar a mesma função. Por exemplo, obtenha o ID do nosso pai e ele também está funcionando. É isso que você normalmente usará protótipos e implementará classes com protótipos nativos dentro do JavaScript. 21. Eu Falhei A Entrevista. O que é o próximo?: Pode ser que ele falhado na sua entrevista e talvez tenha sido sua primeira entrevista e você realmente queria esse emprego e agora você está realmente deprimido. O que você deve fazer? Primeiro de tudo, você precisa entender que isso é completamente normal e você falhará em muitas entrevistas durante sua vida, e eu falhei muitas delas, especialmente no começo. É por isso que o que você precisa fazer, você quer, primeiro lugar, continuar. Você não deve parar logo após sua primeira entrevista e mesmo após sua quinta entrevista, você não deve parar porque, mais cedo ou mais tarde, encontrará sua primeira empresa e conseguirá seu primeiro emprego. Primeiro de tudo, você não deve estar deprimido. E em segundo lugar, você deve usar as entrevistas como uma fonte adicional de conhecimento porque na verdade este é um bom lugar para entender quais perguntas foram feitas na entrevista. E também você pode entender o conhecimento que você está gostando. É aqui que há dois pontos principais que você deve fazer. Depois de cada entrevista. Logo após a entrevista, você deve sentar e escrever todas as perguntas que lhe foram feitas e você não respondeu corretamente, não respondeu A. Depois disso, você deve pesquisar todas essas perguntas no Google e aprender. Obviamente, você não pode aprender tudo em um dia, mas você pode dividir esse conhecimento e aprender algo novo para você. Isso é realmente importante para fazê-lo diretamente depois, porque no outro caso você esquecerá isso. O próximo ponto importante é pedir a resposta da empresa. E, na verdade, pode ser que você não tenha recebido uma carta ou um telefonema após sua entrevista da empresa. E isso pode acontecer em muitas empresas. É aqui que você deve escrever seu gráfico com quem você falou pelo menos duas vezes, pode estar no dia ou dois após a entrevista e, em seguida, talvez em três dias depois, porque você deve obter alguma resposta. E se eles disserem que você não passou na entrevista, você deve pedir a revisão técnica de sua entrevista. Você pode simplesmente perguntar, ok, isso é PT, mas eles realmente querem algum feedback. De que conhecimento estou gostando? Isso é completamente normal e, na verdade, eles não fornecem nenhum feedback técnico com muita frequência, mas às vezes eles podem fazê-lo. E isso também é extremamente útil para você porque você verá seu conhecimento da perspectiva de outra pessoa. Seu entrevistador pode escrever algo que é extremamente importante para você aprender. É por isso que não se desencoraja se você não passou na entrevista, isso é completamente normal e você deve continuar. 22. Módulos: Você também pode ter uma pergunta sobre o sistema modular. Eles querem dizer com este EPMA Script seis módulos ou módulos js comuns. Por exemplo, sua pergunta pode ser criada um módulo de cripta seis atmosfera com funções getName, sobrenome e especialista padrão obter nome completo. Para isso, você deve saber que Harmodius está trabalhando em JavaScript só porque é o componente principal do JavaScript e estamos usando módulos em todos os lugares. Para usar as entradas, precisamos criar mais um arquivo. Como você pode ver aqui, eu tenho JS principal. Este é o nosso principal arquivo e índice HTML. Então, digamos que estamos criando um novo módulo e queremos nomeá-lo. Por exemplo, por exemplo, os scripts devem ponto js. Dentro, escreveremos alguns módulos Atmos Script seis. Primeiro de tudo, aqui queremos criar um método getName, e estamos escrevendo com export const. Aqui está getName, e aqui estamos recebendo como um nome de argumento e estamos retornando nosso nome. Como você pode ver aqui, usamos o especialista em construção const, e essa é exatamente uma das funções que devemos criar. E como você pode ver, pegue o nome e receba o nome dela. Só não nomeei funções. É por isso que estamos escrevendo e somos especialistas neles a partir deste módulo foi export const. Vou copiar esta linha e colar aqui e devemos nomeá-la. Obtenha um determinado nome. Aqui estamos recebendo o nome certo e estamos apenas devolvendo nosso sobrenome. A última coisa que somos o grau de máscara é especialista padrão, nome esquecido. E se você não souber como criar um especialista padrão, isso é padrão de exportação. E aqui não precisamos fornecer um nome, o que significa que aqui temos diretamente uma função no nosso caso, pode ser que possamos criá-la assim, nome e sobrenome e apenas concatenamos. E aqui dentro temos uma cadeia de caracteres enigmática Atmos e apenas chamamos aqui nossas funções. Primeiro de tudo, getName e estamos passando o nome interno. Depois disso, temos um espaço aqui, temos uma segunda função, nome dela onde quer que o sobrenome de bisão dentro. Agora, nosso arquivo script seis cadeiras é um módulo e está completamente isolado. E no que somos especialistas, aqui está disponível lá fora, então vamos usá-lo agora. Temos aqui três funções, biomassa pulando nossas cadeiras principais aqui, devemos importá-las e estamos inserindo-as assim, importante. Então temos colchetes e dentro do que estamos inserindo, é GetName, Coleman recebe o nome dela. E como você pode ver, o editor do meu y mais velho a estrada daqui no meu roteiro seis. E como você pode vê-lo como é claro preto porque não estamos usando essas funções. É aqui que eu quero escrever getName e estamos passando. Então, por exemplo, JAK, então temos aqui o sobrenome, e aqui será pardal. É assim que estamos inserindo e usando especialistas em nome. Estamos usando aqui a importação de palavras, depois colchetes e dentro de funções nomeadas. No nosso caso, GetName, recebe o nome dela, e este é o caminho para nossos scripts ECMO de arquivo dot js. Agora, a questão é como podemos obter nosso especialista padrão e para este fim de semana, certo, logo após a entrada, obter o nome completo e depois vírgula. Nesse caso, obteremos nosso especialista padrão primeiro e, em seguida, nomeamos especialistas apenas com colchetes depois. Agora, aqui dentro do nosso log do console, podemos usar get FullName e estamos passando no site duas strings. Primeiro de tudo Jack e segundo menos paralelo. E agora podemos usar essas funções assim como elas foram definidas neste arquivo de posição. Agora, a questão é como podemos usar o módulo EKG prescript six dentro do nosso HTML. Para isso, devemos pular dentro do nosso HTML. Aqui temos roteiro com a fonte Manchester. Isso é totalmente bom, mas devemos escrever aqui tipo módulo e em seguida, ele irá importá-lo como o módulo Atmos Script seis. Agora vamos tentar recarregar nossa página. Como você pode ver, na verdade funcionou mas estamos recebendo um erro restrito e estamos recebendo um erro de curso porque esse país HTML índice realmente alto Xadrez principal porque você não pode fazer solicitações de origem cruzada do arquivo. E isso é realmente um problema porque aqui estou usando esse arquivo de origem como o arquivo HTML de índice normal. Se você estiver usando alguma estrutura front-end como o reator angular, você não terá esse problema porque você tem sistemas de módulo, eles estão fora da caixa. Mas exatamente para esse caso específico em que eu joguei um HTML de índice, devo servir esse HTML de índice como um servidor web. E para isso, há um pacote que é chamado de servir. Você pode instalá-lo era conhecido xadrez e, como você pode ver agora, ele está disponível para mim apenas este HTML de índice no localhost 3 mil. Agora, como você pode ver, não temos um erro em relação ao curso, mas temos um problema para carregar nosso arquivo crypt six atmosfera, porque na verdade aqui devemos colocar dot js para carregar este arquivo. Agora não estamos recebendo a Sarah. E como você pode vê-lo console, essas funções antigas estão disponíveis rapidamente. Aqui podemos ver Jack Sparrow e Jack Sparrow. E isso significa que inserimos com sucesso essas três funções foi nomeada como especialista e exportação padrão do nosso módulo usando o grupo Atmos seis módulos. Agora temos uma próxima pergunta. Devemos criar exatamente as mesmas coisas com o módulo js comum. E se você não sabe, o modelo GIS comum é normalmente usado dentro de cadeiras conhecidas. É por isso que agora eu queria escrever nosso arquivo ATMOS Script six JS com o uso de cadeiras comuns. É por isso que eu vou copiar a tabulação de pasta e criar aqui um novo arquivo, basta nomear ponto js comum. E vamos reescrever tudo aqui. No módulo js comum, você pode fazer o mesmo. Você não pode ter especialistas em exportação e nome padrão simultaneamente . E isso ocorre porque, em vez de exportar const, onde quer que eu coloque aqui, module.exporta ponto getName, e estamos atribuindo uma função aqui. O ponto principal é se Book quiser escrever um especialista padrão onde ICT e em vez de exportar o módulo padrão.exportações são iguais. E aqui está nossa função, o que significa que aqui temos um modelo padrão para nossa função. Então, o que podemos fazer neste caso é apenas deixar este getName e obter o sobrenome como funções privadas porque controlamos o especialista simultaneamente sem um especialista padrão. E, como você pode ver aqui, temos especialistas em Módulos apenas para ter nosso especialista padrão. Agora podemos pular diretamente em Manchester e aqui importar nossa função padrão. Mas, para fazer isso, devemos usar a palavra-chave require. É por isso que aqui eu quero escrever const e estamos recebendo grande obter nome completo. E aqui é necessário igual, e aqui está nosso caminho JS comum ou apenas comum. Posso pular dentro do console e do xadrez principal do nó direito. E, obviamente, estamos recebendo uma mensagem que o GetName não está definido porque aqui estamos tentando consolar o log getName e obter o sobrenome. Agora aqui acabei de receber FullName. Vamos tentar novamente. Como você pode ver, não temos nenhum erro e estamos recebendo cheques pais. Se realmente quisermos obter todas as três funções, devemos pular aqui e usar o módulo em qualquer lugar . Exports dot e aqui será o nosso GetName. Agora, aqui estará mais em seus especialistas em pontos, o ponto recebe sobrenome. E aqui queremos mais especialistas em pontos de petróleo e aqui será um bom nome completo. Nesse caso, funcionará e obteremos nossas três funções. Agora temos três especialistas. Podemos saltar de volta em Manchester. E aqui, em vez de obter o nome completo, podemos apenas destruir e obter três funções. Getname, recebe o nome dela, e aqui obter FullName. E agora podemos descomentar esses dois logs do console. Vamos verificar isso. Estou pulando para o console e executo o Node Manager e ainda temos um getName ágil não está definido. Mas, na verdade, o problema aqui é que dentro dos js comuns, não temos uma função getName e obtemos sobrenome porque na verdade os temos em especialistas em Módulo. É por isso que esse código não funcionará. Berlim precisa escrever, em primeiro lugar, constituir nome e depois deste módulo especialistas pontuarem getName e aqui é igual a getName. Nesse caso, essa função também pode funcionar. Devemos fazer exatamente o mesmo pelo nosso sobrenome get. Aqui será const obter sobrenome e vamos movê-lo para o topo. E agora aqui estão nossos especialistas GetName, e agora aqui temos o sobrenome e estamos atribuindo aqui nossa função recebe Ernie. Nesse caso, todas as funções estão disponíveis para nós dentro deste arquivo e também fora por meio de especialistas em módulos. Vamos verificar isso. Estou executando o xadrez principal do nó e não temos nenhum erro. Então, como você pode ver, temos duas variantes diferentes no meu roteiro, seis e baú comum. E se você pegou todas essas perguntas, então a próxima pergunta pode ser Qual é a diferença entre os seis módulos Atmos Script e os módulos js comuns. E, na verdade, o SAL faz esse conjunto. módulos de xadrez comuns são normalmente usados dentro do baú conhecido. Este é o sistema modular padrão para caixas conhecidas ECMO Script seis módulos que temos no navegador. Este é o JavaScript ECM Script seis. E, na verdade, você pode usar seis módulos ECMO Script dentro de cadeiras de nós. E isso é apenas uma necessidade de açúcar ao redor. É por isso que se você assumir um postscript seis módulos dentro de não-xadrez, você sabe que dentro você ainda precisa porque é obrigatório para o NodeJS. Scripts de demonstração seis módulos são antes de tudo mais recentes do que os módulos js comuns e, em segundo lugar, eles são estáticos, o que significa que você pode empacotar isso exigir dentro se condição, por exemplo, dentro do loop for . Mas você realmente não pode fazer isso com a entrada porque a entrada deve estar sempre no topo. E se a entrada não estiver na parte superior, ela irá borbulhar automaticamente para o topo quando o JavaScript a analisar. E isso é realmente muito melhor, antes de tudo por segurança. E, em segundo lugar, implementar diferentes ferramentas integradas na parte superior do Atmos Script seis módulos. 23. Implementar a função de Debounce: Uma das perguntas que estão aqui de tempos em tempos é escrever a função dos ossos. E se você não sabe quais são os ossos, isso significa que a função será chamada somente após determinado período de tempo, o que realmente significa que cada chamada dessa função será atrasada. Como podemos implementar essa função? Primeiro de tudo, devemos criar uma função que queremos para os ossos. Aqui eu quero criar uma função, por exemplo, salvar a entrada. E aqui somos fornecidos dentro do nosso nome. Então, a ideia é que, por dentro simplesmente registraremos alguma coisa no console. E podemos ver que essa função está funcionando. Aqui está salvar a entrada e o nome. E estamos usando a função de títulos. Por exemplo, quando queremos enviar algumas informações para o back-end, usuário está digitando algo no campo de entrada. E queremos esperar, por exemplo, 200 milissegundos ou dois segundos após a pessoa parar de digitar algo na entrada. Nesse caso, os alunos enviaram para o back-end apenas uma única solicitação para verificar a validação e não muitas solicitações após cada letra. É exatamente por isso que precisávamos dos ossos. Então, temos nossa função de entrada de salvamento e agora queremos chamá-la de ossos. Por exemplo, vamos nomear a mudança do processo. Aqui queremos usar uma função DBMS que criaremos em um segundo dentro, devemos fornecer antes de tudo, nossa função, isso é salvar entrada e, em segundo lugar, atrasar, por exemplo, dois segundos. Depois disso, podemos simplesmente chamar alteração do processo com uma string. E, na verdade, não importa quantas vezes chamaremos essa função de ideia principal, ela será chamada naquelas. Depois de dois segundos. Aqui eu quero registrar nova função, os ossos. E aqui estamos recebendo como um argumento. Primeiro de tudo, alguma função, vamos nomear funk. E em segundo lugar nosso tempo limite. E é uma boa abordagem para definir o tempo limite por padrão, por exemplo, para 300 milissegundos. Isso significa que não é obrigatório fornecer. E agora dentro da nossa função de descolagem deve retornar uma função. Porque, como você pode ver aqui, estamos chamando a função bones e a mudança de processo também é uma função onde dentro podemos fornecer alguns dados para nossa função de entrada salgada, que na verdade significa que aqui devemos retornar e você funciona. Aqui queremos espalhar nossos args. E vamos verificar o que estamos recebendo opostos. Então, aqui eu quero consolar arcos de vírgula de função de login, e podemos ver em que formato estamos recebendo. Estou recarregando a página. Como você pode ver, estamos recebendo quatro vezes porque chamamos essa função quatro vezes em uma função. E aqui temos apenas um único argumento foo. Mas esse spread com args transformou nossos argumentos em uma matriz porque para nós é mais fácil trabalhar com a matriz. A segunda coisa que queremos fazer é criar um temporizador e na verdade, um tempo de grupo deseja armazenar no fechamento aqui no topo. Aqui podemos deixar temporizador sem nenhum valor padrão. E agora dentro da nossa função interna depois do nosso console muito com apenas queria escrever setTimeout. Aqui teremos uma função e, na verdade o segundo parâmetro aqui será nosso tempo limite. Depois de que horas chamaremos esse código dentro. O que queremos fazer aqui é func dot apply. Aqui estarão esses auroques de coma. O que isso tem um meio? Usamos aqui está a função de vínculos e aqui estamos fornecendo nossa contribuição do Salvador. É o nosso func. Aqui está nosso tempo limite. Então, neste momento, essa mudança de processo é essa função interna. E depois de chamarmos essa função, estamos chamando essa parte. Aqui, estamos recebendo nossos argumentos. No nosso caso, isso é um array com foo. Aqui temos nosso log de console e isso gerará setTimeout, o que realmente significa que cada linha aqui quando chamarmos essa função, gerará um setTimeout. Com esse tempo limite, o que estamos fazendo dentro onde chamamos func. Então, estamos chamando essa entrada de salvamento com apply this args, o que realmente significa que queremos chamar essa função após o tempo limite com o contexto correto, com o contexto dessa função, com esses argumentos. Mas aqui temos um problema quando recarregamos a página. Como você pode ver, estamos recebendo quatro vezes em uma função e depois de dois segundos, recebendo a entrada salva cheia quatro vezes. E isso é errado, porque aqui devemos obtê-lo sobre aqueles porque isso está realmente nos ossos. Devemos limpar nosso temporizador toda vez quando fazemos uma chamada para a função, porque neste caso, nosso tempo limite definido anterior deve ser ignorado exatamente para isso que criamos aqui lead time. O que podemos fazer aqui, podemos atribuir setTimeout ao temporizador. E, na verdade, se você não conhece SetTimeout, devolva um número e esse é nosso ID específico que podemos limpar. É por isso que, antes do nosso temporizador, agora podemos escrever um tempo limite claro e, dentro, podemos fornecer nosso temporizador. Se estiver indefinido, não importa, não fará nada. Mas se tivermos um AD, o setTimeout anterior será destruído. Nesse caso, toda vez que chamamos essa função novamente, todos os tempos limite anteriores serão regados e agora criaremos um novo tempo limite definido. E depois desse tempo chamaremos nossa função. Essa é exatamente a ideia dos ossos. Agora vamos recarregar a página. Estamos recebendo nossa função interna quatro vezes, e agora estamos recebendo entrada salva por apenas uma vez após dois segundos. E isso é exatamente o que queríamos quando implementamos nossos débitos. Mais uma vez, a função de ossos nos permite chamar algo apenas uma vez após um tempo específico. Isso é realmente importante quando estamos falando de algo que o usuário pode chamar muitas vezes durante a entrada no formulário, por exemplo. 24. Implementar a função do acelerador: Implementamos com sucesso a função de ossos. Mas você também pode ter uma pergunta sobre como implementar a função do acelerador. E, na verdade, eles são super semelhantes. E é por isso que eu tenho o código da nossa função bones porque realmente precisamos mudar como 1% do código. Então, a ideia da função do acelerador é que ela será executada imediatamente. E só para lembrá-lo, a função bones será executada no tempo limite ou após o nosso tempo limite. Aqui, a função do acelerador executa imediatamente, mas depois disso, a coluna da função é completamente ignorada para nossa equipe, que realmente significa que se o usuário estiver digitando algo, podemos chame nossa função apenas no início e, em seguida, cada dois segundos, por exemplo. E esse é exatamente o objetivo central do acelerador. Para simulá-lo, devemos mudar nosso código um pouco. Aqui temos nossa contribuição do Salvador. Isso é bom. Aqui está a mudança de processo, mas não queremos usar aqui os ossos gostariam de escrevê-lo com acelerador. Os argumentos são exatamente os mesmos. E agora aqui chamamos de mudança de processo no início. Isso é totalmente bom, mas agora eu quero simular que estamos chamando isso com setTimeout. Aqui, estamos certos e setTimeout, e queremos chamar essa mudança de processo de função dentro dela depois de algum tempo, por exemplo, após 1 segundo, então eu copiarei colar este setTimeout e executar depois de 1 segundo, 200 milissegundos. Agora eu copio colá-lo novamente e chamarei essa função novamente após dois segundos e 400 milissegundos, e então removerei dois últimos gráficos foram alterados. Na verdade, como você pode ver aqui, colocamos tempo limite 200 milissegundos, o que realmente significa que essa função deve ser executada imediatamente. Este setTimeout será ignorado. Isso também será ignorado e o download do último tempo limite definido chamará essa função porque isso acontecerá após esse tempo de 200 milissegundos. Agora, primeiro de tudo, vamos mudar o nome dos nossos ossos para acelerador. Estamos recebendo aqui os mesmos argumentos, uma função e nosso tempo limite. Mas agora aqui não precisamos de um ID de temporizador, mas um booleano. E este booleano nos mostrará se podemos executar essa função novamente. É por isso que não o lead time, mas o lead, por exemplo, está aguardando e, por padrão, é falso. Agora aqui também retornamos uma função que não precisamos aqui, tempo limite claro. E, na verdade, SetTimeout está hospedado aqui, mas não precisamos de tempo porque na verdade vamos proibir este setTimeout com uma condição if aqui. Podemos escrever se não estiver esperando, então queremos chamar esse setTimeout. Em outros casos, não chamaremos nada e esse código será ignorado. Além disso, é importante chamarmos essa função diretamente. É por isso que eu quero movê-lo para dentro da nossa condição if e insights setTimeout, simplesmente mudamos nosso peso na propriedade para false back. Então, como você pode ver, essa linha significa que, no início da primeira chamada, chamaremos essa função. Mas depois disso, queremos definir nossa bandeira como verdadeira. Este é o y aqui onde eu não esperava é igual a verdade. Em seguida, temos um tempo limite definido, por exemplo, dois segundos. E depois de dois segundos estamos configurando está esperando para false, o que realmente significa que podemos chamar essa função no após dois segundos e não antes. Então, como você pode ver, o código é 99% o mesmo. A ideia principal é que estamos construindo aqui é peso e bandeira, e nós apenas permitimos acessar essa função uma vez no nosso tempo limite. Agora vamos verificar se está funcionando. Estou recarregando a página, estamos recebendo diretamente poupando put foo pela primeira vez. E então vemos na entrada do Louvain CV f2 segunda vez. E isso é exatamente essa mudança de processo de código e este último modo de tempo definido Com dois segundos e 400 milissegundos. Porque, na verdade, aqui em nossa primeira tentativa, vamos acelerar, está esperando, é falso. Vamos aqui, estamos verificando uma chave, não é verdade. Então estamos chamando diretamente essa função e estamos definindo nossa bandeira como verdadeira. E depois do nosso tempo limite definido e então estamos mudando o peso dele e de volta para falso. E não precisamos aqui nenhum momento RED porque nunca a bordo do nosso SetTimeout. A próxima pergunta que você pode obter. Certo, mas qual é a diferença entre os ossos e o acelerador? E como eu já disse, estamos chamando os ossos depois que os usuários pararam para fazer alguma coisa. Estamos chamando acelerador antes de tudo no início e depois de certo intervalo de tempo. 25. Destaque Todas As Palavras Sobre 8 Chars Com Amarelo: Você também pode obter algumas perguntas sobre como o JavaScript está funcionando com sabedoria. Por exemplo, aqui devemos destacar todas as palavras com mais de oito caracteres nos textos do parágrafo com fundo amarelo. E como você pode ver aqui, eu tenho index.HTML e temos nosso parágrafo, e temos nosso parágrafo de cabeçalho, e temos um monte de texto aqui. Se você quiser experimentar você mesmo, vincularei o código-fonte na caixa de descrição abaixo. Você não deve redigitar esse texto inteiro. É assim que ele está olhando agora, como podemos implementar essa tarefa específica? Primeiro de tudo, devemos encontrar nosso parágrafo. Isso é muito fácil que tenhamos apenas um único parágrafo. Aqui. Podemos dizer que estamos encontrando o parágrafo e aqui está o seletor de consulta de ponto de documento. E aqui este P e isso você pode ver que usei aqui QuerySelector. E isso é super importante se você tentar usar GetElementById ou obter elemento por classe, essa não é a melhor abordagem e detalhes que você não trabalhou com Tom para combinar. É por isso que você sempre deve usar QuerySelector ou QuerySelector. Oh, se você quiser obter uma lista de seus elementos, no nosso caso, obtemos apenas um único elemento. É por isso que simplesmente escrevemos aqui p e estamos recebendo nosso parágrafo. Também poderíamos escrever aqui um cifrão no início, assim como no estilo jQuery. Por exemplo, prefiro fazê-lo facilmente distinguido pelo nome, A diferença entre apenas dois elementos e elementos DOM. Mas, por enquanto, vamos mantê-lo como um parágrafo. Mas queremos fazer agora Poupon para mudar nosso conteúdo para que nosso HTML interno, é por isso que podemos escrever pontos de parágrafo HTML interno igual a. E queremos antes de tudo ler o ponto do parágrafo emHTML. E, como você pode ver, é assim que o conteúdo dentro do InnerHTML está parecendo. Portanto, esta é apenas uma string simples e agora podemos trabalhar com ela como com o fluxo JavaScript normal. O que queremos fazer agora aqui queremos, antes de tudo, dividi-lo com espaço. Nesse caso, estamos recebendo uma série de palavras e agora podemos usar o mapa para trabalhar com cada palavra. Então, na verdade, aqui estamos recebendo palavra e por dentro queremos verificar se nosso mundo é maior que oito símbolos. Assim, podemos simplesmente retornar aqui o comprimento do ponto da palavra maior que oito símbolos. Então aqui queremos escrever operador ternário. E se formos maiores que oito símbolos, então cupom para envolvê-lo em amarelo, o que realmente significa que queremos escrever outro nó DOM dentro. É aqui que eu criarei uma div de string com estilo dentro e dentro do estilo, estamos certos e cor de fundo, por exemplo, amarelo. Aqui devemos fechar nossa div e, na verdade, dv é ruim. Devemos usar aqui span porque este será um elemento interior dentro desse espaço onde exatamente em nosso mundo que estava lá anteriormente. Então, neste caso, estamos retornando e você não sabe. E se não mudarmos o mundo, simplesmente retornamos essa palavra de volta. Como você pode ver neste caso, em primeiro lugar, pegamos nossa string dentro do InnerHTML. Nós o dividimos por palavras com espaço onde mapeamos cada palavra e estamos verificando o comprimento. Nesse caso, estou retornando seu nó DOM ou estou retornando a palavra em si. E depois de terminarmos nosso mapa, devemos juntar tudo de volta. É aqui que estamos nos unindo com o espaço, assim como fizemos anteriormente. Vamos verificar o que estamos recebendo. Estou recarregando a página. E como você pode ver, todas as nossas palavras mais de oito símbolos, serão destacadas com amarelo, o que significa linhas iniciais. Podemos resolver essa tarefa. Você pode obter tarefas diferentes em relação ao DOM. O que você precisa saber é como obter elementos do Dom, como removê-los deles, como atualizá-los e, na verdade, como transformar elementos DOM diretamente em cadeias de caracteres JavaScript, por exemplo. Você pode trabalhar com eles. 26. Adicionar um link: Outra tarefa idiota que você pode obter é adicionar um link volta à origem do texto após a tag de parágrafo. E, na verdade, tenho exatamente o mesmo HTML como perversamente. Mas, no final, devemos fornecer um link para nossa fonte. Como podemos resolver isso? Primeiro de tudo, devemos criar um novo elemento DOM. Agora, no caso de ser um link, forneceremos um gráfico de insights e, em seguida, apenas o anexaremos no final do nosso DOM. Primeiro de tudo, vamos criar um link. Para isso, podemos usar o elemento de criação de ponto de documento e dentro do útero deve fornecer qual elemento DOM queremos criar. No nosso caso, é um após este boop quer dentro vinculado para atribuir nosso gráfico. Então, simplesmente escrevemos link href igual em caso de negação. Eu vou copiá-lo daqui. Será HTTPS para ipsum.com. E também devemos fornecer insights, um texto interno que será um conteúdo do nosso link. É por isso que o texto interno do ponto lync. E aqui estamos atribuindo texto gerado a partir de Lorem Ipsum. Nosso elemento DOM está pronto. Agora nós simplesmente precisamos colocá-lo no final do nosso DOM. Podemos escrever aqui corpo do ponto do documento, ponto anexar filho. E aqui estamos apenas fornecendo nosso novo elemento DOM. Nesse caso, ele aparecerá no final do nosso corpo. Vamos verificar isso. Estou recarregando a página e agora no final temos textos gerados a partir de Lorem Ipsum, e este é um link e está indo na página correta. 27. Dividir cada frase para uma linha separada: Outra tarefa com o evento DOM pode ser assim. Divida cada nova frase uma linha separada no texto do parágrafo. Uma frase pode ser assumida como uma sequência de textos terminados com um período. E, na verdade, temos exatamente o mesmo texto dentro do parágrafo, assim como fizemos anteriormente. Agora, a questão é como podemos implementar essa tarefa? E, na verdade, podemos pensar, ok, temos período, podemos simplesmente dividi-lo por período. Vamos experimentar isso. Primeiro de tudo, quero encontrar aqui nosso parágrafo com seletor de consulta de documentos p, assim como fizemos anteriormente. E agora aqui podemos escrever ponto de parágrafo innerHTML é igual a ponto de parágrafo innerHTML. Queremos dividi-lo com ponto. E vamos verificar o que teremos neste caso, depois de dividi-lo e tivermos uma série de nossos pontos fortes, devemos nos juntar a ele de volta. Mas neste caso queremos colocar aqui antes de tudo ponto porque estamos nos unindo pelo DOD. Mas então precisamos de uma tag de fechamento para nossa tag p e aberta para o nosso novo p. Nesse caso, estamos escrevendo parágrafos para cada linha e junção não é aplicada ao último elemento. É por isso que, no final, queremos escrever mais, e aqui devemos fechar nosso p. Vamos verificar isso. Estou recarregando a página e, na verdade , ela está funcionando, mas apenas parcialmente. Sim, está funcionando para as frases simples, mas não funcionará para as frases em que temos dois ou três pontos. Por exemplo, como você pode ver aqui, temos linhas com um ponto nele. E este é exatamente o problema porque aqui nós o dividimos apenas por um ponto e isso é um total de botão errado, nossa lógica está correta. Podemos inspecionar nossos elementos HTML, como você pode ver, eles são embalados corretamente e, em seguida, estamos fechando nossa lista p Aqui. Está funcionando, mas dividido por um ponto não é nosso caso. Na verdade, aqui estamos chegando a expressões regulares. E isso é algum conhecimento que você deve aprender, pelo menos no nível básico, porque você o usará em muitos casos quando estiver trabalhando, por exemplo, com strings e para tentar verificar expressão regular, eu recomendo que você use um site, reg X.com. É totalmente gratuito. Você pode encontrar outros sites, mas aqui é muito bom ver o que encontraremos. Como você pode ver aqui, você pode escrever uma expressão regular e aqui você pode fornecer o texto e verificar como ele funcionará. Também aqui à direita, você pode definir alguns sinalizadores, por exemplo, multilinha global e assim por diante. Como você pode ver, essa é a expressão regular que queremos escrever. E quando eu estiver pairando sobre os símbolos, ele mostrará o que exatamente estamos fazendo aqui. Este é o começo da expressão regular, e estamos envolvendo a expressão regular sempre com duas barras. Essa barra no início e no final é apenas um início e fim da expressão regular. Agora aqui dentro temos ponto, mas ponto é um símbolo especial dentro da Expressão Regular. É por isso que devemos escapar dele com a barra invertida. Como você pode ver aqui, isso corresponde apenas a um caractere de ponto. Agora aqui temos colchetes. E como você pode ver, tudo dentro colchetes é um conjunto negado, o que realmente significa que isso não deve estar lá. Este símbolo atual é o início do nosso conjunto. E aqui nós pensamos e abrimos a tag. Nesse caso, estamos procurando apenas um único ponto, mas não por vários pontos. Isso é tudo o que queríamos dizer aqui. E como você pode ver aqui em nosso código está funcionando corretamente. E agora temos essas correspondências apenas com um único ponto, como você pode ver aqui, temos três pontos, movimento de botão. O último ponto será verificado porque estamos interessados apenas em ponto quando não tivermos o segundo ponto depois. É por isso que podemos copiar e colar essa expressão regular e colocá-la dentro da nossa divisão. Aqui devo escrever barra no início e no final. E essa é nossa expressão regular. E eu entendo totalmente se você não conseguir 100% o que estou fazendo aqui, porque você deve aprender alguns conceitos básicos de expressões regulares primeiro. Mas eles são extremamente importantes para se você estiver trabalhando com cordas. Agora vamos verificar se esse código está funcionando. Aqui. Estou pulando para a página que estou recarregando, e agora ela está funcionando corretamente. Fizemos nossa divisão. E aqui, por exemplo, três pontos ainda estão lá e esta é a única frase. E quando tivermos um tiro único, simplesmente consideramos a divisão e então movemos esse texto na próxima linha. E, na verdade, o conhecimento de expressões regulares está um pouco fora do JavaScript, mas você ainda o usará muito. Mas também, se você aprender essas expressões regulares, poderá usá-las em todos os idiomas. Porque em todos os idiomas é exatamente o mesmo. 28. Delegação de Eventos: Você também pode obter uma pergunta como esta implementada clique no item o mais rápido possível. E como você pode ver aqui dentro do index.HTML, temos essa marcação. Temos uma lista UL e por dentro só temos elementos li. Normalmente, você pode resolvê-lo de forma diferente. Aqui temos duas soluções típicas, mas uma é muito melhor que outra. Na verdade, o que podemos fazer aqui, podemos encontrar itens em dólar com documento e aqui estamos usando o seletor de consulta todos. E aqui, como você pode ver em nosso index.HTML, Lee com item de classe. Aqui posso encontrar por aula nosso item, e aqui estamos recebendo uma lista de nossos itens. Depois disso, podemos percorrer essa lista de nós DOM. E para cada elemento, podemos anexar um ouvinte. Aqui podemos escrever itens ponto para ricos. Aqui temos nosso item que é um nó DOM. E dentro podemos escrever ponto de item addEventListener. Aqui temos nosso clicker e aqui está nosso manipulador. O que queremos fazer quando estamos clicando no item, pelo menos tentei alguns textos sobre nosso item. Na verdade, temos apenas um valor. É por isso que podemos escrever aqui. Você clicou no item e aqui podemos escrever mais o texto interno do ponto do item. Então, antes de tudo, encontramos a lista de nossos itens e, em seguida, para cada item no loop foi adicionado ouvinte de eventos. Vamos verificar isso. Estou recarregando a página. Vemos nossa lista de itens. Agora estamos clicando em um item e estamos recebendo um bom registro de console com o conteúdo deste item. Estamos clicando em outra extremidade, estamos recebendo log do console e na verdade, ele está funcionando e está tudo bem, mas temos uma tarefa para construí-lo o mais rápido possível. E, na verdade, aqui o problema é que se tivermos uma lista super enorme, então não é suficientemente eficiente. Porque na verdade aqui temos para cada um, para todos os nossos itens, o que significa que temos aqui uma lista de cem, dez centenas de itens onde adicionamos aqui cem, dez centenas de ouvintes. E isso é super ruim para o nosso desempenho. É por isso que essa não é a melhor solução para nossa tarefa. O que podemos fazer, podemos encontrar o pai ou para a nossa lista. E como você pode ver aqui, temos UL com a classe Todo app. Aqui é onde vamos encontrar o elemento do aplicativo e podemos usar aqui documento QuerySelector, e saberemos que a classe está pronta para fazer o aplicativo. Agora, dentro, podemos anexar apenas um único ouvinte para nosso elemento de aplicativo. Então AB addEventListener. Aqui temos nosso clique e aqui está nossa escuta. E então aqui mesmo evento, então temos acesso ao nosso evento. E, na verdade, o que queremos fazer dentro, queremos verificar qual elemento estamos direcionando. Porque podemos clicar aqui em nosso contêiner ou podemos clicar em qualquer item dentro e realmente muito interessados em clicar no item. É por isso que aqui podemos escrever um K Se tivermos aqui o alvo do evento, que significa que clicamos e queremos verificar aqui se nosso evento cobrar tem uma classe do item, isso significa que aquecemos nosso LEA. É por isso que aqui podemos tentar até tocar na lista de classes de pontos. Aqui contém, na verdade, a propriedade de lista de classes dentro do nó tem uma função contém para verificar se temos essa classe. Caso estejamos verificando se clicamos em nosso item. Se isso for feito, podemos copiar nosso bloqueio do console aqui dentro e apenas alterá-lo um pouco. Estamos deixando aqui nossa corda. Você clicou no item aqui em vez de item.name em um texto, podemos escrever texto de ponto alvo de ponto de evento e ele funcionará exatamente da mesma forma. Vamos verificar isso. Estou recarregando a página. Estou escondido aqui em alguns itens e estamos ficando legais. Você clicou. E, na verdade, se clicarmos em algum lugar fora, isso não faz nada. Mas a principal diferença neste código é muito mais rápida porque temos aqui apenas um único ouvinte para nossos pais. E não estamos gerando centenas de milhares de ouvintes para cada item. 29. Solicitação HTTP Xml: Você pode conseguir uma entrevista a pergunta, certo? Um exemplo de busca de dados da API com solicitação HTTP XML. E, na verdade, esta é uma pergunta super antiga. E normalmente as pessoas não devem fazer essa pergunta hoje em dia e entrevistas, mas ainda estão aqui muito nessa questão porque algumas pessoas ainda querem saber como resolvemos nossa busca e problemas há dez ou 15 anos. Nos projetos modernos, você nunca usará a solicitação HTTP XML nativamente. É por isso que não faz sentido fazer essa pergunta, mas devemos aprender a respondê-la. É por isso que vamos escrever um exemplo de como ele está funcionando. Primeiro de tudo, devemos criar nossa solicitação XHR. Portanto, é por isso que estamos chamando você de solicitação HTTP XML. Agora temos uma instância de nossa solicitação HTTP XML e podemos dizer qual método queremos enviar e em qual URL. É por isso que estamos certos e a cadeira XC está aberta. E como você pode ver aqui, temos dois parâmetros. Primeiro de tudo, é método. Aqui queremos escrever GED porque estamos fazendo uma solicitação GET. E aqui está o URL da API e eu colarei aqui e o URL da API do github comm para buscar todos os repositórios desse usuário específico. Depois disso, estamos certos em pontos XHR cn e colchetes redondos. Mas não é tudo. Também devemos especificar o que acontecerá no sucesso e no erro. E para isso estamos escrevendo o ponto XHR no Senhor. E aqui devemos atribuir uma função. E dentro dessa função, antes de tudo, você quer verificar o status que estamos recebendo de volta. Assim, podemos escrever aqui se o gráfico xy esse status não for igual a 200, o que significa que não é bem-sucedido, então queremos consolar algum erro. Quero escrever aqui, por exemplo, a seta por último e talvez o vidro de status XHR, e aqui o texto de status XHR. Nesse caso, podemos ver diretamente o problema que temos no outro caso em que obtemos sucesso. Então, aqui vamos escrever o sucesso do log do console. E depois disso, passamos a ler nossa resposta de ponto XHR, onde dentro temos nossa resposta e também queremos verificar o erro dentro das solicitações do gráfico xy. Então, aqui podemos escrever ponto do gráfico xy em erro. E só para lembrá-lo, tudo é minúsculo e recebemos aqui uma função. E dentro podemos escrever, por exemplo, a solicitação de cobrança extra de log do console falhou. É assim que você normalmente define a função XHR. Primeiro de tudo, criamos uma instância de solicitação HTTP XML. Em seguida, abrimos com nosso método e URL. Em seguida, obteremos areia e, em seguida, temos a função onload e a função de erro para lidar com status incorretos ou uma seta com uma solicitação. Agora vamos verificar se está funcionando. Estou entrando no navegador e recarregue a página. E como você pode ver aqui, estamos recebendo nossa resposta e estamos recebendo sucesso do log do console também em nossa rede, você pode ver que temos um invólucro de solicitação e essa é a solicitação XHR. E, como você pode ver, esta é a nossa prévia. Essa é a nossa resposta do back-end. E isso significa que implementamos com sucesso nossa solicitação de busca usando a solicitação HTTP XML. 30. API de busca: Outra busca e sobre a busca de dados da API é um pouco mais atualizada. Isso é o que estamos usando todos os dias. Aqui você tem uma pergunta, certo? Um exemplo de busca de dados usando a API Fetch. Ele Pi é uma maneira moderna de carregar alguns dados da API. E, na verdade, aqui eu não removi a solicitação HTTP XML. Você pode comparar o código que escrevemos há dez anos. E agora aqui podemos usar a função fetch e nós apenas fornecemos uma entrada e get é o método dentro da busca por padrão, o que significa que aqui devemos fornecer apenas um URL. A parte mais importante é que Fetch nos devolve uma promessa. E isso significa que podemos usar aqui e pegar para obter alguns resultados. Aqui temos nossa resposta, mas normalmente queremos converter nossa resposta para JSON. Nesse caso, podemos usar esses dados facilmente no cliente. É aqui que ele vai reservar para cold res.json, que é uma função assíncrona e transformará nossa resposta em JSON. E depois disso, podemos chamá-los novamente. E aqui obteremos nossos dados. Agora, dentro, podemos trabalhar com esses dados, por exemplo, sucesso no log do console, e aqui estão nossos dados. E, como você pode ver, esse código é muito menor e mais fácil ler do que esse código antigo com solicitação HTTP XML. E, obviamente, aqui também escrevemos um erro e também queremos lidar com isso aqui. É por isso que aqui podemos escrever uma gaiola de pontos. Aqui teremos nossa era. E agora aqui podemos escrever a era do log do console. E isso será acionado quando tivermos um erro. Vamos verificar agora se esse código está funcionando, estou recarregando a página no navegador e, como você pode ver, estamos obtendo um sucesso. Aqui está nossa resposta. E como você pode ver dentro da rede, temos nossa solicitação de corredeiras e o tipo é buscado. E aqui está nossa resposta, o que realmente significa que esse código está funcionando exatamente da mesma forma, mas é baseado em promessas, o que significa que podemos facilmente misturar esse código era qualquer outro assíncrono baseadas em instalações. Por exemplo, se você tiver duas ou três fontes, por exemplo, se você tiver várias fontes de dados, poderá combiná-las facilmente porque elas são todas baseadas no local. 31. Callback Básico: Você pode ter outra pergunta sobre um JavaScript síncrono. Por exemplo, escreva uma função assíncrona, que executa Kohlberg depois terminar sua tarefa assíncrona. E, na verdade, se você não sabe em JavaScript, estamos usando retornos de chamada bastante. E anteriormente antes das promessas e o peso único que usamos callback para buscar dados também, mesmo agora Kohlberg é uma maneira bastante popular de trabalhar dentro do aplicativo. Então, na verdade, antes de tudo, queríamos escrever alguma função que fará algum código assíncrono. E a maneira mais fácil de simular em código assíncrono javascript é usando setTimeout porque, por exemplo, onde h e alguns dados do back-end e isso leva tempo. É por isso que eu quero criar aqui uma função sinc e eles apenas chamam uma pia, um fã. E aqui queremos obter nosso retorno de chamada como parâmetro. E, na verdade, callback é apenas uma função. Mas a parte mais importante é que a função assíncrona não sabe o que é Kohlberg. Pode ser o que quer que seja porque estamos chamando de fora. Agora, dentro, estamos fazendo algum código assíncrono. Por exemplo, buscamos dados da API ou, no nosso caso, aqui estamos usando setTimeout para simular isso. E definimos o tempo limite, por exemplo, por dois segundos. E então, no final, reserve um para chamar nosso retorno de chamada. É aqui que simplesmente chamamos essa função ou às vezes, com os dados como resultado de nossa API. Talvez aqui possamos escrever Kohlberg feito, e esta é nossa função assíncrona está pronta. Agora, como estamos usando essa função, acabamos de tentar uma função sinc e estamos fornecendo nosso retorno de chamada dentro. Esta é uma função que será executada no interior no final. É por isso que aqui podemos dizer que estamos recebendo uma função com mensagem de argumento. Isto é o que estamos recebendo de volta da nossa função assíncrona aqui podemos escrever o log do console Kohlberg e aqui mensagem de vírgula. Vamos verificar se está funcionando. Estou recarregando a página e, como você pode ver, não temos nada agora depois dois segundos, estamos fazendo Kohlberg. É exatamente assim que os retornos de chamada estão funcionando. Isso é exatamente o que implementamos. Temos uma função assíncrona que executa Kohlberg depois de terminar sua tarefa assíncrona. E a segunda pergunta que você pode obter aqui, qual problema callback resolve? E, na verdade, existem dois pontos importantes. Primeiro de tudo, Kohlberg nos permite fazer alguns funcionários síncronos e aguardar o resultado. Porque, na verdade, aqui estamos apenas fornecendo uma função de fora e ela será chamada mais tarde e não imediatamente. Este é o principal objetivo do Kohlberg. E em segundo lugar, é importante lembrar que dentro de nossa função assíncrona, não sabemos o que Kohlberg, é por isso que podemos construir coisas compartilháveis. Este Colbert pode fazer qualquer coisa em casos diferentes. Por exemplo, em uma página, reserve para buscar dados e talvez renderizar esses dados. E em outra página, queríamos buscar esses dados e calcular o número total de postagens ou algo assim. O que realmente significa que Kohlberg é uma função genérica. É por isso que podemos compartilhar facilmente nossa função assíncrona sem implementação específica do nosso callback. 32. Array Async Paralelo: Aqui está mais um exemplo de uma pergunta síncrona, mas um pouco mais avançada, como você pode ver aqui, temos uma pergunta. Execute a lista fornecida de funções assíncronas em paralelo e retorne os resultados como uma matriz para o retorno de chamada. Como você pode ver aqui, já temos três funções, e isso é dado com a tarefa. Então, cada função tem aqui dentro do retorno de chamada, que retorna 123 parte mais importante aqui, que a primeira função é de três segundos, depois dois segundos, depois 1 segundo. Então devemos escrever a função como coletor paralelo. Estamos dentro de onde lançamos uma matriz de funções assíncronas, o que significa que cada função é um retorno de chamada. E então o segundo parâmetro que temos aqui, ONE Kohlberg para um coletor paralelo. Aqui estamos obtendo nosso resultado e estamos fazendo login no console aqui. E devemos obter, neste caso 123 porque ele deve imprimir resultados ou fissuras, função síncrona em ordem, o que realmente significa que estamos executando três funções em paralelo e estamos esperando para que todos eles sejam concluídos. E depois disso, temos a ordem correta dos resultados, o que realmente significa que estamos obtendo resultados de cada função. E, na verdade, estamos usando moda paralela, por exemplo, bastante todos os dias porque queremos, por exemplo, buscar três solicitações diferentes simultaneamente e seguida, obter todos os dados em um só lugar e mesclá-los de alguma forma. Isso é y. Vamos construir essa função agora, mas não é fácil e realmente precisamos pensar no que estamos fazendo aqui. Queremos implementar uma função paralela do coletor. E, na verdade, aqui estamos recebendo antes de tudo, uma série de nossas funções assíncronas. Então podemos escrever aqui eu sinc ufuncs. E o segundo parâmetro é nosso retorno de chamada. E o mais importante é um Kohlberg para um coletor paralelo, não para a função func assíncrona específica. Primeiro de tudo, aqui eu quero criar uma matriz onde vamos colocar nossos resultados. Aqui. Posso tentar resultar na matriz. Aqui queremos escrever uma nova matriz e dentro de um comprimento de ponto de funções sinc. Nesse caso, estamos preparados na matriz vazia com três elementos. E, obviamente, são três apenas para o nosso caso. E pode ser qualquer comprimento de nossas funções assíncronas. Depois disso, eu queria criar um contador de resultados e, por padrão, ele será 0 até o comprimento de nossa matriz. Por que precisamos disso? Porque, na verdade, cada função assíncrona pode ser encerrada em tempo aleatório e devemos esperar que todas essas funções sejam concluídas. Isso significa que devemos contar quantas funções já estão concluídas até estarmos ricos em comprimento. Isso é y aqui vamos criar nosso conteúdo de resultados. E, por padrão, será 0. E agora queremos percorrer nossas funções assíncronas. Então aqui eu sincronizo o ponto de fontes para cada um, e eles realmente usam for-loop aqui. E estamos recebendo acesso para cada função assíncrona. E também precisaremos aqui de um índice porque precisamos armazenar os resultados também na mesma ordem correta. Agora, dentro de cada um, devemos chamar nossa função assíncrona. Mais importante ainda, não sabemos o que essa função está fazendo. Mas sabemos que essa função recebe um Kohlberg. É por isso que aqui podemos escrever nosso retorno de chamada. Estamos chamando uma função sinc sem argumentos. E por dentro recebemos nosso cólon. Se este livro de códigos for acionado, isso significa que estamos prontos com nossa função assíncrona. E agora queremos escrever o resultado dentro da nossa matriz. É aqui que, na verdade, estamos recebendo nosso valor de retorno de chamada. E como você pode ver aqui dentro de cada retorno de chamada, estamos recebendo um valor. E esse é exatamente o valor que recebemos dentro do nosso callback aqui. Agora, queremos armazenar esse valor dentro da nossa matriz de resultados. Aqui podemos escrever uma matriz de resultados e aqui estará nosso índice igual a valor. Só para lembrá-lo, temos nosso índice aqui. É por isso que saberemos que o armazenamos corretamente. Por exemplo, esta é a terceira função e será acionada primeiro, depois a escreveremos no túmulo de índice. Depois disso, devemos aumentar nosso contador de resultados para saber que uma das funções está concluída. E por último, mas não menos importante, queremos verificar aqui se essa função foi a última. Aqui, podemos verificar se nosso contador de resultados maior ou igual a uma pia ufuncs, então queremos chamar nosso Kohlberg para uma pia paralela. Então, aqui podemos simplesmente escrever callback e dentro, estamos fornecendo nossa matriz de resultados. Mais uma vez, o que estamos fazendo aqui, em primeiro lugar, estamos preparados para uma matriz vazia e nosso contador. Estamos percorrendo nossas assíncronas e estamos chamando todas as funções aqui fornecidas em todas as funções, um retorno de chamada. Quando estamos obtendo sucesso, primeiro armazenamos nosso resultado dentro do índice de resultados e, em seguida, aumentamos nosso contador. Nesse caso, sabemos que essa lógica nos devolverá Kohlberg para um coletor paralelo quando estivermos prontos e quando todas as nossas funções estiverem concluídas. Aqui estamos chamando nossa matriz de resultados de largura do livro de códigos. Agora, na verdade, devemos mover essa função antes de chamar um coletor paralelo, porque devemos escrevê-la com const. E vamos verificar se está funcionando. Estou recarregando a página e estamos recebendo uma atribuição para variável constante. Vamos verificar isso. Sim, como você pode ver, um contador de resultados pode ser aumentado porque é const. Aqui. Podemos escrever LED e , em seguida, ele deve funcionar. Vamos verificar isso. Estou recarregando a página. Não temos nenhum erro. Agora passam três segundos e estamos recebendo nossa matriz com 123, o que realmente significa que aqui está um coletor paralelo que espera que cada função assíncrona seja concluída e depois regenerar como um Kohlberg nosso resultado aqui e agora podemos usar aqui nossa matriz na ordem correta. E isso é completamente bom se você não conseguir construir essa função rapidamente. Mais importante ainda, se você estiver fazendo isso em uma entrevista, você deve sempre dizer nossa nuvem, o que você está fazendo e como está pensando. Porque normalmente uma entrevista não é tão importante. Se você resolver essa tarefa completamente ou não, você deve mostrar seu modo de pensar e como deseja resolver essa tarefa específica. 33. Converter Callback para Promise: Você também pode obter outra pergunta sobre um JavaScript síncrono. Aqui devemos criar a função de premissa para poder usar a função callback via abordagem Promise. E, na verdade, só para você saber anteriormente que tínhamos muitas funções de retorno de chamada porque não tínhamos premissas. Depois de algum tempo em JavaScript, migramos totalmente duas premissas, e agora elas são suportadas em JavaScript por padrão, o que significa que não estamos usando retornos de chamada muito mais. E como você pode ver aqui, temos uma função de retorno de chamada padrão onde dentro estamos fazendo alguma suposição é fria e nós dominamos escrever essa função para prometer abordagem, que na verdade significa, por exemplo, estamos usando alguma biblioteca mais antiga que é baseada nos retornos de chamada, mas todo o código do nosso projeto está usando premissas. É por isso que faz muito sentido fazer um rapper e usar essa função de retorno de chamada através da premissa. Para fazer isso, devemos criar uma fina chamada função Promises phi, que realmente significa a mesma função mas envolvida e promessa. Podemos nomeá-lo de mim, Sci-Fi, e esse é o nome típico e liberou uma função sinc, assim como no topo. Aqui não temos nenhum argumento aqui que queremos chamar nossa função assíncrona. E quando temos um livro de códigos , queremos chamar nosso callback da premissa. É aqui que estamos o retorno principal e você promete. Aqui dentro da promessa que resolvemos e rejeitamos, mas usaremos aqui na resolução de Lou porque não temos nenhum erro aqui. Agora, dentro de nossa premissa, podemos simplesmente chamar a função assíncrona regular e colocar um retorno de chamada dentro. E, na verdade, esse retorno de chamada nos dará alguns dados de volta. É por isso que estou escrevendo dados e nem sabemos de quais dados estamos falando. Agora, dentro, queremos apenas chamar a resolução e passar dados de insight de nossa função assíncrona. Nesse caso, quando a função síncrona estiver concluída, nosso Kohlberg estará acontecendo. Aqui. Dentro de Kohlberg, estamos recebendo dados de uma função síncrona e trabalhamos dois pontos na resolução de Kohlberg para essa premissa que criamos. E o mais importante que essa função retornará uma promessa. É por isso que podemos usá-lo agora, como essa premissa de alta função assíncrona, nós apenas chamamos de retornos finais como premissa. É por isso que podemos escrever aqui. Em seguida, estamos obtendo alguns resultados e podemos fazer, por exemplo, o resultado do log do console. Estamos usando essa função como uma promessa e envolvemos nossa função sinc na premissa se phi, Vamos verificar isso. Estou recarregando a página e, como você pode ver, estamos voltando uma depois de algum tempo. Porque aqui temos um livro de códigos com 3 mil milissegundos, o que realmente significa que estamos recebendo nossos dados após três segundos e esse código está funcionando. E agora em todos os lugares do nosso aplicativo, podemos usar essa função de retorno de chamada na abordagem promessa. 34. Mapa de dados em Promessas: Você pode obter outra tarefa típica de mapear dados com premissas. Como você pode ver aqui, temos esse recurso. Você tem duas funções que retornam premissas, metadados de usuários e status de usuários para obter uma matriz de usuários com nome AED e está ativo. Como você pode ver aqui, temos um usuário de array com D e nome, e temos um estágio de usuário secundário com o dN dt é propriedades ativas. E, na verdade, esse AD é exatamente o mesmo que um D aqui. E esses são exatamente os dados que precisamos mapear. Portanto, precisamos obter um array com um nome DNS e está ativo. Mas o ponto principal é que esses dados não estão disponíveis rapidamente. Eles só estão disponíveis aqui dentro de obter usuários e obter status de usuários. Temos duas funções que são promessas e, normalmente, você buscará esses dados da API. É assim que os usuários retornarão promessas falsas. É por isso que estamos resolvendo uma matriz de usuários aqui e aqui estão os mesmos com os status do usuário, o que realmente significa que temos duas premissas. Devemos resolvê-los e combinar. Existem diferentes maneiras de resolver essa tarefa. A abordagem mais iniciante aqui é buscar a primeira premissa e depois a próxima. Vamos tentar isso. Agora. Podemos escrever aqui para obter usuários, e isso nos devolve uma premissa. É aqui que podemos escrever e estamos recebendo nossos usuários de volta. Agora, depois disso, queremos buscar nossos status GetUser. Aqui estamos chamando status GetUser, e também os usamos aqui, e estamos recebendo de volta nossos status de usuário. E agora, dentro dessa função, temos acesso aos status e aos usuários dos usuários. Porque aqui vamos chegar somente depois de resolver os dois, mas não em paralelo, mas um por um. O que podemos fazer aqui, podemos mapear usuários, que possamos criar, por exemplo, usuários mapeados. E precisamos percorrer nossos usuários com mapa, temos acesso a todos os usuários. E agora precisamos descobrir que essa é uma propriedade ativa porque isso é exatamente o que queremos colocar em nossa matriz. É por isso que aqui podemos escrever que o const está ativo, e aqui queremos encontrar status de usuário, nosso status, é aqui que estamos certos e encontrar o status dos usuários. E aqui precisamos verificar o status do usuário. Dot id é igual ao nosso ID de ponto do usuário. Mas isso retornará mais rápido ao status e devemos experimentá-lo no final estiver ativo. Nesse caso, entraremos na propriedade específica. Agora, depois de termos nosso executivo, queremos colocá-lo dentro de cada objeto, mas não vamos usar aqui push porque você se lembra de empurrar mal. É por isso que o Google mais simples retorna aqui e você se opõe e estamos espalhados aqui. Todos os campos do nosso usuário. O vidro é propriedade ativa. Nesse caso, somos Putin é uma propriedade ativa em cada usuário. E depois disso, podemos apenas registrar nossos usuários mapeados aqui e eles estão disponíveis para nós dentro do nosso aplicativo. Vamos verificar isso. Estou recarregando a página e estamos recebendo o usuário atendido. E como você pode ver, isso como uma matriz com três objetos, ID, nome e está ativo, o que significa que, na verdade resolvemos essa tarefa com sucesso. Mas há muitos problemas nesse código. Primeiro de tudo, temos duas premissas diferentes e elas não dependem umas das outras, o que significa que não faz sentido esperar pela primeira premissa e Don fará uma segunda premissa. Na verdade, devemos fazê-los em paralelo. Em outros casos, é muito lento. Então, quero escrever aqui que esta é a solução um e eles querem comentar nossa primeira solução. Agora vamos tentar a segunda solução. Para a segunda solução, podemos usar premissa se você não souber qual é a premissa dele. Então, isso é exatamente o que está nos ajudando a fazer várias premissas em paralelo. Podemos escrever aqui promessa ponto o, e devemos passar uma variedade de instalações para dentro. Aqui temos uma matriz e podemos escrever aqui, obter usuários e depois vírgula, obter status de usuários. Nesse caso, estamos lançando dentro da premissa toda matriz com nossas duas premissas. E depois da premissa tudo no final, podemos tentar, então aqui obteremos nosso resultado como uma matriz, mas não é muito confortável trabalhar com array aqui. É por isso que podemos destruir diretamente aqui nossa matriz para nossas duas propriedades. Aqui estamos recebendo nossos usuários e aqui estamos recebendo nossos status de usuário. E depois disso, podemos fazer nossa lógica, o que fizemos aqui com o usuário mapeado. É por isso que vou cortar esse código foi mapeado usuários e apenas colocá-lo aqui porque ele permanecerá exatamente o mesmo. Aqui temos acesso aos nossos usuários e ao status de nossos usuários SES, e estamos mapeando eles e o console registrando-o aqui. Vamos verificar isso. Estou recarregando a página e estamos recebendo exatamente a mesma resposta de volta. O ponto principal é aqui que usamos promessa de todos. Isso é muito melhor porque neste caso estamos fazendo essas duas solicitações em paralelo. Além disso, como você pode ver, a solução para, mas não tem esse mau desagradável com então e então, e aqui temos apenas um único, então isso é obviamente melhor porque queremos evitar esse código profundamente aninhado, mas podemos tornar esse código ainda melhor. Como você pode ver, temos esse mapa para os usuários e, na verdade, podemos mover esse código para fora do nosso Então apenas para torná-lo mais legível. Aqui podemos criar função adicional antes, por exemplo, mapear usuários. E sabemos que estamos recebendo aqui nossos usuários e status de usuário. E, na verdade, esta é uma função completamente pura que apenas mapeará nossos usuários. Então eu posso cortar esse código e colocá-lo aqui dentro. Aqui, não precisamos da nossa constante. Podemos retornar diretamente nosso mapa. E, na verdade, esse código será exatamente o mesmo que o usamos anteriormente. E agora o que podemos fazer aqui, podemos simplesmente criar usuários mapeados. E aqui estamos assinando usuários de mapas e estamos passando por nossos status de usuários e usuários. Como você pode ver agora, esse código é ainda melhor para ler porque aqui nós simplesmente temos premissa tudo. Em seguida, estamos mapeando nossos usuários com função adicional e trabalhamos para que Logan eles. Vamos verificar isso como você pode ver aqui, exatamente a mesma resposta. E, na verdade, podemos melhorar essa função ainda um pouco mais, como você pode ver, onde estou mapeando usuários de dentro para fora com eles. Mas, na verdade, podemos encadear nossa dança, o que realmente significa que aqui talvez quereremos diretamente nosso mapa aos usuários. Então, nosso primeiro, depois vamos nos encontrar com os usuários e devolvê-los aqui. E depois deste fim de semana, certo Um a mais do que, e aqui teremos nossos usuários mapeados, e aqui queremos trabalhar com eles. Então aqui eu vou registrar nossos usuários mapeados no console. Nesse caso, dividimos dois mapeamentos de dança diferentes dos usuários e trabalhamos com sucesso. E, na verdade, aqui com o console mais simples registra nossos usuários, o que significa que esse é o nosso sucesso. E podemos até remover o retorno daqui e escrever isso como uma única linha, neste caso, será ainda mais legível. Eu diria que esse código é o mais seco possível. É por isso que, se você quiser mostrar que é um desenvolvedor avançado, você deve escrever seu código e tentar melhorá-lo quantas vezes possível. 35. Reescrever dados de mapeamento no Async Await: A próxima pergunta assíncrona em JavaScript terá certeza de que um coletor de ajuda aqui realmente dominará o exercício anterior, como mapear usuários com duas premissas em um coletor, uma função de peso, como você pode ver aqui, temos nossos usuários status de usuários e duas funções, obter usuários e obter premissas do usuário. E, na verdade, eu duvido do nosso código anterior para que possamos copiar partes dele. A primeira coisa que devemos fazer aqui é criar uma função adicional. Por que isso? Porque você não permite que ele escreva de forma mais simples diretamente na parte raiz do arquivo JavaScript ****. Este é y aqui. Primeiro de tudo, devemos criar algo como obter usuários mapeados talvez porque queremos torná-lo uma função assíncrona. É aqui que estamos usando nossa palavra-chave assíncrona. Aqui estamos criando nossa função. E essa palavra-chave presumida nos permite usar um peso dentro. Mas queremos fazer agora, queremos obter status de usuários finais de nossos usuários. Aqui eu posso simplesmente escrever usuários. Não se esqueça desse peso aqui. Estamos apenas tentando obter usuários. E se você esquecer aqui um peso, então aqui não teremos nossos usuários, mas você terá aqui uma premissa. E isso não é o que queremos. Queremos resolver nossa premissa. A próxima linha aqui será o status do usuário é, e aqui queremos obter o uso dos status. E, obviamente, como você pode ver, esse código é muito, muito mais fácil de ler porque não temos nenhum, então não temos premissa todas. Parece que é um código síncrono simples porque as linhas são executadas uma a uma. E depois disso, na verdade, queremos copiar, colar nosso mapeamento e colocá-lo aqui porque não o alteraremos e não faz sentido criar função adicional. Porque dentro dessa função temos apenas duas linhas. É por isso que aqui podemos escrever usuários mapeados const. Aqui estamos atribuindo o mapa de pontos dos usuários e estamos fazendo exatamente as mesmas coisas como fizemos no vídeo anterior. Após a terceira linha, já temos nossos dados de mapa. Aqui podemos escrever o mapa de log do console para os usuários. E aqui podemos verificar nossos usuários mapeados, mas também devemos chamar em algum lugar nossa função get mapped users. Não precisamos escrever aqui um peso ou algo assim porque simplesmente chamamos uma função assíncrona. Agora, vou recarregar esta página. Como você pode ver, estamos recebendo usuários mapeados. E esta é a nossa resposta, o que realmente significa que esse código está funcionando corretamente. E esse código parece super legível porque usamos aqui um único peso por isso não é suficiente, mas sempre queremos envolver nosso código de bytes um try-catch. Por que isso? Porque se aqui recebermos algum erro , nunca o veremos. Teremos um erro e apanharemos a premissa. É por isso que aqui queremos, no início, escrever tente aqui no final após nosso cupom de log do console para fechá-lo e secá-lo aqui, gaiola e aqui estamos recebendo nosso erro dentro do nosso dinheiro. Queremos escrever algo como log do console Azure. E aqui está um erro que podemos obter. Nesse caso, estamos no lado seguro e saberemos se algum código assíncrono não funciona aqui ou estamos recebendo alguns erros, lançaremos um erro aqui dentro do catch. Vamos verificar isso. Nosso código ainda está funcionando e usamos com sucesso o peso singular à direita são promessas com ele. 36. Você Deve Usar Vocabulário Correto: Mais uma coisa importante a lembrar é bastante complicada e as pessoas não estão falando muito sobre isso. E estou falando aqui sobre seu vocabulário de programação. O que quero dizer com isso, na verdade, há muitas palavras que você pode usar quando você está falando sobre programação. Então, a pessoa o entende melhor ou pelo menos corretamente, e você não deve misturá-los. Há um começo. Pode ser muito difícil para você porque você não conhece todos esses termos ou não tem certeza do que quer dizer, mas precisa ter isso em mente e tentar melhorar com o tempo. Por exemplo, você deve realmente entender o que está dizendo. Por exemplo, mostrei uma função ou criei um método dentro da minha classe. Esta é uma instância da classe. Você deve usar todos esses termos corretamente se vir uma função, mas estiver chamando esse método, ou talvez esteja chamando de outra coisa. Isso não está correto. E então você receberá muitas perguntas adicionais ou será visto como um desenvolvedor ruim. Você, claro, não quer isso. É por isso que você precisa pensar um pouco quais palavras você está usando e tentar usá-las corretamente quando estiver descrevendo algumas coisas de programação. 37. Gerente de Solicitação de Design: Aqui está outra tarefa síncrona, que é um pouco complexa. Então você precisa de algum tempo para resolvê-lo. E você não pode resolvê-lo como em três ou cinco minutos. Como você pode ver aqui, devemos projetar um utilitário que pegue um URL e o valor para tentativas, que tentará fazer uma solicitação de busca. Se tivermos uma falha, essa função tentará novamente buscar alguns dados com atraso crescente por número de vezes que o usuário solicitou. que realmente significa que devemos criar uma função que buscará um URL específico que forneceremos e também ter alguma quantidade de tentativas. E queremos atualizar esses dados de novo e de novo por várias vezes, se não recebemos uma mensagem de sucesso. E, na verdade, esse é um problema muito comum porque às vezes nossa API não está funcionando ou os dados não estão lá e queremos tentar novamente. Vamos tentar criar essa função e eles querem nomeá-la, por exemplo, gerenciador de solicitações. E, na verdade, aqui teremos nossa URL porque queremos buscar algo de fora e sempre algo novo. E aqui temos algumas opções para nossa URL. E o último parâmetro será tentativas. E, por padrão, pode ser três, por exemplo. Então, estamos tentando atualizar alguns funcionários três vezes. É assim que usaremos isso. Portanto, temos aqui o gerenciador de solicitações e receberam algum URL. Eles usarão aqui algum URL que não existe. Nesse caso, vamos atualizá-lo. Temos foo.com e essa função deve retornar premissa mais rápida, é aqui que temos aqui, então, aqui temos sucesso e erro. É aqui que estamos aguardando alguma resposta e podemos apenas tentar o log do console, por exemplo, resposta para verificar se está funcionando. É assim que normalmente usaremos essa função. Queremos buscar algum URL e simplesmente os temos. E, obviamente, aqui podemos passar algumas opções. Por exemplo, post de método e alguém, ou quantidade de tentativas se quiséssemos alterá-lo, se não passarmos nada, então aqui não temos nenhuma opção e nossa tentativa é três. Agora a questão é o que queremos voltar aqui? O ponto mais importante para entender como vamos construí-lo. Vamos executar essa função recursivamente porque essa é uma maneira mais fácil de chamar essa função várias vezes, é que chamaremos o gerenciador de solicitações de cage novamente aqui. E nós simplesmente forneceremos aqui dentro das opções de URL e, em seguida, tentaremos , diminuiremos, o que significa que, no início, temos três tentativas. Agora, na próxima vez, serão dois, depois um, e então lançaremos um erro porque não temos nenhuma tentativa restante. Então, antes de tudo, devemos retornar uma promessa porque é isso que estamos esperando lá fora. E é aqui que estamos retornando, você promete, e aqui temos nossa determinação e rejeição. Agora, dentro dessa função, queremos tentar buscar nossos dados, e simplesmente usaremos aqui a função fetch porque ela está disponível para nós nativamente. Dentro, estamos passando antes de tudo nosso URL e, em segundo lugar, opções. E agora aqui temos o nosso, então nós pegamos e, na verdade , então podemos simplesmente chamar nossa determinação. Isso passará os dados de sucesso diretamente dentro do resolve, porque Resolve é uma função. Aqui. Também queremos uma captura. Aqui dentro da gaiola. Queremos fazer nossa matriz. Então, aqui estamos recebendo nosso erro e queremos ligar para nosso gerente de solicitações novamente. Mas aqui devemos saber quando vou tentar é o último. Então aqui eu quero criar uma propriedade é a última tentativa. E aqui podemos verificar se nossa tentativa é igual a uma. Nesse caso, saberemos, ok, esta é a última vez em que podemos ligar para o nosso gerenciamento de solicitações. E depois disso, estamos verificando se esta é uma última tentativa, então queremos retornar a seta de rejeição, o que significa que estamos apenas rejeitando nossa premissa porque não podemos continuar mais após esse EQ, mas não tem 0s última tentativa, então queremos fazer setTimeout porque, na verdade queremos chamar essa função depois de algum tempo. Não faz sentido chamá-lo diretamente depois, porque talvez a API ainda esteja inativa. Aqui. Vou escrever setTimeout, por exemplo, com três segundos. E, obviamente, também podemos implementar um argumento para passar o intervalo para chamar dados. Dentro do SetTimeout, queremos solicitar nossos dados novamente. Então, aqui vamos ligar para o gerenciador de solicitações e estamos passando aqui opções de URL agora. E a última será tentativas menos uma, que realmente significa que não começamos tentativas em nenhum lugar. Simplesmente fornecemos recursivamente na quantidade reduzida de tentativas do gerenciador de solicitações . Isso é y aqui na primeira vez que são três, então estamos vindo aqui em SetTimeout. É para um. E então verificamos que essa tentativa é igual a uma e estamos aqui dentro deste IV e estamos rejeitando. Então, vamos verificar se está funcionando. Estou recarregando o navegador. E como você pode ver, estamos recebendo um get e uma seta porque esse URL não existe e estamos recebendo tentativas não está definido na linha 13 dentro do nosso tempo limite definido. E, na verdade, o nome do argumento aqui não está correto. Não é tentativa, mas tentativas porque temos várias delas. E também aqui devem ser tentativas iguais a uma e não tentativa. Vamos recarregá-lo novamente. Como você pode ver, estamos recebendo cabeçalho. Depois de três segundos, estamos recebendo essa solicitação novamente porque tentamos novamente e depois novamente. Aqui, falhamos um erro não detectado ao buscar, o que realmente significa que aqui devemos escrever não apenas eles, mas também cache, porque aqui teremos um erro se não conseguirmos buscar dados. E aqui podemos tentar o erro de log do console. E aqui queremos ver nosso erro. Mas, como você pode ver, ainda recebemos um erro sem aspas tipo par de falha ao terminar, o que significa que nosso código não está 100% correto. E, na verdade, o problema é aqui que esta é a nossa primeira chamada de gerente de solicitações e estamos lidando com isso lá fora e pegamos. Mas aqui, em vez disso, setTimeout temos o gerenciador de solicitações, mas não temos então e percebo que é por isso que ele está quebrando. Temos um erro em nosso terceiro carvão, e isso está aqui, mas não especificamos o que acontecerá com ele. Isto é o que aqui, boom, deve escrever. Então aqui queremos resolvê-lo com dados e também pegar e em dinheiro que simplesmente queremos rejeitar. Nesse caso, ele funcionará corretamente. Vamos experimentar isso. Estou recarregando a página. Estamos passando por erros e agora nosso erro está borbulhado para fora e vemos que o TypeError falhou ao buscar. Nesse caso, ele está funcionando corretamente. Você não deve esquecer de borbulhar nosso gerente de solicitações interno lá fora com então e pegar. Então, posso dizer que essa função é bastante complicada. Então, se você receber algo assim na entrevista, você realmente deve tomar seu tempo para resolvê-lo corretamente. Você não pode realmente projetar essa função em questão de minutos. 38. Implementar Comparação Rasa: Você também pode obter uma pergunta sobre igualdade ou comparação dentro do JavaScript. E como você pode ver aqui, temos uma pergunta, função de comparação superficial dos designers. Para isso, você deve saber a diferença da comparação do JavaScript, que é comparação nativa, superficial e comparação profunda. Dentro do JavaScript, podemos simplesmente escrever um igual a dois. Estamos ficando falsos. Um é igual a um é verdadeiro. Isso está funcionando porque estamos comparando primitivas. Mas se compararmos aqui um igual um e aqui está um objeto igual a um, estamos ficando falso. Enquanto isso porque não podemos comparar objetos como este em JavaScript porque eles estão fazendo referência objetos diferentes dentro da memória. E você tem exatamente o mesmo problema com o array. matriz vazia não é igual à matriz vazia. Sim, podemos entender por que ele está funcionando assim, mas não é confortável porque normalmente os desenvolvedores querem comparar matrizes e objetos por valores e não como referência ao objeto na memória. É por isso que temos funções de comparação superficial e comparação profunda. Portanto, a ideia é que comparação superficial seja mais rápida do que uma comparação profunda, mas resolverá problemas com comparação de objetos ou matrizes. Ele consertará apenas matrizes não aninhadas são objetos, o que realmente significa que, se quisermos com comparação superficial, compararmos a, e aqui temos um objeto com B1 e aqui B1, ainda obteremos uma resposta errada mesmo com função de comparação superficial. Isso é completamente normal porque, neste caso, queremos comparar cada valor aninhado e, em seguida, devemos usar uma comparação profunda. E uma comparação profunda é extremamente lenta porque estamos verificando cada valor, mas com certeza eu lhe darei uma resposta verdadeira. Neste vídeo, devemos escrever uma função de comparação superficial, o que significa que queremos corrigir a comparação de matrizes e objetos, mas não devemos comparar matrizes e objetos aninhados. É assim que a comparação superficial está funcionando. E, na verdade, aqui eu tenho um tipo de função adicional que nos ajudará tremendamente na construção de comparação superficial. E, como você pode ver no navegador, podemos simplesmente usar typeof em diferentes tipos de dados. Por exemplo, para número, estamos recebendo um número tenso para palavra de string versus obter uma string. E aqui podemos escrever um objeto e, em seguida, estamos recebendo um objeto, o que realmente significa que é muito bom obter o tipo de nossa variável como uma string. Para nós, a parte mais interessante é esse protótipo de objeto para transmitir entrada de chamada. E como você pode ver na entrada onde, por exemplo, um e estamos recebendo o número do objeto. E, na verdade, essa expressão regular aqui simplesmente moverá objeto e obteremos essa parte com número. É assim que essa função está funcionando. Aqui eu quero criar nossa função de comparação superficial. Devemos fornecer aqui dois argumentos. Portanto, temos origem e destino, e essas são duas coisas que queríamos comparar, por exemplo, duas variáveis. Primeiro de tudo, queremos comparar um tipo de dados porque se tivermos um tipo de dados diferente , não devemos fazer nada e isso significa que eles não são iguais. É por isso que podemos escrever aqui. Se typeof source não for igual a typeof, então aqui podemos simplesmente retornar false. É por isso que é super desempenho. Não comparamos nada. Simplesmente obtemos um tipo compará-los e estamos fora depois que esse boom deve escrever lógica para nossas primitivas. E aqui podemos simplesmente usar uma comparação JavaScript nativa simples. Estou escrevendo aqui se a fonte for igual a três folhas de estilo iguais, então aqui estamos apenas retornando, o que realmente significa essa única linha. Vamos comparar ou primitivos. E agora só precisamos construir casos para nossos objetos e matrizes. Primeiro de tudo, vamos cobrir nossos arrays. Aqui queremos verificar o tipo fora da nossa fonte é igual a array. Então queremos aplicar essa lógica. E você pode perguntar, ok, mas por que estamos apenas verificando a fonte e não um detergente? Porque, na verdade, aqui no topo, já sabemos que tanto a origem quanto o destino do mesmo tipo. Em outros casos, já estamos fora da função. Aqui. Sabemos que a origem e o destino são ambos arrays e agora queremos compará-los, mas na verdade podemos fazer algumas melhorias de desempenho. Aqui podemos comparar apenas um comprimento de dois arrays. E se eles são diferentes do que não devemos comparar nada porque eles não são iguais. Então aqui eu posso escrever IV, fonte, terra não é igual ao nosso comprimento alvo. Então estamos aqui, simplesmente retornamos false. Agora queremos comparar esses dois arrays, e a maneira mais fácil de fazer isso é usar a média. Estamos verificando cada elemento dentro de uma matriz e comparamos. Aqui eu quero escrever fonte de retorno a cada, então estamos verificando cada elemento da fonte. E aqui temos acesso ao elemento e ao índice. E o que podemos fazer aqui é nosso elemento é igual ao índice alvo. Nesse caso, estamos comparando cada elemento da nossa fonte com cada elemento do destino. Mas, como você pode ver aqui, estamos usando a comparação JavaScript nativa, que significa que ela funcionará para primitivas, mas não funcionará, por exemplo, para objetos ou matrizes, como ele se parece? Vamos recarregar a página e aqui nossa função, comparação superficial. E podemos fornecer agora a matriz com primitivas. Então aqui temos 11 e estamos ficando verdadeiros, o que realmente significa que nossa função está funcionando corretamente porque o JavaScript nativo que você não pode comparar 11, será falso e nossa função está funcionando corretamente. Agora devemos tentar o código semelhante para o nosso objeto. É por isso que aqui podemos escrever se typeof source for igual a objeto, então queremos aplicar nossa lógica. E, novamente, quero melhorar o desempenho. Este é y aqui. Em primeiro lugar, podemos verificar, por exemplo, chaves de objeto e comparar o comprimento das chaves se o comprimento for diferente desses objetos são certamente diferentes. Então, aqui podemos escrever teclas de ponto de objeto. Aqui temos fonte e estamos comparando o comprimento. Portanto, aqui o comprimento não é igual às nossas teclas de ponto de objeto, e aqui temos nosso comprimento de ponto alvo. Nesse caso, podemos simplesmente retornar false e não devemos fazer nenhuma comparação. E, na verdade, aqui agora precisaria comparar objetos. Então, para isso, também usarei todos. Então aqui eu quero retornar nossas teclas de ponto de objeto, e estou recebendo uma série de cadeias de caracteres de chaves do nosso objeto. E aqui estamos fornecendo nossa fonte. Depois disso, podemos usar todos e aqui como um elemento único. Estamos recebendo nossa chave. Agora podemos comparar a chave de origem. Então, estamos recebendo o valor e comparamos aqui a chave alvo. Nesse caso, estamos comparando cada valor único do nosso objeto. Mas, como você pode ver com uma comparação simples do JavaScript, que significa que funcionará para primitivas, mas não funcionará para elementos aninhados profundos. Vamos verificar isso. Vou recarregar a página. Aqui está nossa comparação superficial. Nesse caso, queremos comparar o objeto a e o objeto que você deseja. E como você pode ver aqui, eu tenho algum erro de digitação. Aqui não há fonte. Vamos mudar isso. Agora, como você pode ver, está funcionando e podemos comparar nossos objetos. E, na verdade, agora eu quero mais uma comparação para datas, e isso é extremamente fácil de fazer. Aqui. Podemos tentar o tipo de fonte igual ao estado. Então queremos comparar apenas dois números porque, na verdade, podemos comparar cada data dois milissegundos e comparar números é extremamente eficiente. É por isso que aqui podemos escrever o ponto fonte de retorno obter tempo. Isso obterá milissegundos igual ao ponto alvo get time. E neste caso estamos simplesmente comparando dois números e isso é totalmente bom. É assim que estamos construindo uma função de comparação superficial. E, na verdade, é assim que eu quero ver a comparação por padrão em JavaScript, mas infelizmente não a temos. É por isso que devemos criar essa função por conta própria ou usá-la de alguma biblioteca como Rumba la dash ou apenas pacote NPM. Se você estiver respondendo a essas perguntas sobre comparação superficial, você deve dizer que é super desempenho em comparação com uma comparação profunda, mas não pode comparar elementos aninhados, o que está totalmente bom. E você só precisa saber para qual caso você está usando. 39. Implementar uma comparação profunda: Em vídeo anterior, escrevemos a comparação superficial da função. Mas você também pode obter uma pergunta, ok? Mas como podemos escrever a função para comparação profunda? Isso é o que queremos fazer neste vídeo. Na verdade, como você pode ver, eu não removi nenhum código. Eu tenho aqui um tipo de comparação superficial e eles querem copiá-lo e colá-lo completamente e comparar mais tarde com uma comparação profunda. É por isso que, como você pode ver, eu copiei toda a função e eles só querem renomeá-la para comparação profunda. E, na verdade, o código será 90% semelhante porque antes de tudo, queremos verificar o tipo de dados e é permanecer o mesmo e que no final compararemos data e origem e destino para primitivos da mesma forma. Então, na verdade, a biomassa apenas muda a comparação de nossos arrays e objetos e, na verdade, até mesmo o código interno será quase o mesmo. Então, antes de tudo, para corrida, estamos verificando a duração. Aqui temos todos, mas aqui devemos remover nossa comparação de elementos porque é uma comparação nativa. Mas aqui queremos verificar recursivamente cada elemento. É por isso que aqui podemos simplesmente escrever uma comparação profunda e estamos jogando dentro do nosso índice alvo de coma de elemento. Neste caso, o que estamos fazendo, somos dois pontos profundos comparar novamente. E, na verdade, aqui pode ser que tenhamos um objeto, então estamos chegando recursivamente e dizemos comparação profunda. E vamos comparar o assunto e estamos fazendo isso de novo e novo até compararmos todo o objeto ou toda a matriz. E não importa quão profundo o assunto seja ou quão profundo esses arrays, o que realmente significa que isso não é desempenho. Isso é muito lento, mas lhe dará a resposta correta quando você estiver trabalhando com dados aninhados e exatamente o mesmo que devemos fazer agora com nossos objetos. Aqui podemos deixar nossa comparação com as chaves. Isso é totalmente bom. Aqui temos nosso Every, mas devemos remover essa comparação e chamar a comparação profunda. E estamos passando dentro da nossa chave de origem e aqui a chave de destino. Nesse caso, estamos comparando dois valores de nosso alvo e nossa fonte. E também estamos fazendo isso com uma comparação profunda. E isso é, na verdade, transformará totalmente nossa função de comparação superficial em comparação profunda. Vamos verificar isso agora, vou recarregar a página aqui, a comparação superficial A1, A1, é verdade, mas na verdade aqui dentro da comparação superficial, se eu lançar um B1, então temos um objeto aninhado e aqui um B1, ele retornará false, o que significa que a comparação superficial não pode funcionar com dados aninhados. Mas aqui estamos chamando nossa comparação profunda e estamos se tornando verdadeiros porque a comparação por imersão é recursiva e ela vai comparar n in estan corretamente exatamente o mesmo que temos para uma corrida. Por exemplo, se tivermos aqui uma matriz de matrizes, digamos que array com um array. E aqui temos array e array um dentro. Como você pode ver, estamos passando e podemos comparar matrizes de qualquer nível. 40. Criar função de memorização: Você também pode obter uma pergunta sobre memorização. Aqui, como você pode ver onde a máscara projeta uma função de memorização que adiciona dez para fornecer valor e tirá-lo do cache se fosse tudo calculado. Se você não sabe o termo memorização em JavaScript significa, isso significa que estamos armazenando valores em cache para evitar fazer a mesma operação novamente, que realmente significa, por exemplo, queremos subtraia dois números. E se fizermos isso anteriormente e já soubermos a resposta, então devemos devolver o sensor e não calculá-lo novamente. Obviamente, não faz sentido fazer com que subtraíssemos ou alguns, mas faz muito sentido quando temos alguns cálculos difíceis. É por isso que aqui devemos construir um exemplo de função de memoria. E, na verdade, não é tão difícil. Então aqui eu quero criar uma função memorizar, adicionar. Em vez disso, esta função. Não precisamos de nenhum argumento, mas queremos criar um cache dentro. É por isso que aqui vou criar uma propriedade em dinheiro. Isso é apenas um objeto. Agora aqui eu quero retornar uma nova função. E você pode ver que isso é um fechamento porque na verdade podemos armazenar com algumas variáveis quando temos um fechamento. É por isso que aqui retornarei a função com valor. Agora, aqui está como estamos usando isso lá fora. Aqui queremos criar uma nova função de adição e apenas o chamamos de MIs add, neste caso, nova função de usuário AD e podemos usá-la. É por isso que aqui podemos escrever um novo anúncio, por exemplo, nove, e esse é o nosso valor. E fazer esse caso será a saída 19 calculada por 19 porque na verdade, como você pode ver em nosso futuro, ele deve adicionar dez ao nosso valor fornecido. Estamos jogando dentro de nove e estamos voltando 19. Mas, na verdade, quando estamos chamando novo anúncio com o Snyder, novamente, a saída também será 19, mas deve ser tirada do cache. Não deve ser calculado. Novamente, isso é exatamente o que a memorização está fazendo. Agora só precisamos implementar essa lógica de memoria. Então aqui podemos escrever se tivermos um valor em dinheiro, então estamos verificando se temos tal válido dentro do nosso objeto, então queremos apenas devolvê-lo. E aqui eu quero escrever o log do console você possa ver que ele é minimizado. Aqui estará buscando dinheiro. E depois disso, quero escrever dinheiro de retorno. E aqui está nosso valor. Como você pode ver, não fazemos nenhum cálculo aqui. Simplesmente retornamos o valor e também teremos mais. E aqui temos cálculos estavam aqui calculando os resultados. E depois disso, devemos realmente calculá-lo. Então, vamos criar aqui um valor, por exemplo, resultado. E queremos colocar aqui valor mais dez. E depois disso, devemos colocá-lo em dinheiro antes de devolvê-lo. Nesse caso, estamos armazenando nosso resultado para a próxima faixa. É aqui que podemos escrever valor em dinheiro igual a resultado. Nesse caso, estamos atribuindo dinheiro para o nosso número nove. Neste caso, quando, na próxima vez aqui nove , estamos recebendo o valor do dinheiro. E depois disso, podemos simplesmente retornar nosso resultado. E esse é apenas o valor que calculamos aqui. Vamos verificar isso. Estou recarregando a página. Como você pode ver, estamos obtendo calcular os resultados finais. Esta é a nossa primeira tentativa aqui e calculou 19, o que realmente significa que realmente calculamos algo. Mas na segunda vez que esse carvão, temos buscando dinheiro 19, o que realmente significa que não calculamos desta vez, esse número, mas nós o tiramos do dinheiro. E é assim que você normalmente implementa a memorização. Você pode obter tarefas diferentes, mas a ideia é a mesma. Você tem algum dinheiro, tem um fechamento e deve entregar o valor do cache e colocá-lo no cache no primeiro cálculo. 41. Fibonacci: Bem-vindo a algumas perguntas realmente hilárias, porque essas coisas que você nunca usará em sua vida cotidiana como um programador, mas você deve saber como resolvê-lo. E o primeiro aqui, que é o meu design favorito, uma função que retorna se valor da sequência de Fibonacci e eles não tentaram funcionar para obter o valor de Fibonacci nos últimos 12 anos, o que realmente significa que não é necessário. Mas estou constantemente ouvindo essa pergunta repetidas vezes na entrevista. E, na verdade, acho que é totalmente bom perguntar ao entrevistador. Certo, não conheço uma fórmula para Fibonacci. Você pode salvar e, em seguida, eles podem codificá-lo. Não é um problema. Isso é totalmente bom porque você não deve saber cor todas as fórmulas matemáticas. É aqui que aqui, na verdade, você pode obter algo assim como resultado para sua pergunta. Então aqui você pode ver que a sequência de Fibonacci é uma sequência inteira onde os dois primeiros termos são 01 após o próximo termo ser definido como uma soma de dois termos anteriores. E o termo else é a soma de n menos um e n menos dois, o que realmente significa que este é um início típico da sequência que temos aqui 0112. E como você pode ver aqui, podemos somar por exemplo, 11 e estamos chegando aqui com cerca de 12 e estamos recebendo três e assim por diante e assim por diante. Então, como podemos resolver isso, devemos fornecer uma função R, um valor de sequência de Fibonacci, que realmente significa o índice na sequência. Por exemplo, se fornecermos sete como argumento, então devemos chegar aqui em banda para banda, porque na verdade vamos resumir 813 e estamos recebendo 21. Agora vamos chamar esse exercício. E, na verdade, aqui vamos usar recursão porque queremos calculá-la recursivamente. Aqui podemos criar uma função Fibonacci e chegamos aqui n, que é o nosso índice aqui. Primeiro de tudo, devemos verificar se é menor que dois, porque neste caso nossos laços lógicos funcionam porque aqui temos 01. É aqui que devemos verificar, certo? Se n menos de dois, então aqui queremos devolver um. Em outros casos, devemos aplicar nossa lógica. Aqui nós simplesmente retornamos Fibonacci, e aqui estamos passando n menos dois, o que realmente significa que calculamos essa função recursivamente e cada chamada recursiva de Fibonacci, vamos chamá-la de novo e de novo até chegarmos a esta primeira condição. Aqui temos Fibonacci n menos dois mais Fibonacci e menos um. E, na verdade, esse é o código inteiro que você deve experimentá-lo. Vamos verificar isso. Vou pular para o console e aqui Fibonacci sete. E como você pode ver, estamos recebendo 21, o que realmente significa que nosso código está funcionando. Mas aqui estão algumas coisas importantes para lembrar. Como programador, você deve saber como converter fórmulas matemáticas ou alguma lógica. Em JavaScript, as funções são funções em qualquer outra linguagem, mas é totalmente bom não saber cor todas as fórmulas matemáticas. É por isso que você não deve ter medo de perguntar sobre eles. E em segundo lugar, acho que é totalmente bom perguntar em troca. Certo. Eu realmente não posso codificar, mas você está usando essas coisas todos os dias em seu projeto? E provavelmente você receberá uma resposta não. É por isso que , na verdade, não faz sentido perguntar essas coisas em primeiro lugar. 42. Palindrome: Uma pergunta mais popular que estou ouvindo muito é, por favor, escreva uma função para verificar o palíndromo. Porque na verdade é isso que os programadores estão fazendo todos os dias. Estão verificando palíndromos. Mas o que for que pudermos resolvê-lo. Na verdade, se você não sabe o que é palíndromo, esta é uma string que é a mesma desde o início e do fim. Por exemplo, se você tiver uma string completa, não é um palíndromo. Mas se você tem, por exemplo, para o string completo, é um palíndromo porque é a mesma força do Stat e do final. Então, vamos tentar isso agora. E, na verdade, é muito fácil. O que queremos fazer aqui, queremos criar uma função é palíndromo. E o que queremos fazer com um para resolver com sabedoria. E, na verdade, não faz sentido dividi-lo por letras e verificar cada letra e assim por diante. Você pode simplesmente reverter uma string e comparar. É por isso que aqui podemos escrever que nossa string é igual e podemos compará-la com a divisão de pontos de string. E aqui nós apenas fornecemos uma string vazia. Então nós o dividimos por letras agora com apenas fazer reverso, reverter em nossa matriz e, em seguida, estamos juntando-o novamente, o que realmente significa onde o inverso neste mundo e estamos comparando duas mesmas palavras. Neste caso, obteremos a mesma string se eles forem iguais. Vamos verificar o Sul aqui onde bem no palíndromo leste e estamos fornecendo insights completos e estamos ficando falsos. Mas se escrevermos foo, foo, então estamos se tornando realidade. A tarefa está resolvida. 43. Anagram: Mais uma pergunta que ouço com frequência é escrever a função que verifica se a string é um anagrama. E, na verdade, essas coisas são super parecidas com o palíndromo, como você pode ver aqui, anagramas de palavras que têm os mesmos caracteres na mesma quantidade, o que significa que duas strings são anagramas se podemos reorganizar cordas e pegar o outro. E aqui estão alguns exemplos de anagramas. Por exemplo, ouça e silencioso e assim por diante. Então, agora vamos escrever que a função é anagrama. Aqui temos anagrama ys e sabemos que estamos recebendo aqui dois pontos fortes que queremos comparar. Vamos citar o nome de 31 e transmitir dois. Então, o que queremos verificar aqui é que essas duas cordas têm as mesmas letras. Mas, para verificar isso, devemos ajustar a classificação de nossas cordas. Nesse caso, podemos simplesmente comparar as cordas por igualdade. Mas antes de tudo, gostaria de verificar aqui um comprimento, porque se tivermos um comprimento diferente nessas duas cordas, então não funcionará. É por isso que aqui, se o comprimento da nossa primeira string não igual ao comprimento da nossa segunda string, então retornamos false e não verificamos nada. E é claro que aqui deve ser bancário e não igual porque queremos verificar se eles não são iguais. A segunda coisa que queremos fazer é convertê-lo minúsculas porque na verdade podemos ter casos diferentes, mas as strings ainda são válidas. Isto é y. Vamos chamá-lo de um fio inferior. E aqui simplesmente chamamos string1 para minúsculas, e temos duas minúsculas diretamente dentro do JavaScript. Aqui Vamos nomear a string mais baixa, e estamos convertendo string para minúsculas. Agora, o que queremos verificar, queremos verificar se essas duas strings são iguais. Nesse caso, dominamos false porque eles não são anagramas. É por isso que aqui vou escrever o fluxo de string1 é igual a cadeia de caracteres dois mais baixa, então isso é falso e isso não é um anagrama. E o último, devemos escrever nossa lógica. E o que eu quero fazer, quero mais simples converter nossas strings em array do que determinado array e mesclá-lo diretamente de volta na string para este fim de semana, certo? Por exemplo, a string classificada um, e aqui vamos escrever a menor string de um ponto dividido. E aqui queremos dividir apenas por letras. E aqui estou apenas chamando tipo sem argumentos. Ele será classificado de alguma forma. E depois deste **** um para obter uma corda de volta, isso é yaqui. Junte-se nos trará de volta uma corda. Eu quero fazer exatamente o mesmo na segunda string. E aqui agora podemos compará-los porque, neste caso, classificamos todas as nossas letras na mesma direção. E agora aqui eu posso simplesmente escrever uma string classificada de retorno uma é igual a string classificada. Nesse caso, estamos comparando duas strings que foram classificadas, e já sabemos que é entrar no Chrome se forem iguais, vamos verificar isso. Estou pulando para o navegador e estamos escrevendo é anagrama. Aqui, estamos apenas fornecendo completo e Byron. E como você pode ver, é falso porque essas são duas cordas diferentes. Mas vamos agora tentar com ouvidos e silenciosos. Por exemplo. Aqui estou escrevendo lição e, à direita, estou escrevendo em silêncio. E, na verdade, estamos chegando aqui verdade, e está funcionando o que estamos fazendo aqui. Primeiro de tudo, estamos verificando se o comprimento é o mesmo. Bem-vindo aqui, temos dois pontos fortes, minúsculas, então não estamos aqui. E agora temos certeza dessas duas strings que foram convertidas em nossas matrizes, e então estamos convertendo-as de volta em strings. Neste caso, estamos recebendo algo como E e St., mas é totalmente bom porque queremos compará-los. E é assim que você está escrevendo função para comparar anagramas. 44. Encontrando vogais: Você também pode obter uma tarefa como essa. Escreva a função que conta vogais na string. E nem sempre são vogais, mas algo que você deve contar na string. E, na verdade, não é tão difícil porque a ideia principal é que primeiro devemos definir algo como uma matriz de possíveis oscilações ou possíveis símbolos. E então tente verificar cada letra dentro da nossa força. Vamos fazer isso agora. Primeiro de tudo, aqui queremos criar uma função phi e vogais, e estamos recebendo aqui string como um argumento. Agora, o segundo fígado deve definir o que nossas vogais. Aqui podemos criar uma matriz de vogais e vamos definir aqui a, e, eu, o e u. E podemos resolver com duas maneiras diferentes, ou com for-loop sempre reduzir e, na verdade, ambos estão bem. Aqui. Primeiro de tudo, quero criar um contador porque queremos aumentá-lo toda vez que encontrarmos nossa vogal, precisaria de um loop for. Então, aqui podemos escrever o personagem principal, e aqui haverá string para minúsculas. Nesse caso, temos acesso a cada caractere dentro nossa string e podemos verificar, ok, se as vogais incluem nosso caractere, então queremos aumentar nosso contador. Então, aqui vai contar mais, mais. E depois desse loop, acabamos de devolver nossa conta que criamos. Aqui. Vamos tentar encontrar os intestinos e temos alguma corda, como você pode ver aqui, estamos recebendo três vogais porque temos aqui e três vezes. E, na verdade, eu diria que esse código está bem, mas podemos escrevê-lo melhor com redução. É por isso que eu queria comentar essa contagem de leads e acompanhar diretamente aqui, retornar um reduzido. Então aqui, antes de tudo, queremos converter nossa string em minúsculas. Então, aqui podemos tentar string para minúsculas. E depois disso, queremos dividi-lo em personagens. Este é y aqui será uma string vazia dividida. Agora queremos chamar aqui de reduzir e estamos recebendo acesso, primeiro lugar ao nosso acumulador e, em segundo lugar, a cada personagem. Após essa função, queremos definir nossa contagem e ela será 0. Dentro são reduzidos. Queremos fazer exatamente a mesma lógica. Podemos retornar aqui que, se nossa matriz de vogais incluir caracteres que estamos verificando , queremos aumentar nosso contador. Aqui estamos aumentando nosso acumulador com mais um. Em outros casos, não o aumentamos e apenas devolvemos o acumulador. Vamos verificar o sal que estou recarregando a página aqui é a mesma string e estamos recebendo três. Na verdade, esse código é melhor porque antes de tudo, podemos lê-lo linha por linha. E em segundo lugar, isso totalmente puro e funcional. 45. Converter em Caso de Título: Você também pode obter uma tarefa para converter o caso do título da string. E, na verdade, pode ser complicado. É por isso que é muito bom que aqui recebemos casos de teste. Então, na verdade, devemos criar um caso de título de função. E quando somos fornecidos dentro, sou um pequeno bule. Devemos retornar uma string e ela deve ser capitalizada. E como você pode ver, cada palavra aqui é capitalizada, não apenas a primeira palavra, e isso é importante. Também. Não importa como fornecemos nossa string, ela deve ser capitalizada corretamente. Vamos construir essa função agora. E, na verdade, temos duas possibilidades aqui que podemos usar for-loop over, podemos usar métodos JavaScript nativos. Então, antes de tudo, vamos escrevê-lo usando for-loop. Aqui estamos criando um método de caso intitulado e estamos recebendo string como um argumento. Primeiro de tudo, queremos criar aqui uma matriz. Temos todos os personagens aqui. Podemos escrever aqui que nossa string é igual a string a divisão minúscula, e aqui haverá um espaço. Então, na verdade, aqui estamos escrevendo array dentro da string. E, na verdade, estou escrevendo código assim porque quero mostrar como você não deve escrever seu código. E não se trata apenas de lógica aqui que estamos usando o loop for, mas consideramos o que você está fazendo, como você pode ver, em primeiro lugar, a má prática aqui é usar o mesmo argumento como temos aqui. Substituiu nosso argumento dentro, o que significa, antes de tudo, podemos modificá-lo. Sim, não é o caso da string, mas será assim. Com matrizes há objetos porque estamos mais definidos em uma referência. Em segundo lugar, aqui estamos voltando ao array, mas aqui estamos escrevendo em tal fluxo, o que o torna confuso. E ambas as coisas que você não deve fazer em seu código ou em entrevista. Porque com isso você está mostrando que está escrevendo código de incorporação. Uma abordagem muito melhor aqui será criar um array de propriedades adicional ou o que você quiser. Aqui estamos recebendo uma string para dividir minúsculas e estamos totalmente bem. Depois disso, devemos escrever para loop aqui podemos escrever simplesmente nativo for-loop, o que eu também não aconselho. Então aqui podemos escrever var I igual a 0, eu menos que o comprimento da string. E aqui eu mais, mais. E, claro, aqui não é fluxo, mas nosso array. Então aqui dentro agora podemos mutar todos os elementos. Assim, podemos escrever aqui a matriz que eu é igual, e aqui temos o mesmo caractere de ponto de elemento em 0. E, na verdade, o que ele faz, é preciso o primeiro elemento do nosso fluxo. No nosso caso, cada elemento de nossa matriz é uma string. E aqui estamos recebendo a primeira letra para que possamos capitalizar, foi assim em maiúsculas, o que também é um método nativo dentro do JavaScript. E aqui podemos escrever uma fatia de ponto i um. E neste caso estamos recebendo todos os nossos elementos da string, exceto da primeira letra. Isso é o que queremos. Queremos capitalizar a primeira letra e depois pegar todas as outras letras. E depois disso, podemos simplesmente unir nossa matriz. Estamos aqui, retornamos a junção de matriz, e estamos unidos, por espaço. Agora podemos escrever aqui o log do console, onde dois pontos aqui no caso foram fornecidos dentro da nossa string. Sou um pequeno bule. Vamos verificar se está funcionando. Estou recarregando a página e recebendo sou um bule de chá, o que realmente parece bem e resolvemos a tarefa. Mas antes de tudo, usamos aqui menos quatro. E, como eu disse anteriormente, não é a melhor abordagem se estivermos percorrendo cada elemento da matriz, pelo menos você deve usar para rich, para array e não quatro nativos, então seu código será melhor. A segunda coisa que eles não gostam aqui é que estamos substituindo cada elemento do nosso array, o que realmente significa que não estamos criando uma nova matriz, mas estamos substituindo o anterior. E também não é a melhor abordagem. Isso é y. Vamos reescrever todo esse código apenas usando métodos JavaScript simples. Porque, na verdade, aqui nem precisamos de loop FOR. O que eu queria fazer aqui, quero pegar nossa string e quero convertê-la em minúsculas. Isso foi totalmente bom. Depois disso, queremos dividi-lo com espaço. Isso também foi totalmente bom. Mas depois disso podemos usar o mapa porque essencialmente, o que estamos fazendo aqui é um mapa. Queremos alterar cada elemento dentro da matriz. É por isso que estou chamando mapa e estamos chegando aqui nosso conselho. E, na verdade, como você pode ver, está mais claro agora porque estamos usando o mundo da propriedade e não alguma IA ou array onde não sabemos do que estamos falando. E aqui queremos fazer exatamente o mesmo caractere de ponto de palavra em 0. Então, estamos recebendo o primeiro elemento. Aqui estamos usando letras maiúsculas, e aqui estamos usando mais, e pegamos todas as outras letras com fatia de ponto de palavra e aqui está uma. E, como você pode ver, esse código é essencialmente o mesmo. Não mudamos isso, mas é muito mais eficiente, mais fácil de ler. E isso mostra que você é um desenvolvedor mais avançado, porque aqui não estamos usando for-loop, mas mapa, o que não é tão difícil. E aqui estamos apenas retornando para cada palavra em seu trabalho. E é importante aqui mencionar que o personagem adicionar e cortar não sofrer mutações nas funções, o que significa que estamos recebendo fluxo juvenil e não sofremos mutação do Alt stream. Vamos verificar isso. Eu sou o Senhor nesta página e estamos recebendo nossas cordas capitalizadas, que significa que eu esqueci no final de fazer nosso gigante aqui, podemos simplesmente chamar que eu iria unir com o espaço dentro. Vamos verificar isso e estamos recebendo exatamente a mesma string. Portanto, recomendo vivamente que você no entrevistador assista sua nomeação, verifique se seus tipos de dados são combinados com seus nomes e facilite a leitura do código se for possível. 46. Converta a entrada de tempo dada em formato de 12 horas para 24: Aqui está mais uma tarefa que requer um pouco de pensamento. E como você pode ver, devemos escrever a função que pode converter a entrada de tempo dada no 12 horas para o formato de 24 horas. Aqui temos casos de uso. É por isso que é mais fácil para nós verificar se estamos cobertos tudo corretamente. Então, vamos tentar criar essa função. E mais uma vez, isso não é uma função que você pode resolver em trinta segundos. Então você pode tomar seu tempo e pensar um pouco sobre isso. Vamos criar aqui converter para o formato 24 horas. E estamos recebendo texto de tempo aqui. E, na verdade, o que eu queria fazer aqui primeiro, quero convertê-lo em minúsculas, porque na verdade aqui teremos AM e PM e queremos ter certeza de que eles são minúsculos. É por isso que aqui podemos tentar o tempo para xt mais baixo. E aqui queremos chamar texto de tempo para minúsculas. A segunda coisa que eu quero fazer é obter horas e minutos separadamente. O que eu quero escrever aqui é a divisão da tecnologia de tempo mais lenta e queremos dividi-la por coluna porque na verdade temos dois pontos em cada caso. E à esquerda temos nossas horas, e à direita temos minutos. E, na verdade, aqui eu quero fazer uma destruição e uma tarefa aqui diretamente. Quero ter em primeiro lugar nossas horas e segundo minutos. Nesse caso, estamos criando duas variáveis locais. Se você não quiser escrever assim, você pode nomeá-lo com alguma variável de temperatura T e, em seguida, basta ler esta variável temporária ponto horas e minutos. Mas aqui chegamos a coisas difíceis. Como você pode ver, às vezes temos apenas um único dígito e às vezes temos dois dígitos. Mas também temos um caso em que temos zeros no início. Aqui. Também temos mais um caso que precisamos cobrir. Se tivermos aqui 12 como nosso, então devemos convertê-lo em zeros 0. É por isso que eu queria escrever exatamente essa lógica. Então, o tempo da véspera marca pontos e largura mais lentos e, na verdade, termina com Israel. Uma boa função em JavaScript que está verificando o tostring está terminando com alguma coisa. Aqui podemos verificar AM porque, na verdade, sabemos que aqui temos 12 da manhã e isso significa que devemos convertê-lo em dois zeros. É por isso que aqui eu quero escrever nossos iguais, e aqui estamos verificando se nossas horas iguais a 1212 como uma string, porque aqui estamos divididos em nossa string, então queremos aqui obter 0. Em outro caso, estamos chegando aqui horas. E como você pode ver, em primeiro lugar, escrevi aqui um único 0 e não dois zeros. E isso também é importante. Aqui eu apenas atribui horas diretamente, o que significa que nós cobrimos essa lógica para obter um único 0 e em todos os outros casos apenas conseguiríamos o que recebemos. Se for cinco, estamos recebendo cinco. Se for 01, obteremos 01. Nós cobrimos nosso AMK é agora que eu queria cobrir o caso PM. É por isso que aqui podemos escrever outra coisa e até mesmo qualquer outra vez porque queremos verificar o PM. E aqui podemos escrever tempo tecnologia ponto e largura mais lentos, e aqui estamos recebendo nosso PM. E neste caso, queremos aplicar lógica diferente. Queremos atribuir aqui nossas horas e queremos verificar se nossas horas são iguais a 12, porque este é novamente outro caso. Neste caso, queremos aplicar aqui horas, ou queremos escrever aqui string e dentro de mais horas últimas 12. Este código está fazendo um alto, como você pode ver aqui, eu escrevi mais horas, o que ele realmente faz, estamos recebendo nossas horas como uma string. Então, digamos que estamos chegando aqui 12. Agora, se eu vou escrever aqui mais no início, estamos chegando aqui diretamente o número de uma string, o que realmente significa que estamos convertendo isso número e, em seguida, ganhamos mais 12. Por que isso? Porque vamos dizer que aqui estamos verificando PM, por exemplo, este caso com 01, e aqui estamos verificando, Ok, horas são iguais a 12, Não, Então queremos fazer 01 mais 12. Vamos verificar o Sul como será. Então, estamos chegando aqui 01 e, na verdade, ele é convertido em um. E agora, depois disso, estamos recebendo mais 12 e estamos entrando em lata, o que significa, na verdade, adicionando 12, estamos convertendo-o para o horário correto da PM. E se tivermos 12 horas assim, simplesmente deixamos como 12. Então, na verdade, aqui poderíamos escrever 12 sobre, poderia apenas levar nossas horas. Então, o que eu quero fazer agora, quero verificar o que estamos recebendo dentro de horas. Então aqui eu quero registrar nosso formato Convert to 24 horas, e aqui estão nossos textos de tempo e nossas horas. E agora eu quero copiar todos esses casos e apenas executá-los. Nesse caso, podemos verificar se eles estão funcionando corretamente. Estou recarregando a página e estamos recebendo atribuição para constante, variável. E como você pode ver aqui, estamos tentando sobrescrever o nosso. E é claro que é proibido. É por isso que aqui devemos escrever LED. Vamos verificar isso. Estou recarregando e estamos recebendo 412045512120113. Aqui temos o PM 11231022, o que realmente significa que nossa lógica por horas está correta. Depois disso, devemos adicionar um 0 à esquerda em todos esses casos. E como você pode ver, às vezes não precisamos disso e às vezes devemos tê-lo e podemos resolvê-lo facilmente com mais uma função JavaScript simples. Podemos escrever aqui, o nosso ponto pad começa. Aqui. Nós podemos fornecer para 0. O que ele faz é que você pode ver aqui que ele encaixa a string atual com outra string várias vezes, se necessário. que realmente significa que aqui estamos fornecendo ferramenta, o que significa que teremos dois símbolos e aqui temos 0, o que realmente significa que se não tivermos um símbolo lá, então colocaremos 0 dentro. E, na verdade, agora eu quero copiar essa parte e apenas colocar dentro do nosso log do console para verificar se ela está funcionando. Estou recarregando a página e, como você pode ver agora, estamos recebendo a hora correta. Então aqui temos dois zeros, 05, e então todos são números corretos. Agora devemos implementar nossos minutos e, na verdade , é muito mais fácil. Primeiro de tudo, apenas para lembrá-lo, dentro de minutos também terá PM e TM e devemos nos livrar disso. É por isso que podemos escrever aqui diretamente significa fatia de ponto e aqui estamos usando 0 menos dois. Nesse caso, vamos nos livrar de dois símbolos, AM ou PM, e teremos apenas minutos aqui. E depois disso, quero usar o fio PET, assim como fizemos anteriormente. E aqui também serão 20. Neste caso, vamos verificar, ok, se tivermos aqui oito, então devemos obter aqui pseudo-auxílio. Se tivermos aqui dois dígitos, então está totalmente bem. Agora podemos simplesmente remover esse log do console, mas não precisamos mais dele. E, na verdade, aqui em todos os casos, quero escrever o log do console. Isso é y. Vamos mudar isso. Agora. Quero escrever aqui o log do console e, em seguida, abri-lo. E aqui temos convertido. E vamos fechar foi o suporte. Agora temos todos os nossos casos. Vamos verificá-los. Estou recarregando a página e estamos recebendo nosso tempo, e está parecendo totalmente bem aqui, por exemplo, temos zeros minutos 0 a 35508 e assim por diante. Mas o problema é que esquecemos de colocar uma coluna entre eles. É aqui que aqui devemos escrever mais e entre eles basta colocar uma corda com dois pontos. E como você pode ver agora, estamos recebendo um bom momento no formato de 24 horas. E, na verdade, do meu ponto de vista, é difícil resolver essa tarefa em cinco ou dez minutos. Você realmente precisa sentar lá como talvez 15 minutos ou meia hora para verificar casos diferentes, como você quer resolvê-lo e assim por diante. Portanto, esta é uma boa tarefa para verificar como você pode converter coisas diferentes entre elas com lógica diferente. Mas não é algo que você possa resolver em um ou dois minutos. 47. Dados de mapeamento: Aqui está mais uma tarefa para você , que é tirada do projeto real. Isso não é apenas algumas tarefas para a entrevista, mas as tarefas que você verá em sua vida cotidiana. E como você pode ver, onde deve mapear os dados para a frente e o formato, que realmente significa que estamos recebendo nossos dados, por exemplo, do back-end, e não informá-los como queremos. É por isso que queremos convertê-los. O elemento principal é a chave de localização, e precisamos mapear todos os dados para ele, e teremos cinco objetos. Como você pode ver aqui. Primeiro de tudo, temos uma matriz de localização, e aqui temos dois objetos. Primeiro de tudo, chave de localização e este é o nosso identificador exclusivo. E temos aqui algumas ideias e o exterior atribui exatamente o mesmo no segundo objeto. E agora aqui temos uma taxa configurada em massa. Essa também é a matriz com objetos. E dentro de cada objeto, temos valores de dados e manutenção de conflitos. O ponto principal é que estamos mapeando eles um para um, que realmente significa que o índice 0 na matriz de localização é igual ao índice de configurações em massa 0. E neste caso, precisamos mapear tudo para a estrutura. No final, devemos obter uma matriz de objetos com, antes de tudo, chave de conflito. Esta é essa parte e localização mais perto de dois, como você pode ver, localização kids a22 é essa parte e também externa atribuída a partir dela, o que realmente significa que um segundo elemento também será conflito Kit de localização 100 quando T2, este é o nosso segundo número e em seguida, atribuição externa e assim por diante e assim por diante. E diz-se que o ID único rápido é esse, o que realmente significa que estamos recebendo aqui 12345 objetos. Então Advento, devemos ter uma matriz com cinco objetos. Agora vamos tentar escrever essa lógica e na verdade, não teremos nada complicado aqui. É tudo sobre mapeamento de dados. Vamos tentar aqui. Nosso resultado, como eu quero fazê-lo resulta diretamente em loops de forma eficiente. E eles não vão trabalhar com a localização só porque dentro temos nossas IDs exclusivas. E aqui dentro do local estamos obtendo mapa, o que realmente significa que estamos percorrendo esses objetos. Aqui dentro do mapa. Estamos recebendo elemento de localização e também estamos recebendo aqui índice. É por isso que devo colocar colchetes adicionais aqui. Localização n, o índice é o que precisamos. Agora, dentro, podemos fazer nossa magia porque agora dentro do elemento de localização, eles estão recebendo todos os objetos que queremos aqui, um mapa toupeira, porque dentro do nosso elemento de localização, queremos fazer um loop através da nossa chave de localização. É por isso que aqui podemos retornar nosso elemento de localização, e aqui temos nossa chave de localização. Aqui também tenho um mapa e temos acesso à nossa chave de localização. E como você pode ver, eu escrevi com CamelCase porque estamos certos no código JavaScript e normalmente todas as nossas variáveis são CamelCase. Agora, aqui dentro, queremos devolver o que precisamos. Primeiro de tudo, precisamos aqui da chave de alocação. É por isso que aqui estou escrevendo a chave de localização. Podemos deixá-lo com sublinhado como de back-end, superar, convertê-lo em maiúsculas só depende do que você quer. E aqui estamos apenas atribuindo nossa chave de localização. Depois disso, devemos obter nossa chave de conflito. Isso é extremamente fácil de fazer porque aqui dentro de um conflito em massa, podemos apenas obter essa chave de conflito por índice. É por isso que aqui podemos escrever índice de configuração do Bow porque é o mesmo lago e valores de dados de ponto de localização , chave de configuração de ponto. E a última parte é o sinal delta de atribuição externa. Estamos recebendo o elemento de localização dentro pontuar um sinal. E foi assim que remapeamos o que precisávamos. Então, antes de tudo, temos um mapa através da nossa localização, através do assunto. E em um mapa temos para nossa chave de localização. É por isso que, para cada ID exclusivo, podemos mapear os dados que precisamos. Vamos verificar isso. Vou escrever o bloqueio do console aqui nosso resultado, e vamos verificar se ele está funcionando. Estou recarregando a página e obtemos uma série de matrizes. A primeira matriz que estamos recebendo aqui, chave de localização configurada ao ar livre, atribuir e tudo é bom. O único problema que temos é que obtemos uma matriz de matrizes, mas na verdade queremos uma matriz plana. É por isso que devemos fazer algo com esse código. Podemos usar aqui reduza para criar apenas uma matriz plana porque não temos método nivelado nativamente dentro do JavaScript. Aqui temos nossa matriz e o acumulador. E no início podemos dizer que estamos recebendo uma matriz vazia. O que queremos fazer dentro é usar catenate array.com. E aqui estamos concatenados e isso era acumulador. O que é feito aqui por padrão, temos aqui uma matriz vazia e temos cada array que você pode ver aqui. E queremos concatenar nossa matriz com o acumulador. Então, essencialmente para cada elemento, estamos concatenando com nosso acumulador. Vamos verificar isso. Estou recarregando a página e estamos recebendo nossa matriz fugida com assuntos. E é assim que você mapeia dados, por exemplo, do formato de back-end para o nosso formato front-end. 48. Substituir parâmetros em URL: Você também pode obter uma tarefa como essa. Crie uma função para substituir parâmetros no URL. E, na verdade, essa é uma tarefa do mundo real porque aqui temos uma URL inicial, como se fosse gerada em roteadores antigos para todas as estruturas front-end. E neste caso, temos barra de URL inicial, barra e aqui coluna post ID do comentário da barra do comentário da barra do AD, que significa que esses dois parâmetros com colunas serão substituídos por IDs em algum momento mais tarde. E, na verdade, demonstrar que uma função substitui params no URL onde podemos lançar dentro do URL com essa estrutura e matriz de substituições. E como você pode ver dentro de cada objeto que devemos fornecer de e para, por exemplo, de pós-Covid significa que devemos substituir dois pontos do post AD por id1, e aqui comentou com 83. E, claro, essa função deve ser genética. Não é apenas para postagens e comentários, mas para quaisquer substituições dentro do URL. E, na verdade, antes de começarmos a resolver, quero mostrar mais uma coisa, como você pode pensar em resolver problemas. Por exemplo, você pode escrever algo como lista de tarefas. E neste caso, estamos tentando pensar em etapas sobre o que queremos implementar. Por exemplo, qual será o primeiro passo aqui? Como você vê, temos uma matriz de nossas substituições, o que realmente significa que temos uma função com dois argumentos. E, na verdade, queremos percorrer cada substituição e aplicar essa substituição ao nosso URL. Então, na verdade, aqui podemos escrever passar por substituições. O segundo talvez seja substituir partes de cada substituição. A última coisa que estaremos aqui, volte em seu stream. Essa lista, neste caso pode parecer uma coisa óbvia, mas pode ajudar se você escrever algo assim para implementar uma lógica mais complexa. E, na verdade, deseja implementar aqui uma solução correta. E podemos usar reduzido para isso porque é enorme nosso código melhor. Mas também quero mostrar o único problema que você pode fazer. Na verdade, aqui queremos criar nossa função, substituir parâmetros em URL, e estamos recebendo aqui URL e nossa lista de substituições. E, na verdade, o que queremos virar aqui é reduzido para nossas substituições, redução de pontos de substituição. E aqui temos nossa função com acumulador e cada uma de substituição. Esse valor inicial temos aqui nosso URL, porque é isso que queremos mudar. Agora, aqui dentro da função, devemos retornar string atualizada. E para isso podemos usar uma função JavaScript simples que é chamada de substituída. E, na verdade, aqui você pode tentar desenhar assim. Você pode pensar, Ok, eu tenho um URL, podemos simplesmente escrever aqui, URL é igual a substituição de pontos de URL. Aqui estamos substituindo em primeiro lugar, coluna mais ponto de substituição de, e estamos mudando para ponto de substituição t2. É isso. E depois disso, queremos retornar nosso URL. E, na verdade, esse código parece correto. E agora eu quero mover nossa URL inicial e os resultados aqui para a parte inferior e escrever o URL do resultado do log do console. E vamos verificar o que temos. Estou recarregando a página e estamos recebendo exatamente barra pós barra um, slash common slips três, o que realmente significa que essa lógica com redução está funcionando corretamente. Estamos percorrendo cada substituição. Aqui atualizamos nosso URL e aqui nós o devolvemos e não parece bom, mas na verdade você tem aqui um grande problema. Como você pode ver, minha variável acumuladora não está destacada, o que realmente significa que não estamos usando aqui reduzir corretamente e não estamos usando acumulador. O que estamos usando, estamos usando esse URL de parâmetros e com a mutação direta desse URL toda vez. E, na verdade, isso é completamente errado , antes de tudo, porque não devemos mudar nossos parâmetros. E em segundo lugar, a parte mais importante que estamos usando aqui reduz como um loop for-loop porque na verdade simplesmente mudamos nossa variável de fora no loop e não estamos usando nosso acumulador. Na verdade, o código correto aqui não é substituído, mas simplesmente retorna a substituição acumulada. Porque, como você pode ver, fornecemos aqui o trilho aqui como um valor inicial e não devemos usar o URL aqui dentro. Não queremos alterar nosso URL. Queremos sempre atualizar nosso acumulador e retornar em novo acumulador. Como você pode ver, esse código está funcionando exatamente da mesma forma, mas isso é completamente diferente. Anteriormente, se você escrevesse código assim, isso está completamente errado na entrevista porque você não está usando reduzido, reduzido, mas assim como for-loop, o mesmo acontece com o mapa. Se você estiver usando o mapa apenas para percorrer as coisas que você está fazendo uma tendência com o mapa, você precisa transformar sua matriz e devolvê-la. 49. Mensagens de validação: Você também pode obter uma pergunta como essa para mensagem de validação de back-end MOD para frente e formato. E, na verdade, esse é um exemplo real porque às vezes estamos recebendo mensagens de validação de back-end, não no formato como é adequado rapidamente no front-end para nossos formulários JavaScript. É por isso que aqui estamos recebendo nossos erros de back-end nesse formato. Temos aqui um objeto com chaves e cada chave é uma propriedade do back-end. Nosso campo que estamos validando, por exemplo, e-mail. E aqui nós preenchemos erros, e isso é o que está interessado em erros de arquivos é uma matriz de objetos. E dentro de cada objeto, temos propriedade de mensagem com alguma mensagem. Por exemplo, aqui temos senha com dois erros. Isso é o que aqui é uma matriz com dois objetos. Aqui está a mensagem deve conter símbolos em diferentes casos e deve ter pelo menos oito símbolos de lente. O que queremos fazer neste exercício, queríamos convertê-lo para nossa frente e formato. Esta é apenas uma matriz planar com strings e cada fluxo é nossa chave. Então nosso e-mail alimentado, e agora temos todos os nossos erros concatenados como por exemplo, não podem ficar em branco. E se tivermos dois deles, simplesmente os concatenamos com vírgula. Então, na verdade, você pode resolvê-lo de maneiras diferentes, mas eu recomendo usar um objeto entre aqui. Podemos simplesmente escrever aqui entradas de ponto de objeto e fornecer dentro de nossos erros de back-end. E, como você pode ver, estamos obtendo um formato tão bom como uma matriz de matrizes. E cada matriz aqui é antes de tudo, siga uma chave e o valor é o que tínhamos aqui. Portanto, temos um valor com erros e por dentro temos nossos erros. E esse é um formato muito confortável para funcionar para nós porque não podemos chamar mapa em JavaScript no objeto. É por isso que o que queremos fazer aqui, queremos antes de tudo, criar alguma propriedade normal pode ser erros de back-end legíveis por humanos. E agora queremos chamar aqui entradas de ponto de objeto. E queremos fornecer dentro de nossos erros de back-end. Na verdade, agora temos uma matriz de matrizes e podemos mapear aqui todos os valores. E você já viu o que chegamos aqui. Estamos recebendo uma matriz com e-mail como chave e algum valor. E, na verdade, aqui eu quero usar essa estruturação regular para obter antes de tudo o nosso loop chave e segundo, estamos recebendo nosso valor. Essa é a maneira mais fácil de usar o mapa no objeto. E aqui estamos recebendo em primeiro lugar, nosso campo e, em segundo lugar, valor com os erros. É por isso que devemos preparar nossos erros. Nesse caso, vamos nomeá-los, por exemplo, mensagens de campo e devemos concatená-las. Assim, podemos escrever aqui erros de ponto de valor. Então, estamos recebendo nossa série de erros. E agora aqui precisamos mapear cada erro. Aqui estamos chamando mapa sem erros e queremos retornar a mensagem de erro. E como você pode ver aqui, isso é verdade. Temos aqui uma matriz com objetos e cada objeto contém nossa mensagem. Aqui estamos apenas mapeando essas mensagens. E depois desse grupo queria obter o nome deles. Aqui vou colocar juntar vírgula e espaço porque nascemos para ter uma boa corda legível. E depois disso, simplesmente precisamos retornar nossa string porque estamos dentro do mapa aqui. Eu quero usar aqui o script ECMO sexta string, e dentro eles queriam fornecer nossa chave. Mas aqui está o problema. Como você pode ver, ele está sempre em maiúsculas. Primeiro de tudo, devemos capitalizá-lo e já fizemos isso em vídeos anteriores. É aqui que podemos nomear o campo capitalize e, na verdade, acho que preencha esse nome melhor. Então, vamos renomear nossa chave para campo. E agora aqui devemos chamar em campo, antes de tudo caractere em 0. Neste caso, somos tomados nosso primeiro elemento e queremos concatenar que foi preenchido fatia de pontos. E aqui estamos colocando um, foram cortados em um símbolo. Nesse caso, é nosso nome em maiúsculas do campo. Agora aqui devemos fornecer esse campo em maiúsculas, e aqui D é importante. Em outro caso, podemos pensar que esta é uma função e depois disso foi simplesmente colocado espaço na coluna. E aqui nossas mensagens de campo. O que estamos fazendo aqui, estamos mapeando nossas entradas de objetos onde obtendo diretamente nosso campo e valor. Primeiro de tudo, estamos nos juntando às nossas mensagens de campo. E em segundo lugar, estamos capitalizando nosso campo e agora estamos retornando stream para cada erro. Vamos verificar isso. Estou recarregando nossa página e vamos verificar o que temos dentro de erros legíveis por humanos. E, como você pode ver, esta é nossa boa matriz no formato correto. Então, temos aqui strings para cada campo e capitalizamos o nome de cada campo. E aqui juntamos nossos erros, o que significa que somos bem-sucedidos para resolver esse problema e transformar dados no formato correto. 50. Lista aninhada: Você também pode obter uma pergunta como essa. Transforme a lista simples em lista aninhada. E isso é algo super real. Normalmente, a partir do back-end, você está recebendo todos os dados como uma lista simples e normalmente, esses dados podem ter filhos uns dos outros. que realmente significa para nós no front-end, não é confortável renderizar esses dados. Podemos simplesmente ir com o loop for porque temos filhos. Precisamos antes de tudo renderizar em pequenos níveis e, em seguida, para cada elemento, encontrar seus filhos e renderizá-los. É por isso que normalmente você deseja transformar seus dados de lista simples para lista aninhada apenas uma vez. E isso é exatamente o que devemos fazer neste vídeo. Como você pode ver aqui, temos nossa lista simples e cada elemento é um objeto. Temos um ID exclusivo, algum nome e dados pais. E antes de tudo, é importante porque este é nosso identificador exclusivo e, em segundo lugar, ID pai e pode ser adicionado de outro item. Por exemplo, aqui, pai um, este é esse item. Portanto, esse objeto é pai desse item. E, em segundo lugar, os dados pai podem ser nulos se este for um elemento raiz e não tiver um pai. Então, como você pode ver aqui, temos dois elementos raiz com ad1 e dois. Agora temos um D3, que é o filho do pai edu one. Então este é o segundo nível. É aqui que o nome dele nível dois, item três. Então você entende o nível. E agora temos um padrão, que aparentemente é D três, o que realmente significa que este é um filho desse elemento e, na verdade, esse pai três é esse. É por isso que é nível três, item quatro. E aqui temos o ad5, que na verdade é filho do pai D dois, o que significa esse item e na verdade, é assim que normalmente estamos obtendo dados do back-end. Agora devemos transformá-lo em tal formato. Então, temos uma matriz plana com apenas dois elementos. Então, como você pode ver aqui, temos dois objetos objeto com 81 e o objeto com ad2 porque eles são ambos através elementos e seus dados pai são agora. Agora, dentro, temos uma nova propriedade para crianças. E isso é exatamente crianças que são mapeadas por dentro. E aqui, como você pode ver, temos ad3 e também crianças dentro porque na verdade ad4 está aninhado dentro D três e exatamente o mesmo que temos aqui. Temos dentro de D dois filhos e aqui ad5 e crianças. E omiti os nomes aqui porque eles não são importantes para o entendimento. Mas, obviamente, você pode ter todas as propriedades adicionais aqui. E como você pode ver no último nível, um, você não tem filhos. Então entramos aqui, crianças, matriz vazia. Portanto, nossa tarefa agora é transformar a lista simples em lista aninhada. E como o ancião disse anteriormente, para algumas pessoas é muito mais fácil apenas tentar apontar como elas vão resolvê-lo e depois apenas codificá-lo. É por isso. Vamos tentar fazer isso agora. Então, antes de tudo, vou escrever aqui para fazer o que estamos fazendo. O primeiro ponto é livrar-se de elementos porque é isso que queremos renderizar. Vamos tentar, assim, obter os elementos raiz. Portanto, devemos ter uma matriz de nossos elementos raiz. O segundo ponto é verificar todas as crianças e entender se nossos dois elementos têm filhos. Se não, então simplesmente os devolvemos hoje. Se sim, precisamos recursivamente encontrar crianças. E devemos fazê-lo recursivamente porque precisamos verificar cada elemento e verificar se ele tem filhos. Então podemos escrever aqui algo assim. Verifique as crianças se elas têm filhos. E agora o próximo ponto será, se não, então apenas devolvemos o item com filhos vazios. E o número quatro aqui é, se sim, então queremos ir para o número dois, o que realmente significa que estamos fazendo o número dois recursivamente até que estejamos no final de nossos elementos. Agora vamos tentar escrever o código. Então, antes de tudo, quero atribuí-lo à nossa lista aninhada. E o que eu quero fazer, quero pegar nossa lista plana e encontrar pequenos elementos. E para isso, podemos usar o filtro porque queremos encontrar todos os elementos onde nosso ID pai está agora. Nesse caso, podemos simplesmente dizer que temos nosso item e o ID dos pais do ponto do item é igual a nulo. Então, estamos prontos para ir. Vamos verificar isso. Hora de carregar na página. E agora temos nossa lista aninhada. Como você pode ver, temos nossa matriz de objetos. E aqui temos 81 e 82 porque seus pais. Estes são agora. Isso é exatamente o que queríamos. Depois disso, quero apenas escrever esse mapa e dentro da função quando crianças. Por que estou fazendo assim? Porque, na verdade, essa função será chamada recursivamente e seria uma função completamente sem estado, o que realmente significa que devemos chamar essa função em qualquer item e ela deve funcionar. Isso é o que eu quero criar aqui. Nossa função ADD children e recebemos aqui um item , mas não precisamos de mais nada, porque aqui temos nossa lista simples no topo. Se você não o tiver disponível na parte superior, talvez você possa obter aqui um segundo argumento, uma lista simples em seu código, mas estará em seu projeto real. Aqui temos acesso à nossa lista fugida. Então, o que estamos fazendo aqui, estamos percorrendo nossos elementos raiz e estamos mapeando em crianças, o que realmente significa se quisermos adicionar filhos a cada elemento de rota. Então, antes de tudo, devemos encontrar nossos filhos. Então, vamos aqui, crianças. E sabemos que nossos filhos são apenas uma lista simples, que é filtrada por dados pais, onde ID é igual a ID do ponto do item. Então, vamos fazer isso. Agora, simplesmente pegamos uma lista simples, filtro de pontos, e aqui temos nosso filho e vamos nomeá-lo, por exemplo, item filho e queremos verificar o ID pai do ponto do item filho igual ao ID do ponto do item do caso. Nesse caso, estamos encontrando todos os nossos filhos. Vamos console.log o que temos aqui. Então, estou apenas escrevendo crianças sublinhadas na página. E como você pode ver aqui, temos um único elemento, porque este é um filho do elemento fotográfico com um D1. E aqui também temos mais um filho de fruto elemento com pai 82, o que realmente significa que ele está funcionando corretamente. O próximo ponto é verificar se temos filhos. Então aqui podemos escrever. Se nossos filhos durarem maiores que zero, então devemos fazer nossa magia recursiva porque precisamos não apenas de ter filhos de crianças, mas devemos fazê-lo recursivamente. O que eu quero fazer antes de criar um rapaz de propriedade foi próprio para as crianças e eles querem atribuir aqui matriz vazia porque, na verdade, se não estamos dentro do SIF, não precisamos mudar qualquer coisa. Simplesmente precisamos devolver crianças vazias. E como você pode ver, atribuí por padrão matriz vazia aqui para que possamos retornar aqui objeto atribuir e aqui estou eu. Certo, um objeto vazio depois vírgula, item, vírgula. E aqui estão nossos filhos. Crianças aninhadas. Por que eu escrevi assim? Porque, na verdade, se você usar aqui push ou apenas com armazenado, você está dizendo que aqui estão nossos filhos aninhados. Em seguida, você mudará o item, que significa que você mudará esse item dentro da lista simples porque temos uma referência de objeto. Não queremos isso. Nós simplesmente queremos retornar seus dados. É por isso que estou usando aqui objeto atribuir com objeto vazio. Depois disso, estamos usando nosso item, então copiamos todas as propriedades do nosso item dentro desse novo objeto e fomos registrados aqui em seus filhos de propriedade, o que é nosso tipo para as crianças. E neste caso, simplesmente deixamos as crianças aninhadas esvaziarem objeto. Vamos verificar isso. Hora de carregar na página. Aqui está nossa lista aninhada. E como você pode ver, agora temos uma matriz vazia de filhos porque na verdade não escrevemos nenhuma lógica para esta véspera. É por isso que simplesmente retornamos dados em tal formato ID ID pai na verdade, todos os campos e, adicionalmente, filhos. E como você pode ver, temos aqui apenas dois elementos, o que realmente significa que tudo está funcionando corretamente e devemos apenas chamar recursivamente aqui nosso código. Então, o que queremos fazer aqui, queremos examinar cada criança e ligar para a função de crianças nesta criança. Assim, podemos atribuir aqui nossos filhos aninhados. E isso é apenas nossos filhos, esse mapa. E temos acesso a todas as crianças. E estamos chamando isso de crianças com nosso filho. Então, o que está acontecendo neste caso? Por exemplo, encontramos a criança. Estamos verificando aqui, ok? Temos um filho em, digamos, crianças. E aqui estamos mapeando nosso array. E para cada elemento único chamavam para crianças a parte mais importante que foram Colin isso funciona recursivamente. Primeiro de tudo, chamamos isso aqui dentro do elemento raiz. Agora aqui dentro das crianças estava Colin era mapa. E quando nós estávamos chamando aqui eram filhos de frango dessa criança, o que realmente significa que ela vai recursivamente até que não tenhamos filhos e simplesmente não vamos para essa condição. Então, por exemplo, no nosso caso, aqui estavam Colin três vezes. Primeiro de tudo, para você fazer um, então para ID3 e, em seguida, por um padrão. E é exatamente por isso que precisamos recursão aqui. Vamos verificar isso. Hora de carregar na página. Vamos verificar nossa lista aninhada. E como você pode ver, agora temos filhos. E dentro do item um, temos apenas uma criança com ad3, e também temos uma propriedade infantil dentro e temos mais um filho aqui, nível três, item quatro, e temos filhos vazios porque, na verdade, nossa recursão terminou e simplesmente chegamos aqui crianças vazias e nós as atribuímos aqui. Então, mais uma vez, antes de tudo, devemos obter todos os elementos da nossa estrada. Em segundo lugar, temos de criar uma função que podemos chamar recursivamente em qualquer elemento. E estes são nossos filhos. Agora, por dentro, as crianças estavam, em primeiro lugar, tentando encontrar todas as crianças do item e, em segundo lugar, urso frango. Se precisarmos fazer recursão para nossos filhos, se tivermos alguma. Se sim, então somos Colin em crianças recursivamente. Se não, simplesmente fazemos um objeto atribuir e o retorno aqui nossos filhos. Então, é assim que você costuma fazer isso no projeto real. 51. Trabalho de casa: Você concluiu meu curso com sucesso sobre a preparação para a entrevista JavaScript. E eu acho que você é incrível se você terminar juntos, implementamos 59 perguntas de entrevista em JavaScript. E, na verdade, muitos deles não foram fáceis se você não experimentasse sozinho, mas apenas seguisse o empréstimo. Você ainda pode fazer isso. Você pode simplesmente escolher um vídeo aleatoriamente e tentar implementá-lo sozinho, mesmo que você o tenha visto uma vez, faz muito sentido tentar fazê-lo. Além disso, eu só queria lembrá-lo de não estar deprimido. Se você falhar na entrevista, ela virá com o tempo e você certamente encontrará sua costeleta. Você só precisa reunir mais conhecimento, entender qual pergunta você está sendo feita nas entrevistas e se preparar melhor. Espero que você tenha aprendido muito e eu vou vê-lo no meu próximo curso.