我的JS代码是否适合“99瓶啤酒在墙上”的歌曲？

Question

JS新手在这里寻找一些建议。我一直在研究Head First JavaScript Programming一书，它向我展示了如何将'99瓶啤酒在墙上'的歌曲登录到控制台。这是原始代码：

var word = "bottles";
var count = 99;
while (count > 0) {
    console.log(count + " " + word + " of beer on the wall");
    console.log(count + " " + word + " of beer,");
    console.log("Take one down, pass it around,");
    count = count - 1;
    if (count > 0) {
        console.log(count + " " + word + " of beer on the wall.");
    } else {
        console.log("No more " + word + " of beer on the wall.");
    }
}

没有给出答案，它表明代码是可以的，但不是100％正确，并询问你是否可以找到该缺陷并修复它。在查看控制台后，我发现while循环没有考虑到一旦你在歌曲中喝到一瓶啤酒，“瓶子”这个词就需要变成“瓶子”。我在循环中添加了一些if语句，以便在需要时将var字变为“bottle”。代码似乎现在正常工作：

var word = "bottles";
var count = 99;
while (count > 0) {
  if (count == 1){
    var word = "bottle"
  }
    console.log(count + " " + word + " of beer on the wall");
    console.log(count + " " + word + " of beer,");
    console.log("Take one down, pass it around,");
    count = count - 1;
    if (count > 0) {
      if (count == 1){
        var word = "bottle"
      }
        console.log(count + " " + word + " of beer on the wall.");
    } else {
      if (count < 1){
        var word = "bottles"
      }
        console.log("No more " + word + " of beer on the wall.");
    }
}

我的问题是 - 有没有比我的尝试更好或更简洁的方法呢？我有一种感觉，我的尝试有点凌乱。我知道你可以使用For循环，但是这个例子使用了While循环，所以我想坚持下去，如果可能的话。

非常感谢！

Answer 1

您可以通过用简洁的三元表达式替换那些庞大的if else语句来整理您的逻辑：

while (count > 0) {
    var bottle = count == 1 ? "bottle" : "bottles";
    console.log(count + " " + word + " of beer on the wall");
    console.log(count + " " + word + " of beer,");
    console.log("Take one down, pass it around,");
    --count;
    var bottle = count == 1 ? "bottle" : "bottles";
    console.log(count + " " + word + " of beer on the wall.");
}

这是一个语法假设，短语0 bottles of beer on the wall是正确的，是我们想要使用的。这听起来对我来说，但我认为技术上0或1瓶应该是单数。

Answer 2

既然你想贴近这个例子，我只会指出你可以跳过

if (count < 1){
    var word = "bottles"
  }

如果你改变

 if (count == 1){
    var word = "bottle"
  }

成

if (count == 1){
    word = "bottle"
  }

并将var声明放在这里：

while (count > 0) {
    var word = "bottles";

还有很多其他的东西你也可以缩短，但这可能会让它变得更加困难。

Answer 3

一种可能性是将整个瓶子词的内容提取到一个单独的函数中。这样，你只需要改变原始代码中的任何内容

var count = 99;
while (count > 0) {
    console.log(count + " " + getBottleWord(count) + " of beer on the wall");
    console.log(count + " " + getBottleWord(count) + " of beer,");
    console.log("Take one down, pass it around,");
    count = count - 1;
    if (count > 0) {
        console.log(count + " " + getBottleWord(count) + " of beer on the wall.");
    } else {
        console.log("No more " + getBottleWord(count) + " of beer on the wall.");
    }
}

function getBottleWord(count) {
    return count === 1 ? "bottle" : "bottles";
}

Answer 4

// Instead of var you can start using 'const' for variables that will not be changed
// and 'let' for variables that will be changed.
let word = "bottles";
let count = 99;
while (count > 0) {
    if (count == 1){
        // No need to recall 'var' here, you are reassigning an existing var not creating a new one.
        // Can just do:
        // word = "bottle"
        word = "bottle"
    }
    /* As of ES6 You can use string templets here:
     *
     * console.log(`${count} ${word} of beer on the wall`);
     * console.log(`${count} ${word} of beer,`);
     * console.log("Take one down, pass it around,");
     */
    console.log(count + " " + word + " of beer on the wall");
    console.log(count + " " + word + " of beer,");
    console.log("Take one down, pass it around,");

    count = count - 1;
    /* For the word changing, you can lose some code by not actually changing the string,
     * That way you will not need to reassign it back to plural again when the count is 0
     * To take the 'bottles' string without the final plural 's' character use:
     * word.slice(0,-1);
     */
    if (count > 0) {
      if (count == 1){
        console.log(count + " " + word.slice(0, -1) + " of beer on the wall.");
      }
    } else {
        // now you can lost this if statment.
        console.log("No more " + word + " of beer on the wall.");
    }
}

Answer 5

你可以使用递归来用更少的瓶调用相同的函数，直到你得到0计数

const pluralize = (i, word) => word + (i > 1 ? 's': '')
  
const bottles = count => {
  console.log(`${count} ${pluralize(count, 'bottle')} of beer on the wall.`)
  console.log(`${count} ${pluralize(count, 'bottle')} of beer.`)
  console.log(`Take one down, pass it around`)
  if (count > 1) {
    console.log(`${count - 1} ${pluralize(count - 1, 'bottle')} of beer on the wall.`)
    bottles(count - 1) // recursively call the bottles function with one less bottle
  }
  else {
    console.log(`No more bottles of beer on the wall.`)
  }
}

bottles(12)

Answer 6

好吧，你可以将if-else语句重写为更多succint，例如：

var word = "bottles";
var count = 99;
while (count > 0) {
    console.log(count + " " + word + " of beer on the wall");
    console.log(count + " " + word + " of beer,");
    console.log("Take one down, pass it around,");
    count = count - 1;
    if (count > 1) {
        console.log(count + " " + count + " of beer on the wall.");
    } else if(count == 1) {
        console.log(count + " bottle of beer on the wall."); 
    } else {
        console.log("No more " + word + " of beer on the wall.");
    }
}

但值得在你的问题中指出的部分是：注意多个var word = "bottles"句子，并且，一般来说，使用var关键字及其警告，特别是在其范围方面。例如，考虑var和let及其各自的scopes之间的区别。