我怎样才能制作这样的对称直方图？

Question

我想编写一个 JavaScript 程序来显示如下图所示的对称直方图：

程序应要求用户输入要打印的条数和用于绘制条的字符。栏中的字符数需要显示在每个栏的右侧。

显示的例子是当我输入@作为字符和13作为数字时。

这是我的代码：

var symbol = prompt("Enter the symbol");
var number = prompt("Enter the number");
var currentNum = 1;
let text = "";
let symbolNum = symbol;

while (currentNum <= number) {
  text += "<br>" + symbolNum + " " + currentNum;
  symbolNum += symbol;
  currentNum++;
}


document.write(text + "<br>");

最后只能输出如下：

我想知道我可以做什么来扭转循环？

Answer 1

试试这个

function SymmetricHistogram(){
  
const size = 10;
let numberX = 0;
let numberY = 0;

for(let i = size; i>=-size; i--) {
  for(let j=size; j>=Math.abs(i); j--){
    process.stdout.write("@");
  }
  numberX <=size ? console.log(numberX++) : console.log(--numberY);
}

  }

  SymmetricHistogram();

或尝试以下方法

https://onecompiler.com/javascript/3x58bqr3h

Answer 2

相同结果的两种不同方式。不太干净，但工作。

var symbol = prompt("Enter the symbol");
var number = prompt("Enter the number");
var currentNum = 1;
let textTOP = "";
let textBOTTOM = "";
let symbolNum = symbol;

while (currentNum <= number) {
  textTOP += "<br>" + symbolNum + " " + currentNum;
  if (currentNum < number)
      textBOTTOM = "<br>" + symbolNum + " " + currentNum + textBOTTOM;
  symbolNum += symbol;
  currentNum++;
}


document.write(textTOP + textBOTTOM + "<br>");

var symbol = '@';
var number = 13;

var currentNum = 1;
let text = "";

while (currentNum < number * 2) {
  
  if (currentNum <= number) {
    
    let num = currentNum;
    text += "<br>" + symbol.repeat(num) + " " + num;
    
  } else {
    
    let num = Math.abs(number * 2 - currentNum);
    text += "<br>" + symbol.repeat(num) + " " + num;
    
  }
  
  currentNum++;
}


document.write(text + "<br>");

我怎样才能制作这样的对称直方图？

How can I make a symmetric histogram like this?

html

javascript

loops

while-loop