具有单一功能的 JavaScript 三角形

Question

我正在使用 Javascript 制作三角形，通常我不得不使用 2 个函数来制作一个。不过，我最近尝试创建一个具有单个功能的功能，并且效果很好。但我不确定为什么或如何在每次运行 for 循环后开始一个新行，因为我从未在单个函数的代码中的任何地方提到“\n”。谁能解释为什么它仍然有效？谢谢。

    function tri(num){
  var star = '';
  for(var i = 1; i <= num; i++){
    var star = star + " *";
    console.log(star)
  }
}
tri(10)

这是我使用 2 个函数的方法

    function horiztonal(num){
  var star = "";
  for(var i = 0; i <= num; i++){
    var star = star + " *"
  }
  console.log(star)
}


function buildTri(num){
  var star = "";
  for(var i = 0; i < num; i++){
    var star = star + horiztonal(i)
  }
  console.log(star)
}

buildTri(10)

在运行 2 次函数尝试后，还有一串重复的“未定义”，所以如果有人能解释一下，我真的很感激。再次感谢。

Answer 1

打印“未定义”的原因是您混淆了返回字符串的函数和写入 console.log() 的函数。如果你仔细研究，horizo​​ntal()，你会看到它正在写入控制台......没有返回值。但是，如果您仔细研究 tri() 函数，您会发现它期望 Horizo​​ntal() 返回一个字符串。即两个假设不一致。因此，您得到的行为是 console.log 的输出以及 undefined 的连接，因为您的函数没有返回任何值。

我做了以下整改：

• 让horizontal()返回星星行
• 删除过度使用var 关键字。你到处都有var star，而且，真的，你声明了一次，然后到处使用它
• 现在我们正在返回字符串，我必须在字符串中添加一个换行符（在 console.log 为您提供免费换行符之前）
• 我做了一些小的格式和间距调整
• 将变量从 star 重命名为 stars（为了正确起见，因为字符串将包含星号集合）

function horiztonal(num) {
  var stars = "";
  for (var i = 0; i <= num; i++) {
    stars = stars + " *"
  }
  return stars;
}


function buildTri(num) {
  var stars = "";
  for (var i = 0; i < num; i++) {
    stars = stars + horiztonal(i) + "\n";
  }
  console.log(stars)
}

buildTri(10);

Answer 2

1. Console.log 打印您在每次迭代中传递的参数
2. 函数返回未定义。 console.log 没有明确返回任何内容。

也许这个例子会有所帮助。

function tri(num){
  var star = '';
  for(var i = 1; i <= num; i++){
    var star = star + " *";
    console.log(star)

  }
     return "Finished"; //explicitly returning
}
tri(10)

现在我们显式地返回一个值。