首页 > 解决方案 > JavaScript 函数返回未定义,但记录到控制台得到正确的值?

问题描述

我不知道如何更好地表达这个问题,但我有一个嵌套对象,我试图迭代并从name键中检索值。

JS小提琴

示例对象:

const colors = {
  blues: {
    "Neutral Blue": {
      name: "Blue" //trying to get this value depth here.
    },

    "Dark Blue": {
      name: "Navy"
    },

    "Light Blue": {
      name: "Azure"
    },

    "Green Blue": {
      name: "Teal"
    }
  },

  greens: {
    "Light Green": {
      name: "Seafoam"
    },

    "Blueish Green": {
      name: "Mint"
    },

    "Grey Green": {
      name: "sage"
    },
  },

  reds: {
    "Light Red": {
      name: "blush"
    },
    "Neutral Red": {
      name: "Scarlett"
    },
    "Dark Red": {
      name: "Merlot"
    },
  },
}

我试图在这里运行这个函数来检索值列表:

let data = Object.values(colors).flatMap((z) => Object.values(z))

const searchNames = (allColors) => {
    
  let colors = Object.values(allColors);
    

  colors.forEach((color) => {
      return color.name //returns undefined
    });
  };
    

console.log(searchNames(data)) //returns undefined

但是,如果我将 return 语句更改为 a console.log(color.name),我会得到预期的结果。我究竟做错了什么?

我的问题的第二部分是如何用所有这些值填充数组。谢谢你的帮助。

标签: javascript

解决方案


forEach 不会改变数组。试试colors.map()

var data = colors.map((color) => {
  return color.name
});
};
console.log(data)

推荐阅读