如何在 JavaScript 中画云杉形三角形？

Question

如何在JavaScript中绘制这样的三角形？

      *
     ***
    *****
   *******
  *********
 ***********
*************

如果你能解释一下它是如何工作的就太好了。

到目前为止我有这个代码：

let lines = 7;
let str = ' ';
for (let i = 0; i < lines; i++) {
  str += '*';
  console.log(str);
}

Answer 1

此代码应该有效：

// You can specify line number
function drawTriangle(lines = 7) {
  for (let i = 0; i < lines * 2; i+=2) {
    const str = " ".repeat((lines * 2 - i) / 2) // Put spaces before '*'
                  + "*".repeat(i + 1);          // Put '*' after spaces
    console.log(str);
  }
}

drawTriangle();  // 7 lines
drawTriangle(9);
drawTriangle(20);

Answer 2

用 ASCII 艺术风格画一片云杉林

先指定图片的尺寸，再指定云杉树的顶点坐标。

云杉林：

      *                *                                                        
     ***       *      ***        *                                        *     
    *****     ***    *****      ***         *                            ***    
   *******   *****  *******    *****       ***                  *       *****   
  ********* ****************  *******     *****        *       ***     *******  
 *************************************   *******      ***     *****   ********* 
*************************************** *********    *****   ******* ***********
**************************************************  ******* ********************
********************************************************************************

Try it online!

function spruceForest(width, height) {
  let forest = {
    plot: [],
    addSpruce: function(x, y) {
      for (let i = 0; i < height - y; i++)
        for (let j = -i; j <= i; j++)
          if (x + j >= 0 && x + j < width)
            this.plot[y + i][x + j] = 1;
      return this;
    },
    output: function() {
      for (let i = 0; i < height; i++) {
        let row = this.plot[i];
        let line = '';
        for (let j = 0; j < width; j++)
          line += row[j] == 1 ? '*' : ' ';
        console.log(line);
      }
    }
  }; // populate an empty plot
  for (let i = 0; i < height; i++) {
    forest.plot[i] = [];
    for (let j = 0; j < width; j++)
      forest.plot[i][j] = '';
  }
  return forest;
}

spruceForest(80, 9) // draw a spruce forest in ASCII-art style
  .addSpruce(6, 0).addSpruce(15, 1).addSpruce(23, 0)
  .addSpruce(33, 1).addSpruce(44, 2).addSpruce(55, 4)
  .addSpruce(64, 3).addSpruce(74, 1).output();

^{受此答案启发：Draw an ASCII spruce forest in Java}

如何在 JavaScript 中画云杉形三角形？

How to draw a spruce-shape triangle in JavaScript?

javascript

algorithm

drawing

shapes

ascii-art

用 ASCII 艺术风格画一片云杉林