Calculating leap year with JS

[clique aqui para português]

We have a leap year every four years, but it is easy to get confused which year is leap or not, so as not to suffer from it anymore, we will create a new project that finds out if the year is leap or not.

CODE

First we will create the interface, we will do something simple, using only HTML.

<h1>Calcular ano bissexto</h1>
<form name="form_main">
  <label for="date">Data:</label> 
  <input name="date" id="date" size="20" type="date" /><br />
  <label for="tipo">Tipo:</label> 
  <span id="tipo"></span><br />
  <label for="dia">Dia da Semana:</label> 
  <span id="dia"></span><br />

  <input name="button" value="Gerar" onclick="calcularBissexto()" type="button">
</form>

In the HTML structure an input was created to receive the date we want to know if the year is leap or not, and to give a small increment, we will also find out what day of the week.

Now let’s create the calcularBissexto() function.

function calcularBissexto() {
  let day_array = [
    'Segunda-Feira', 
    'Terça-Feira', 
    'Quarta-Feira', 
    'Quinta-Feira', 
    'Sexta-Feira', 
    'Sábado', 
    'Domingo'];
  let date_full = new Date(document.form_main.date.value);
  let calcular_bissexto = (ano) => (ano % 4 == 0 &&  ano % 100 != 0 ||  ano % 400 == 0)  
  ? 'E bissexto' : 'Nao e bissexto';
  document.querySelector('#tipo').innerText = calcular_bissexto(date_full.getFullYear());
  document.querySelector('#dia').innerText = day_array[date_full.getDay()];
}

In this function (calcularBissexto()), we have the day_array variable with the days of the week, the date_full variable that receives the date input and we have a function called calcularBissexto which is where we check the date.

The check made in the function calcularBissexto is:

• If year module 4 is 0 AND year module 100 is different from 0 then, leap = true
• If module 400 is 0 then leap = true;
• Any different case then, leap = false;

To find out what day of the week we take the variable date_full and use the standard function getDay() which returns a number value (0–6) and with that value we discover the day of the week day_array[date_full.getDay().

ready as simple as that.

Demo

See the complete project working below.

Youtube

If you prefer to watch, I see the development on youtube (video in PT-BR).

Thanks for reading!

If you have any questions, complaints or tips, you can leave them here in the comments. I will be happy to answer!

😊😊 See you! 😊😊