如何循环对象strIngredient1至15属性创建新数组？解决取值错误

你的代码生成undefined1这类无效元素的核心原因是错误的对象属性访问方式，以及未正确获取属性值，具体修正如下：

错误原因分析 #

• koktelData中不存在strIngredient这个属性，只有strIngredient1到strIngredient15，所以koktelData.strIngredient会返回undefined，拼接[i]后就变成了"undefined1"这类无意义字符串。
• 动态访问对象属性时，必须使用括号表示法，而不是直接拼接字符串。

正确代码实现 #

方式一：基础for循环（带空值过滤） #

let sastojci = [];
for (let i = 1; i <= 15; i++) {
  // 动态拼接属性名，用括号访问对象属性
  const ingredient = koktelData[`strIngredient${i}`];
  // 过滤空值、undefined，避免数组混入无效元素
  if (ingredient) {
    sastojci.push(ingredient);
  }
}
console.log(sastojci);

方式二：更简洁的数组生成写法 #

const sastojci = Array.from({ length: 15 }, (_, idx) => {
  return koktelData[`strIngredient${idx + 1}`];
}).filter(Boolean); // 自动过滤空值、undefined、false等无效值
console.log(sastojci);

内容的提问来源于stack exchange，提问作者aLEKSANDAR mILOSAVLJEVIC