Projeto JavaScript para Dummies: calendário de idade

1. Apresentação: O projeto que estamos construindo neste vídeo é bem simples. Então, estamos construindo uma calculadora de idade usando JavaScript. Como este projeto foi projetado para ser grandioso, é muito simples e direto E há apenas dois objetivos de aprendizagem que temos neste projeto. Então, o primeiro é aprender a implementação da cúpula em nosso projeto JavaScript, e o segundo é usar o objeto de data e também manipulá-lo para obter os resultados desejados 2. Construindo a Idade: Este é o projeto que vamos criar neste vídeo e, na verdade, vamos criar a calculadora de idade com a ajuda do JavaScript. Portanto, usaremos o CSS ESTiml somente no JavaScript. Então, primeiro de tudo, o que eu preciso fazer é abrir o código VS aqui. Então, agora no código VS, o que eu realmente preciso fazer, então temos que voltar e agora temos que ver o que realmente precisamos fazer em nosso código de estimativa. Então, basicamente, temos que ter o arenque, que será a calculadora de idade, e então teremos essa entrada e botão E depois disso, quando fornecemos o valor de entrada aqui , vamos selecionar o valor de entrada. E agora, se eu clicar em calcular, isso calculará a idade para nós no formato de anos, meses e dias. Então, na verdade, temos que construir esse projeto. Então, vamos voltar. E a primeira coisa que precisamos fazer é construir nossa estimativa de estrutura E dentro do desenvolvimento, precisamos ter a audição que seria a I two. Então, vou simplesmente anotar a calculadora de idade. E depois disso, eu vou ter mais um desenvolvimento, que terá as duas coisas. A primeira coisa seria a entrada. Estará no formato de data, então temos que clicar na data de entrada. Tudo bem. Então, eu não preciso ter o nome agora, então vou simplesmente remover esse valor. Mas vou adicionar o ID aqui. Então, como estamos obtendo os dados aqui, vamos escrever D ou B aqui Ok, então depois disso, o que precisamos fazer aqui, precisamos ter o botão aqui. Vou simplesmente anotar o botão. E dentro do botão, precisarei adicionar o ID aqui. Então isso será, digamos, calcular e aqui no texto, eu posso anotar, calcular também. E depois disso, o que precisamos ter, precisamos ter um parágrafo aqui, mas com o ID, que seria o resultado, sim, é disso que precisamos. Mas neste parágrafo, não teremos nada aqui. Está bem? Porque o texto dentro do nosso parágrafo será gerado quando fornecermos um valor na entrada e quando executarmos nossa função de cálculo. Então, agora, estaria vazio. Então, vamos salvar isso. E agora o que eu tenho que fazer, eu realmente tenho que executar isso. Então, vamos clicar em Abrir com o Lifesaver Ok, então isso é algo que estamos tendo agora em nosso projeto Ok, então uma coisa que eu tenho que acrescentar aqui é que eu não vou trabalhar no CSS em nosso projeto. Então, vou apenas adicionar o CSS pré-fabricado que criei com a ajuda do AIS. Vou usar isso de forma simples. Mas, no momento, não estamos adicionando isso ao nosso projeto. Vamos apenas adicionar isso no último momento. Então, agora o que temos que fazer é adicionar mais uma coisa, que na verdade é o arquivo JavaScript. Então, vamos chamá-la de porta principal, Jess. Ok, então agora eu gostaria de entrar na janela cheia agora. Perfeito. Vamos apenas aumentar o tamanho aqui. E agora isso fará com que pareça mais visível. Então, como criamos nosso EstiML aqui, isso é tudo o que precisamos em nosso arquivo TML Agora precisamos trabalhar em nosso arquivo JavaScript. Agora, no arquivo JavaScript, em primeiro lugar, precisamos entender como o STML e o JavaScript estão se comunicando entre si Então, eles se comunicam com a ajuda de Dome. Então, agora, se você não sabe sobre a cúpula, vou lhe dar uma pequena introdução sobre a cúpula, como ela funciona, o que é e como podemos usá-la e como podemos usá-la Então, para isso, precisarei entrar no navegador novamente. E eu criei alguns diagramas aqui. Então, vamos aqui com a tela cheia. OK. Então, primeiro de tudo, eu tenho que mostrar uma coisa aqui: como TML e CSS se comunicam entre si Então, vou adicionar o texto aqui, que será o dom, então essa é a nossa cúpula, e também precisamos ter o estimal e o JavaScript Então eu coloquei aqui e coloquei aqui. Vou escrever o estimal aqui e vou escrever o JavaScript aqui. Portanto, a forma como o estimal e o JavaScript se comunicam é com a ajuda do dome Então, vou apenas criar um fluxo aqui. Está bem? Então é assim que vamos conectar isso e também podemos ter a linha aqui. Então, se você conhece o doom e sabe como eles se comunicam entre si, o que são e como podemos usar isso no código, você pode pular esta parte da explicação do OK. Então, agora, primeiro de tudo, temos que entender o que é um dom na verdade. Então, o Dom é, na verdade, o recurso de um navegador. Está bem? Na verdade, é um recurso do navegador. Portanto, existem vários recursos de navegadores diferentes que usamos em nosso aplicativo da web. Então, o Dom é, na verdade, um dos recursos do navegador que usamos em nosso código. Então, o que significa é um modelo de objeto de documento e como ele realmente é, como funciona. Então, Dom é basicamente a API de programação, ok, que usamos para estiML e documentos de exame. Então, na verdade, essa é uma API que nos permite a comunicação entre o Javascript e o estimal Então, o que podemos realmente fazer com isso. Então, basicamente, podemos acessar e manipular os elementos estimados com o JavaScript com a ajuda do dome Ok, agora temos que entender a estrutura da cúpula, como a estrutura de dados da cúpula ou como ela funciona ou como está Assim, você pode ver que a cúpula é o objeto Javascript e está estruturada no formato de árvore Portanto, o ponto base ou o ponto de acesso ou o ponto de partida dom é sempre que você quiser usar o dom em seu arquivo JavaScript em seu código estimado, você sempre começará com um documento Depois do documento, você poderá acessar todos os elementos estimados que você tem em seu código Então, o elemento raiz sempre será estimado, digamos que no código estimado, você tenha o elemento cabelo, e você também tenha o elemento corpo, e no elemento corpo, então você tenha o elemento Eschman e o elemento parágrafo e Então, digamos que se você quiser acessar o parágrafo aqui. Então, agora o que você precisa fazer, primeiro, basta anotar o documento. Esse será o ponto de entrada para usar o código JavaScript domino. Então, primeiro, você vai anotar o documento. Ok, então deixe-me fazer com que pareça maior. Então, primeiro, você escreverá o documento e o usará como objeto JavaScript. Então, como sabemos, para acessar as propriedades em nosso objeto Javascript, usamos a notação de ponto aqui Então, depois disso, o que vamos usar é simplesmente escrever EstiML porque esse é o elemento raiz e, depois disso, precisamos escrever o corpo Tudo bem Precisamos adicionar o ponto aqui e, depois disso, escreverei o parágrafo se quiser acessar o parágrafo. Mas digamos que se eu quisesse acessar o elemento H um aqui, vou escrever o elemento H um aqui. Então é assim que o objeto dom funciona. Obviamente, existem maneiras mais fáceis acessar os elementos em nosso código estimado, mas estou apenas dando uma ideia aqui de como ele realmente funciona em termos de estrutura de árvore Então, vamos simplesmente deletar. E depois disso, temos que entender dois aqui. Que, em alguns casos, temos duas coisas. A primeira são as propriedades, pois esse é o objeto Javascript, e a segunda são os métodos. Então, o que você pode fazer com as propriedades e os métodos aqui é bem simples. Com as propriedades, você pode realmente obter ou definir o valor, se quiser alterar o conteúdo de qualquer elemento de estimativa, assim como o texto ou qualquer coisa. E com a ajuda do método, você pode realizar uma ação em qualquer elemento estimado, como adicionar o elemento estimado ou excluí-lo ou Portanto, tem duas coisas: as propriedades e os medidores. Então, agora que entendemos a cúpula e como ela realmente funciona, agora vamos voltar ao nosso código JavaScript e começar a escrever nosso código JavaScript para nosso projeto Então, antes de escrever o projeto no Jz, mais uma coisa que eu quero mencionar aqui que isso é algo que eu faço pessoalmente Agora, é totalmente opcional que, se você quiser fazer isso ou não, eu sempre anote uma espécie de documentação passo a passo sobre o projeto antes de escrever o código. Então, parece algo assim. Se eu puder te mostrar aqui, vou entrar no documento aqui. Na calculadora. Então, isso é algo que eu criei antes. Portanto, as etapas iniciais são realmente óbvias. Você precisa criar o arquivo estim , adicionar estilo e criar o arquivo JavaScript. Depois do arquivo JavaScript, o que temos que fazer em nosso código. Isso é o que temos que entender. Portanto, se você sempre escrever esse tipo de documentação passo a passo para seu projeto, na verdade estará criando sua solução sem escrever o código. Está bem? Esse é um tipo de solução que você pode usar como referência para escrever seu código. Então, digamos que para o nosso projeto que estamos criando, que é a calculadora de idade. Então, a primeira coisa que precisamos fazer é em JavaScript, temos que acessar os elementos que temos em nosso código estimal com a ajuda do Dom E depois disso, temos que criar uma função que possa calcular a idade. E depois desse último, temos que criar ou adicionar um ouvinte de eventos Então, eu também explicarei o ouvinte do evento mais tarde. Então, se você quiser se aprofundar ou se aprofundar em seu código, o que você pode fazer é até mesmo anotar as etapas que você executará em sua função. Então, o que eu fiz aqui, é o que você precisa fazer para criar uma função para calcular a idade. A primeira etapa é obter o valor de entrada, e você sempre precisa se lembrar de que sempre que obtém o valor de entrada do elemento de entrada estimado, ele está sempre no formato de uma string. É por isso que temos que converter isso no objeto de dados, então temos que adicionar a fórmula para calcular nossa idade, e então obteremos nosso valor ou nosso resultado em milissegundos OK. E então temos que converter esses milissegundos em anos, meses e dias Então é assim que vamos construir nossa solução em nosso projeto. Então, agora, vou entrar em nosso projeto. Então, a primeira coisa é que temos que acessar os elementos. Então, vou anotar os elementos de acesso. Então, ao acessar o elemento, primeiro criamos as variáveis aqui. Vou anotar o chumbo. Então, essa será a entrada. Então, vou anotar a entrada da data. E aqui, vou anotar o documento porque eu queria acessar meu arquivo de estimativa com a ajuda do Java Sci Então, vamos usar o dom. E como aprendemos que, para acessar o dom, o ponto de entrada é que você vai anotar o documento. E depois disso, ok, agora o que aprendemos é que, digamos que eu tenha que anotar a estimativa aqui e apenas fazer um registro do console aqui Então, este será um exemplo muito rápido apenas para mostrar como as coisas da cúpula funcionam Então, vamos simplesmente salvar isso. E agora temos que adicionar nosso código JavaScript aqui. Então, vou anotar a fonte. Este será o Dot Js principal. Agora, vou voltar ao nosso navegador. Temos que voltar a um documento. Temos que entrar na inspeção, clicar em Console. Ok, então agora você pode ver aqui que é indefinido. Obviamente, porque quando você anota o documento, você está anotando diretamente o ponto de entrada aqui. Então agora é por isso que você não precisa escrever a estimativa aqui Você pode escrever diretamente o corpo aqui. Está bem? Então, se eu apenas escrever o corpo aqui, posso acessar meu elemento corporal que temos em nosso código estimado dentro do Javascript. Então, uma coisa que eu cometi um erro ao explicar a cúpula aqui é que não precisamos anotar o estímulo. Está bem? Então, vamos salvar isso e voltaremos aqui. Tudo bem, então aqui, como você pode ver aqui estamos tendo nosso corpo aqui Então, digamos que se eu quisesse acessar meu elemento div aqui Então, se eu apenas escrever o div aqui, isso não funcionará. Isso sempre nos dará um valor indefinido porque nosso elemento corporal tem vários elementos secundários diferentes Está bem? Para acessar os elementos que temos dentro de outro elemento, você pode anotar children, propriedade aqui. E aqui, se eu salvar isso, agora, você poderá acessar todos os elementos que temos dentro do nosso corpo. Então, temos o elemento div e, depois disso, temos o elemento script E mesmo que eu vá mais longe no elemento div, podemos acessar os elementos que temos dentro desse elemento div Ok, para acessar os elementos aqui, o que precisamos fazer? Precisamos usar os pacotes quadrados aqui, e agora temos que anotar o valor do índice aqui Então, aqui, se eu puder mostrar aqui que estamos tendo esses valores de índice aqui para nossos elementos. Portanto, para acessar o elemento div, precisarei anotar zero Então, temos o zero aqui. Então, se eu salvar isso, acessarei nosso elemento de mergulho. Então, se eu quiser aprofundar o elemento de mergulho aqui, vou escrever as crianças novamente. Agora você poderá ver todos os elementos que temos dentro do nosso elemento div Portanto, esta é uma das formas de acessar o elemento no Javascript. É por isso que não preferimos usar isso. Então, como podemos usar isso? Então, como podemos acessar todos os elementos ou qualquer elemento que eu queira usar muito rapidamente? É bem simples. Você pode usar os métodos aqui. Portanto, temos esses três métodos diferentes que podemos usar para acessar o elemento. Portanto, se você quiser acessar o elemento usando um valor de ID, você pode anotar get element by ID. Mas se você quiser usar os elementos pelo nome da classe, você pode simplesmente usar esse método aqui. Mas se você quiser acessá-los pelo nome, você pode usar esse método e também pode ver esses métodos diferentes aqui. E temos mais um método aqui, que na verdade é o seletor de consultas que também podemos usar para acessar o elemento de todas essas maneiras diferentes Então, agora, vamos simplesmente usar get element by ID aqui. Então, para a entrada da data, temos o valor do ID, que é DOB. Então, vou simplesmente anotar o DOB aqui. E agora, se você fizer o log do console aqui, poderá ver minha opinião aqui. OK. E da mesma forma, podemos acessar nosso botão. Então, vou anotar o botão aqui. Então, vamos anotar e calcular . E agora temos que repetir esse processo, então podemos simplesmente copiar isso e colar isso. E o que precisamos mudar aqui é apenas nosso valor de ID. Então, na verdade, deixe-me verificar isso novamente. Esse foi o cálculo. Então, podemos simplesmente copiar isso daqui. E podemos simplesmente colar isso aqui. Está bem? Tudo bem Então, agora, o que mais precisamos? Então, acho que também precisamos do parágrafo aqui. Então, vamos voltar e podemos criar mais uma variável que será o resultado. E aqui o que eu preciso fazer é repetir esse processo, documentar, obter elemento por ID. Agora, você tem que anotar o nome do ID aqui. É isso mesmo. Portanto, temos acesso a todos os elementos que precisaremos em nossa função Está bem? Então, depois disso, o que eu tenho que fazer é criar uma função. Portanto, para criar uma função, você pode criá-la no formato de função de erro ou nos formatos de função típicos, o que você preferir usar. Então, para simplificar isso, vou simplificar isso em nosso formato tradicional Então, eu vou escrever a função aqui. Então, podemos adicionar o nome da nossa função que seria calcular cada uma. Em seguida, podemos adicionar nossos parênteses e, em seguida, os colchetes. Ok, então agora o que temos que fazer, primeiro de tudo, vou fazer o log do console aqui. E aqui vou apenas inserir a data do Consolog aqui. OK. E uma coisa que preciso fazer aqui é adicionar um ouvinte de eventos. OK. Então, o que é um ouvinte de eventos? Basicamente, em nossos elementos estimados, temos os diferentes eventos Podemos considerar os eventos como se algo estivesse acontecendo com nosso elemento. Está bem? Algo está acontecendo com um elemento. Está bem? Então, por exemplo, alguém clica no nosso botão O clique é uma forma de evento. Está bem? Digamos que alguém esteja apenas passando o mouse sobre nosso texto ou alguém esteja apenas passando o mouse sobre o que você chama de elemento de botão ou algo parecido, ou uma entrada, alguém está alterando você chama de elemento de botão ou algo parecido, ou uma entrada, alguém está Está bem? Se alterarmos o valor na entrada , vamos adicionar mais um exemplo aqui. Se alterarmos o valor na entrada , alterar o valor é uma espécie de evento. Então, agora, como o ouvinte do evento funciona? Ouvinte de eventos significa simplesmente que sempre que esse evento específico acontece, obviamente você define que sempre que esse evento específico acontece, você executa isso ou faz isso, ou digamos que você chame esse functier de algo assim Então, digamos que eu queira adicionar um ouvinte de eventos sempre que clico no meu botão aqui Então, se eu voltar aqui, sempre que eu clicar nesse botão, quero que algo aconteça. Quero executar uma função, quero fazer um log do console ou algo parecido. Então, como podemos fazer isso de forma bem simples. Então, para adicionar o ouvinte de eventos ao seu elemento, o que você basicamente faz é anotar o nome do seu elemento, seja ele qual for, pode ser o botão Pode ser entrada, pode ser parágrafo ou qualquer coisa. Em seguida, você anota adicionar ouvinte de eventos. Então, esse é um método aqui. Então, dentro desse método, você tem que definir duas coisas. Então, a primeira coisa seriam os eventos. Então você pode ver esses valores aqui. Então temos o Abod, temos o cancelamento da animação, temos o desfoque, temos o Cancel, temos o Ken Então você pode ver todos esses valores diferentes aqui. Então, todos esses são tipos diferentes de eventos que temos em nossos elementos de estimativa. Obviamente, todos os eventos não funcionarão em todos os elementos. Então, para o botão, digamos, ele pode ter o evento de clique, então vamos simplesmente anotar, clique aqui. Então, vou simplesmente selecionar o clique. Então, aqui no segundo valor ou no segundo argumento, você realmente adicionará uma função de retorno de chamada Ok, então uma coisa que eu tinha que mencionar, mas esqueci de mencionar que você precisa ter o conhecimento básico do Javascript antes de fazer este projeto Você precisa entender quais são as variáveis, quais são os tipos de dados? Como você pode atribuir o valor às entradas? Como você pode criar uma função? Quais são as matrizes? Quais são os objetos? Como você pode acessar as propriedades na matriz ou os objetos? E como você pode criar um método no objeto JavaScript? E qual é a função de retorno de chamada? Portanto, você precisa ter uma boa compreensão do JavaScript antes de criar este projeto. OK. Então, agora precisamos adicionar a função de retorno de chamada aqui. Mas, como uma definição rápida que posso dar sobre a função Callback, a função callbank significa simplesmente que você chama uma função dentro de outra função Então, aqui, o ouvinte de eventos add é uma espécie de função. E agora vamos definir outra função dentro disso. Então você pode chamar e funcionar diretamente dentro disso ou você pode usar a função já definida que criamos aqui, ou até mesmo eu posso simplesmente fazer o Consolo aqui Então, agora, vamos fazer o Consolo aqui. Então, vou escrever no alto do botão. Perfeito. Ok, agora vou voltar ao nosso navegador. Ok, então um problema que você verá aqui é que, na verdade, precisávamos ter esse log do console sempre que clicávamos nesse botão. Ok, mas já estamos tendo isso. Então, se eu clicar na atualização agora, você pode ver isso. Já temos esse registro do console e não queremos isso aqui. Então, agora o que precisamos fazer em nosso código é que sempre que você adiciona algo dentro do seu ouvinte de eventos à sua função de retorno de chamada, você precisa agrupar isso em uma Está bem? Agora, como sabemos que, para adicionar a função, temos duas formas diferentes, a terena, a forma como criamos a função aqui, e a segunda é que você pode usar a função de seta Portanto, a função de seta é bem simples. Você pode simplesmente usar o parêntese aqui, basta usar a seta aqui, e é assim que você envolve o log do console em sua função de seta Mas digamos que, se você não quiser usar a função de seta, vamos simplesmente escrever a função aqui, e agora não precisamos escrever esse nome aqui porque estamos usando isso como retorno de chamada Precisamos usar os colchetes aqui, e agora isso vai funcionar perfeitamente e agora isso vai funcionar Então, agora, sempre que clicarmos em Calcular, teremos nosso botão. Então você pode ver a mudança no número aqui. Como estamos tendo o mesmo tipo de valor, é por isso que não está atualizando isso na nova linha. Está bem? Então, simplesmente funciona. Mas digamos que se você adicionar diretamente a função aqui, ela funcionaria bem. Está bem? Mas se você quiser adicionar qualquer expressão diretamente para isso, precisará envolvê-la na função. Mas queremos adicionar uma função direta a isso. Então, vamos simplesmente adicionar nossa função aqui. Então, vamos simplesmente anotar, calcular a idade aqui. Ok, então não precisamos adicionar o parêntese aqui. Funcionará sem parênteses. Está bem? Não precisamos chamar isso. Só precisamos adicionar o nome da nossa função aqui. Então, vamos salvar isso e agora, quando vamos voltar, clique no cálculo. Teremos nossa opinião aqui. Está bem? Então é assim que vai funcionar. Por isso, adicionamos nosso ouvinte de eventos. Adicionamos nossa função. Temos acesso a todos os elementos de que precisamos. Agora, o que temos que fazer é o principal. Agora temos que trabalhar em nossa função. Portanto, temos que executar nossa funcionalidade aqui. OK. Então, agora, se eu voltar aqui, você pode ver uma coisa aqui: com a entrada, não estamos realmente obtendo o valor da entrada, pois queremos obter o valor dela. Então, para isso, sempre que você acessa o elemento de entrada no Javascript, para acessar o valor, você sempre anota a propriedade que é o valor do ponto aqui. Vamos adicionar o ponto aqui. Agora, você poderá acessar o valor aqui. Então, se eu apenas salvar isso e voltar aqui e calcular o valor aqui, você pode ver isso, estamos tendo a string vazia porque eu não adicionei nada à nossa entrada de dados aqui. Então, vamos simplesmente adicionar qualquer valor aqui, então vamos voltar. Vamos adicionar qualquer valor aleatório aqui agora. Clique nesse valor, clique em sete, clique em Calcular. Agora você pode ver isso. Estamos definindo nosso valor de data aqui. OK. Então é assim que vamos obter o valor. Então, eu preciso criar mais uma variável aqui, para que seja a data de nascimento ou podemos anotar o DOB, e escreveremos a nova data aqui Então, por que estamos usando a nova data aqui, o motivo é que sempre que você obtém o valor do elemento de entrada estimado que temos, ele sempre retorna o valor no formato de string. Então, se eu fizer o registro do console aqui muito rapidamente, então vamos ter o registro do console , vamos anotar o valor do ponto de entrada do dia. E para verificar o tipo do valor, podemos simplesmente escrever o tipo de palavra-chave aqui e ela nos dirá o tipo de dados do nosso valor. Então, se eu clicar em calcular, você pode ver que estamos tendo os valores da string. OK. Agora, o que temos que fazer é realmente converter, então vou simplesmente escrever isso aqui. Temos que converter essa entrada de string em objeto diurno. OK. Portanto, se você não estiver familiarizado com o objeto de data, pode simplesmente pesquisar no Google. Portanto, o objeto de data é simplesmente o objeto que temos no Javascript, que tratará os valores de data na data. Ok, a data real. No momento, eles estão tratando nosso valor de data como a string. Mas sempre que convertermos isso em nosso objeto de data , ele será tratado como a data real. Então, a vantagem disso é que podemos subtrair os valores, podemos subtrair as datas umas das outras Podemos adicioná-los para que possamos fazer muitas coisas com o objeto de dados. Apenas para referência, vou simplesmente escrever aqui. Nós vamos até o Google. O que podemos fazer com o objeto de dados no script java Agora você poderá entender todos os benefícios que ele tem. Você pode usar esses métodos integrados para combinar e gerenciar esses dados Então você tem muitos benefícios para isso. Portanto, temos que fazer isso porque subtrairemos nossa data de nascimento pela data atual Então, o que precisamos fazer para converter nosso valor de string em nosso objeto de dados é simplesmente anotar a nova função construtora de data aqui e, em seguida, colocar o valor que deseja converter no objeto de data Então, agora, se eu fizer o registro do console, teremos nosso valor no formato de data. Vamos voltar ao documento, clicar em calcular. Agora você pode ver isso, estamos tendo o valor no formato de data. Preciso ter mais um valor, que será o valor atual. Está bem? Então, vamos adicionar, digamos, hoje, e essa será a nova data. Agora, para criar o objeto de data da data de hoje, você não precisa escrever nada entre parênteses, e isso fornecerá o objeto de data da data de hoje ou o valor de hoje Então, se eu apenas fizer o log do console sobre isso, se eu clicar em calcular agora, você pode ver isso. Estamos tendo nosso valor atual e o primeiro valor é o que fornecemos aqui na entrada. Ok, então agora temos que fazer mais uma coisa. Para calcular a idade, na verdade, o que precisamos fazer, precisamos subtrair nossos dados de nascimento com o valor atual Está bem? Então, esses seriam os dados de nascimento e vamos criar mais uma variável que será a idade. Então, agora vou simplesmente anotar hoje e menos e agora vamos anotar o DOB Esse é o benefício que temos com o objeto de dados: você pode subtrair diretamente os valores de data com o objeto de dados Então, vamos fazer o log do console aqui novamente. Então, agora eu primeiro clico em calcular, você vai ter esse valor numérico aqui Então, o que é isso? Então, esse é realmente o seu valor, seu valor de data em milissegundos. Então, agora que estamos obtendo esse valor em milissegundos, vou adicioná-lo como um comando obtendo vantagem em milissegundos OK. Então, agora o que temos que fazer é converter nossos milissegundos em anos em meses e dias Na verdade, essa é uma parte meio complicada. Então, se você estiver fazendo isso pela primeira vez, isso lhe causará problemas. Está bem? Mas se você dividir isso em etapas menores , será uma coisa fácil de fazer. Ok, então o primeiro passo seria mudar minha idade para mudar minha idade para anos, mudar minha idade para anos. Ok, então como você vai fazer isso? Está bem? Então, é bem simples. Como estamos fazendo isso pela primeira vez, o que podemos fazer, podemos pegar ou procurar essa solução na Internet. OK. Então, aqui, eu só queria acrescentar uma coisa aqui. Estou construindo este projeto na perspectiva de que você está fazendo isso como iniciante e não sabe muitas coisas E isso é realmente bom porque esse é o processo. Então, quando você não sabe nada e quando quer criar uma solução sobre isso, o que você realmente faz é procurar a solução. Então, eu também vou te ensinar como procurar a solução ou como procurar algo que você não conhece. Então, vamos procurar uma solução. Então, o primeiro passo é esse ou a primeira tarefa é converter nosso valor de milissegundos em ouvidos Então, vamos simplesmente entrar no Google. OK. Então, agora temos duas maneiras. Se você quiser fazer isso muito rapidamente, basta ir até o chapéu JBT e pedir que ele lhe dê a fórmula ou algo para converter os valores de milissegundos no ouvido, ou você também pode procurá-la no Google OK. Então, procurar isso no Google é na verdade, a forma tradicional ou a forma que era usada antes do AA, mas você também pode usar o AA se quiser. Mas a ideia é que você tenha que encontrar a solução. Você tem que saber como encontrar a solução e todas essas coisas. Então, vou simplesmente escrever como transformar milissegundos em anos em JavaScript. Ok, podemos anotar no objeto de dados. Então, podemos ter esse. Então, vamos mudar isso para o Es. Você pode ver isso. Na verdade, estamos tendo um tipo de solução que esperamos ou que vamos construir Portanto, temos que converter os valores de milissegundos em s, meses e datas Então, vamos simplesmente ir até lá e agora você pode encontrar a solução no múltiplo desses diferentes recursos. Então, o que você preferir usar, o que for fácil para você, basta entrar lá e procurar a solução. Então, vamos entrar no fluxo So. Podemos acessar o Github e também podemos procurar o meio, se houver um meio aqui. Não tenho certeza. Então, vamos entrar no fluxo do SO aqui. Você pode ver aqui que, no fluxo de aquisição, eles realmente nos deram todas as soluções ou todo o cronograma que precisávamos Então, se você quiser converter isso em minutos, você pode simplesmente converter isso em falta. Se você quiser converter isso em nós, dias, meses e anos, você pode simplesmente fazer isso aqui. OK. Então, o que realmente precisamos fazer aqui é bem simples. Agora vamos simplesmente voltar e tentar resolver isso, digamos, com as soluções ou as referências que construímos. Então, vou simplesmente criar uma variável que é anos. OK. Então, aqui estaria o valor da idade, e depois disso, OK, como sabemos que nosso valor de idade é em milissegundos, então vou perguntar que, para converter os milissegundos em segundos, qual é o valor que exigimos na verdade, os Porque em um único segundo, temos os mil milissegundos. Então, vamos simplesmente escrever 1.000 milissegundos aqui para converter nosso valor de milissegundos em Agora, como também queremos converter isso em minutos, sabemos que em um único minuto, temos os 60 segundos. Então, vamos simplesmente multiplicar isso por 60, e agora temos que converter esse valor em Rs Então, como sabemos, em um único R, temos 60 minutos. Então, vamos simplesmente adicionar 60 aqui. E agora, como sabemos que em um único dia, quantos Rs temos, na verdade são 24. Vamos simplesmente adicionar os 24 aqui. E agora isso realmente converteria nossos valores de H em dias. Então, esses serão os dias, não os anos. Então, vamos simplesmente anotar os primeiros dias. Agora, com a ajuda dos valores de nossos dias, podemos calcular todas as coisas que precisávamos. Então, agora também podemos fazer isso com o CharGBT ou Então, podemos simplesmente verificar se isso vai funcionar ou não. Então, vou ao Char JBT para verificar se isso vai funcionar ou não Então, vamos simplesmente anotar o GPD aqui. Perfeito. Então é assim que você vai perguntar as coisas. Vou escrever aqui uma solicitação para verificar se, com esse código, converterei milissegundos em dias, converterei milissegundos em dias, considerando que a idade é de milissegundos Idade é o valor de milissegundos, algo assim. Ok, então isso está realmente certo. Então, fizemos isso da maneira certa. Ok, então uma coisa que ainda temos que adicionar a isso, mas primeiro, vamos voltar aqui. Vamos dar a ele um registro de nossos dias no console. Então guarde isso. Vamos voltar ao documento. Vamos clicar em calcular e agora você pode ver isso. Estamos adotando esses valores nos dias de hoje. Então, simplesmente convertemos os milissegundos em dias. Mas você também pode ver que temos esses valores decimais Então, agora não queremos ter esses valores. Portanto, precisaríamos usar o método matemático de fluxo de pontos. Então, o que isso realmente faria. Então, isso realmente arredondará nosso valor para o número inteiro mais próximo. OK. Agora, vou salvar isso e teremos nosso valor inteiro aqui, não o valor decimal Ok, então isso é perfeito. Então, esses são os dias. Agora, o que temos que fazer, agora temos que converter isso nos ouvidos primeiro. Então, vamos escrever as orelhas esquerdas, e isso será, digamos, mate, fluxo de pontos, e isso será dias, divididos por 365. E acho que também precisamos adicionar alguns valores decimais a isso Mas vamos voltar aqui. Vamos levar isso para o estouro da aposta. Tudo bem, eu acho que isso é perfeito. Portanto, também podemos verificar isso posteriormente com o JAGPT. Está bem? Agora vamos simplesmente fazer o console dos ouvidos. Isso é perfeito. Vamos apenas voltar. E clique em calcular aqui e estamos carregando os anos. Portanto, se sua data de nascimento for em 2010, você terá cerca de 14 anos. Portanto, temos o valor dos anos. Agora temos que obter o valor do nosso mês. Então, como você vai obter o valor do mês? Ok, para converter em meses, primeiro, temos que obter os dias de lembrete dos anos, porque usamos o fluxo de pontos Md aqui e ele realmente arredondará o valor É por isso que também precisamos obter os dias, que são os dias restantes aqui. Então, como você vai fazer isso é bem simples. Você vai escrever os dias restantes menos assim, e isso será, digamos, a divisão do módulo de dias e depois 365 É assim que vai funcionar. Está bem? Agora você pode simplesmente obter o valor aqui. Você pode anotar os dias restantes. Perfeito. Eu só faço o Consolo aqui. Tudo bem, então aqui, eu também vou adicionar um piso de pontos matemáticos para que possamos evitar o valor decimal aqui Então, vamos simplesmente adicionar esse valor. Ok, então uma coisa aqui é que no valor ES para adicionar o valor exato, na verdade adicionamos o tecimal 25 Está bem? Então, se eu apenas copiar isso e colocar isso aqui, você também pode verificar isso no Google, se quiser. Na verdade, essa é a hora exata do ano solar. Ok, então depois disso, o que temos que fazer. Então, agora vamos simplesmente adicionar o valor do mês aqui. Então, isso é bem simples. Então, vamos simplesmente anotar os meses restantes, e agora temos que anotar o fluxo matemático de pontos. Usarei os dias restantes, pois obteremos nossos meses a partir dos dias restantes. E agora temos que dividir isso por 30 decimais. Quatro, quatro. OK. Então, eu vou escrever 30 aqui. OK. Agora, deixe-me verificar isso para que você possa ver por que usamos esse valor. Então, vamos voltar ao Che GPT e agora vamos perguntar a ele por que usamos valor como valor mensal Então, basicamente, usamos o trinta, 44 como o empréstimo mensal médio porque, como sabemos , em alguns dos meses que temos 28 dias, temos 31 dias temos Mas, considerando a média do ano, estamos tendo cerca de 30,44 dias Então, vamos voltar aqui para o nosso código. Isso é perfeito. E agora temos que fazer mais uma coisa aqui. Como temos nossos meses aqui, também precisamos aproveitar nossos dias . Então, como vamos fazer isso? Então, vou adicionar isso como dias de nascimento restantes. OK. Tudo bem, então podemos usar esse nome como uma variável, mas você pode mudar o nome aqui. O que você preferir é ter algo assim. Vou usar o fluxo matemático de pontos aqui novamente. E o que temos que fazer é repetir o processo, como fizemos com os dias e os anos restantes. Então, na verdade, temos que adicionar os dias restantes aqui, e então temos que fazer a divisão do módulo com 30,44. OK. Então, agora deixe-me explicar essa parte novamente. Então, primeiro de tudo, reduzimos nossa idade em milissegundos. Em seguida, convertemos esses milissegundos. Em dias. OK. E depois disso, o que fizemos foi converter os dias em anos. Ok, agora que conv