How to identify and print perfect squares with Javascript?

Question

I need a Javascript function that prints an HTML counter from 1 to 100. When the number is a perfect square, should print the text "perfect square" after the number.

Example:

1 
2
3
4 QUADRADO PERFEITO
5
6
7
8
9 QUADRADO PERFEITO
10
11
12
13
14
15
16 QUADRADO PERFEITO ...

Answer 1

Note that your example is incorrect as 1 is perfect square as well.

Follows a possibility, without much optimization:

function QuadradoPerfeito( n ) {
  var i;
  var out = '';
  var root;

  for ( i = 1; i <= n; i++ ) {
    root = Math.sqrt( i );
    if ( root == Math.floor( root ) ) {
      out += i + ' QUADRADO PERFEITO<br>';
    } else {
      out += i + '<br>';
    }
  }
  return out;
}

document.body.innerHTML = QuadradoPerfeito( 100 );

Summary explanation:

When iterating the numbers, we see if the square root of the number ( Math.sqrt ) is an integer number. If it is, the number is a perfect square. To check if it is an integer, simply take out the decimals using the Math.floor and see if the number has changed.

Optimizing the function with conditional operator and the operator of rest:

function QuadradoPerfeito( n ) {
  var i;
  var out = '';
  var root;

  for ( i = 1; i <= n; i++ )
    out += i + ( Math.sqrt( i ) % 1 === 0 ? ' QUADRADO PERFEITO' : '' ) + '<br>';

  return out;
}

document.body.innerHTML = QuadradoPerfeito( 100 );

Summary explanation:

The conditional operator replaces the if (more details, just click on the link) while doing the whole test.

The split rest operator (called erroneously module in some literature, is not the same thing) serves to eliminate the need for Math.floor. If we divide the root of the number by one, take the rest (which is what % does) and that rest is zero, it means that i a Perfect Square.

Answer 2

Knowing that perfect squares are located at well-defined intervals:

• Q₁ = 0 + 1 = 1
• Q₂ = 1 + 3 = 4
• Q₃ = 4 + 5 = 9
• Q₄ = 9 + 7 = 16
• Q₅ = 16 + 9 = 25

Simplifying:

• Q₁ = 1
• Q_n = Q_n-1 + 2n - 1

We can print the sequence, without depending on sqrt, what makes this the fastest way (only... it’s not always like this) to process such a sequence:

function QuadradoPerfeito(n) {
  var out = '';
  var x = 1;
  for (var i = 3; ; i += 2)
  for (var j = 0; j < i; j++) {
    if (x > n) return out;
    out += x + (j == 0 ? ' QUADRADO PERFEITO' : '') + '<br>';
    x++;
  }
}

document.body.innerHTML = QuadradoPerfeito(100);

But two nested ties... is not slower?

Despite having two nested loops, the total amount of calculations made is linear, because the output condition is on the variable x, which is increased in every passage.

In addition, the browser is able to optimize these nested loops in such a way, that even redoing the code with a single loop, the result is even slower, however it is much easier to understand the logic.

There goes a simulation of what happens when calling the method with n=20:

i=3:
  j=0: x=1 // QUADRADO PERFEITO
  j=1: x=2
  j=2: x=3
i=5:
  j=0: x=4 // QUADRADO PERFEITO
  j=1: x=5
  j=2: x=6
  j=3: x=7
  j=4: x=8
i=7:
  j=0; x=9 // QUADRADO PERFEITO
  j=1; x=10
  j=2; x=11
  j=3; x=12
  j=4; x=13
  j=5; x=14
  j=6; x=15
i=9:
  j=0; x=16 // QUADRADO PERFEITO
  j=1; x=17
  j=2; x=18
  j=3; x=19
  j=4; x=20

 

Single loop version, provided by @Bacco

Based on the comments on the amount of loops, @Bacco made a version that has exactly the same logic, but in a single loop.

But beware: this unique tie is no better in terms of performance than the double ties presented at the beginning of this answer! This version is to help people with less experience view logic.

function QuadradoPerfeito(n) {
  var out = '';
  var x = 1;
  var s = 1;
  var i;

  for ( i = 1; i <= n ; i++ ) {
    out += i;
    if ( i == x ) {
      out += ' QUADRADO PERFEITO';
      x = i + (s += 2 );
    }
    out += ' <br>';
  }
  return out;
}

document.body.innerHTML = QuadradoPerfeito(100);

Answer 3

window.onload = Quadradoperfeito

function Quadradoperfeito {

var numero;
var calculo;

for (numero=1; numero<=100; numero++)
{

calculo = Math.sqrt( numero );

if ( calculo == Math.floor( calculo ) )
{
document.write( numero + ' QUADRADO PERFEITO<br>');
}
 else 
{
document.write(numero + '<br>');
  }

}
}