Exercise with a loop in javascript

问题

I need for an university exercise to display onscreen with a document.write the tree below using a kind of loop:

I used at the beginning a for loop but i printed only the first row... someone can help me?

This is what I tried:

var numbers = [0, 1, 2, 3, 4] 
for (var i = 0; i <= numbers.length; i++) { 
    if (numbers [i] == 0) { 
        document.write(" * </br>"); 
    } 
    if (numbers [i] == 1) {
        document.write(" *** </br>"); 
    }
    if (numbers [i] == 2) {
        document.write(" ****** </br>"); 
    } 
    if (numbers [i] == 3) {
        document.write(" ******* </br>"); }
    if (numbers [i] == 4) { 
        document.write("********* </br>"); 
    }
    return 
}

Thank You!

回答1:

I'm going to give you a "golfed-ish" (goldfish? should this be a thing?) version of the code. In other words, the smallest, most obscure code I can think of to accomplish the task. You should not use this, because your teacher will undoubtedly ask you what it means and you won't know, but I'm bored XD

var size = 5;
document.write("<center>"+Array.apply(0,new Array(size)).map(function(_,i) {return new Array((i+1)*2).join(" * ");}).join("<br>")+"</center>");

Demo

As I said, don't use this :p

回答2:

Here is my code for you ...

<html>
<head>
<script type="text/javascript" language="javascript">

document.write("<center>"); //write a center tag to make sure the pyramid displays correctly(try it without this step to see what happens)
for(var i = 0; i <= 10; i++) //a loop, this counts from 0 to 10 (how many rows of stars)
{
    for(var x = 0; x <= i; x++)// a loop, counting from 0 to whatever value i is currently on
    {
        document.write("*");//write a * character
    }
    document.write("<br/>"); //write a br tag, meaning new line, after every star in the row has been created
}
document.write("</center>"); //close the center tag, opened at the beginning

</script>
</head>
<body>

</body>
</html>

回答3:

<pre><script>
for(var i=0;i<5;i++)
{
    for(var c=0;c<9;c++)
    {
         if(Math.abs(4-c)<=i)
             document.write("*");
         else
             document.write(" ");
    }
    document.write("<br />");
}   
</script></pre>

It is a simple version with document.write(). The only complicated thing is Math.abs which gives the distance from the middle.

PS: watch out for magic numbers

回答4:

Adds spaces and fully extendable

function pyramid(lines, char) {
    var start = 2,html = '<pre>';
    for (var i=lines; i--;) {
        html += new Array(Math.floor(i+1)).join(' ') + new Array((start=start+2)-2).join(char) + '<br />';
    }
    return html + '</pre>';
}

document.write( pyramid(5, '*') );

FIDDLE

回答5:

function pyramidStar(n) {
  var str = "";
  for(var i=1; i<=n; i++) {
    for(var j=1; j<=n-i; j++) {
      str += "   ";
    }
    for(var k=n-i+1; k<n+i; k++) {
      str += "*  ";
    }
    for(var m=n+i; m<=2*n-1; m++) {
      str += "   ";
    }
    str += "\n";
  }
  return str;
}

document.getElementById("result").innerHTML = pyramidStar(9);

<pre id="result"></pre>

Another way of printing pyramid of stars.

回答6:

function star(n) {
    for (var i = 1; i <= n; i++) {
        for (var j = i; j < n; j++) {
            document.write("-");
        }
        for (var k = 1; k <= (2 * i) - 1; k++) {
            document.write("*");
        }
        document.write("<br/>");
    }

}

//function calling

star(9);

来源：https://stackoverflow.com/questions/23567463/exercise-with-a-loop-in-javascript

标签

javascript

html

loops

document.write