使用JavaScript将深层嵌套对象的值打印为数组

问题描述

我有以下对象，并且我试图创建一个将结果打印为仅包含嵌套'rgba'值作为数组的数组的函数：

const colorObject = {
  "colors": [
    {
      "color": "black","category": "hue","type": "primary","code": {
      "rgba": [255,255,1]
    }
    },{
      "color": "white","category": "value","code": {
      "rgba": [0,{
      "color": "red",{
      "color": "blue",{
      "color": "yellow",{
        "color": "green","type": "secondary","code": {
        "rgba": [0,1]
      }
    },]
}

到目前为止，我已经走了很长一段路并产生了结果，但是我知道必须有一种更有效的方法：

function dispArrayRgbaCode() {
  let arrayRgbaCode = [
    colorObject['colors'][0]['code']['rgba'],colorObject['colors'][1]['code']['rgba'],colorObject['colors'][2]['code']['rgba'],colorObject['colors'][3]['code']['rgba'],colorObject['colors'][4]['code']['rgba'],colorObject['colors'][5]['code']['rgba'],]
  console.log(arrayRgbaCode)
}

dispArrayRgbaCode()

我是全新的，并且已经签出了MDN文档中的对象使用说明。我想问问社区应该是我的荣幸，所以我也可以向同龄人学习。任何指导将不胜感激。

解决方法

您可以使用Array.map从rgba数组中的每个对象中提取colorObject.colors值并返回它们的数组：

colorObject.colors.map(c => c.code.rgba)

演示：

const colorObject = {
  "colors": [{
      "color": "black","category": "hue","type": "primary","code": {
        "rgba": [255,255,1]
      }
    },{
      "color": "white","category": "value","code": {
        "rgba": [0,{
      "color": "red",{
      "color": "blue",{
      "color": "yellow",{
      "color": "green","type": "secondary",]
}

console.log(colorObject.colors.map(c => c.code.rgba));

,

您可以使用Mapper并实现以下目标。

const colorObject = {
  "colors": [{
      "color": "black",]
};


var newRgbaArray = colorObject.colors.map(function(rgbaItem) {
  return rgbaItem.code.rgba;
});

console.log(newRgbaArray);