JavaScript for..of 循环与 .includes() 方法 - 初学者有问题

Question

我刚刚开始学习 JavaScript 所以这可能是我的一个简单错误，但我遇到麻烦的地方是我应该为每个字符串向控制台打印不同的指令在每个数组中，当我运行我现在拥有的内容时，它每次都重复相同的元素，并在每次迭代时向它们添加下一个字符串，而不是为新数组中的每个单独的字符串提供指令。

这是我的代码：

const coffees = [ 
    "light colombian roast", "hawaiian dark roast", "guatemalan blend medium roast",
    "madagascar espresso roast", "jamaican dark blue", "jamaican medium roast",
    "salvador robusto light", "bali espresso roast"]

let lightRoast = []
let medRoast = []
let darkOrEspresso = []

for (const roast of coffees) 
{
    if (roast.includes("light") )
    {
        lightRoast.push(roast)
        console.log(`I'll have the ${lightRoast} and drink it black`)
    }
    else if (roast.includes("medium"))
    {
        medRoast.push(roast)
        console.log(`I'll have the ${medRoast} and add cream only`)
    }
    else if (roast.includes("dark") || roast.includes("espresso"))
    {
        darkOrEspresso.push(roast)
        console.log(`I'll have the ${darkOrEspresso} and add cream and sugar`)
    }
}

我正在尝试让控制台为新数组中的每个单独字符串打印这些说明，具体取决于它是在亮数组、中数组还是暗数组中：

"I'll have the xxx and drink it black" 
"I'll have the xxx and add cream only"
"I'll have the xxx and add cream and sugar"

但相反，我得到的结果是这样的，其中字符串在正确的数组中，但被添加到彼此之上，而不是每个都有自己的行：

I'll have the light colombian roast,salvador robusto light and drink it black
I'll have the guatemalan blend medium roast,jamaican medium roast and add cream only
I'll have the hawaiian dark roast,madagascar espresso roast,jamaican dark blue,bali espresso roast and add cream and sugar

有人介意看看我做错了什么吗？希望我的指示有意义。

Answer 1

尝试只打印烤肉，而不是整个数组：

const coffees = [ 
    "light colombian roast", "hawaiian dark roast", "guatemalan blend medium roast",
    "madagascar espresso roast", "jamaican dark blue", "jamaican medium roast",
    "salvador robusto light", "bali espresso roast"]

let lightRoast = []
let medRoast = []
let darkOrEspresso = []

for (const roast of coffees) 
{
    if (roast.includes("light") )
    {
        lightRoast.push(roast)
        console.log(`I'll have the ${roast} and drink it black`)
    }
    else if (roast.includes("medium"))
    {
        medRoast.push(roast)
        console.log(`I'll have the ${roast} and add cream only`)
    }
    else if (roast.includes("dark") || roast.includes("espresso"))
    {
        darkOrEspresso.push(roast)
        console.log(`I'll have the ${roast} and add cream and sugar`)
    }
}
console.log(lightRoast, medRoast, darkOrEspresso);

Answer 2

准确的变量名有助于防止错误。在这里，您的 lightRoast 变量是一个数组到目前为止已被确定为淡咖啡的咖啡名称。考虑重命名为 lightRoastNames（复数），并将 roast 重命名为 roastName（单数）。然后，问题应该很明显 - 你正在使用

console.log(`I'll have the ${lightRoastNames} and drink it black`)

什么时候应该使用

console.log(`I'll have the ${roastName} and drink it black`)

const coffees = [
  "light colombian roast", "hawaiian dark roast", "guatemalan blend medium roast",
  "madagascar espresso roast", "jamaican dark blue", "jamaican medium roast",
  "salvador robusto light", "bali espresso roast"
]

const lightRoastNames = [];
const medRoastNames = [];
const darkOrExpressoRoastNames = [];

for (const roastName of coffees) {
  if (roastName.includes("light")) {
    lightRoastNames.push(roastName)
    console.log(`I'll have the ${roastName} and drink it black`)
  } else if (roastName.includes("medium")) {
    medRoastNames.push(roastName)
    console.log(`I'll have the ${roastName} and add cream only`)
  } else if (roastName.includes("dark") || roastName.includes("espresso")) {
    darkOrExpressoRoastNames.push(roastName)
    console.log(`I'll have the ${roastName} and add cream and sugar`)
  }
}

不过，由于您似乎没有在任何地方使用数组，您可以完全删除它们并使代码更简单：

const coffees = [
  "light colombian roast", "hawaiian dark roast", "guatemalan blend medium roast",
  "madagascar espresso roast", "jamaican dark blue", "jamaican medium roast",
  "salvador robusto light", "bali espresso roast"
]

for (const roastName of coffees) {
  if (roastName.includes("light")) {
    console.log(`I'll have the ${roastName} and drink it black`)
  } else if (roastName.includes("medium")) {
    console.log(`I'll have the ${roastName} and add cream only`)
  } else if (roastName.includes("dark") || roastName.includes("espresso")) {
    console.log(`I'll have the ${roastName} and add cream and sugar`)
  }
}

JavaScript for..of 循环与 .includes() 方法 - 初学者有问题

JavaScript for..of loop with .includes() method - beginner having trouble

javascript

arrays

methods

include

for-of-loop