如何将嵌套的对象数组转换为 Reactjs 中的字符串数组？答案

【问题标题】：How to convert nested array of object into array of strings in Reactjs?如何将嵌套的对象数组转换为 Reactjs 中的字符串数组？
【发布时间】：2026-02-11 06:45:01
【问题描述】：

我想将以下 JSON 结构映射并转换为简单字符串数组，但在映射时出现未定义错误。

JSON 结构：

var yourArray = [ 
            {
            "options": [
                {
                    'id':1,
                    'name':'All'
                },{
                    'id':2,
                    'name':'Javascript'
                },{
                    'id':2000,
                    'name':'Ruby'
                }    
            ]
            }
        ];

尝试像这样映射：

var newArray = yourArray.map( function( el ){ 
    yourArray.options.map( function( eln ){ 
      return eln.name; 
    })
});
console.log (newArray);

注意：按照这个例子How do I convert a javascript object array to a string array of the object attribute I want?

【问题讨论】：

标签： javascript arrays reactjs ecmascript-6

【解决方案1】：

您的代码中有两个问题

这里没有返回var newArray = yourArray.map( function( el ){ el.options.map( function( eln )。
第二个yourArray.options，您需要使用索引或el 作为参数访问函数调用。

var yourArray = [{"options": [{'id':1,'name':'All'},{'id':2,'name':'Javascript'},{'id':2000,'name':'Ruby'}]}];

var newArray = yourArray.map( function( el ){ 
  return el.options.map( function( eln ){ 
    return eln.name; 
  })
});
console.log (newArray);

更新：

感谢您的回答，很抱歉再次打扰您，我的实际 JSON 结构是这样的 { "brand": [ {"options": [{"catgeory_name": "Sigma"},{"catgeory_name": "Footner"}]} ] } 我们如何映射得到像这样的输出 ["Sigma", "Footner"] 因为我还在映射时出现未定义的错误

let data = { "brand": [ {"options": [{"catgeory_name": "Sigma"},{"catgeory_name": "Footner"}]} ] }

let op = data.brand[0].options.map(({catgeory_name})=>catgeory_name)

console.log(op)

【讨论】：

不需要用户 2 映射此 json。如果我们只有多个选项，我们需要使用 2 个地图
@AkhilAravind 如果您看到我刚刚编辑了 op 发布的代码，以向他展示他的代码中存在哪些问题。并且很有可能 op 刚刚发布了一个示例输入，但从他的代码看来，他正在将它用于具有更多元素的数组的输入。
我刚刚给你看了，仅此而已。在他的 json - 他只有一个选项对象。所以我们可以use array[index].option
@CodeManiac : 谢谢你的回答，很抱歉再次打扰你，我的实际 JSON 结构是这样的 { "brand": [ {"options": [{"catgeory_name": "Sigma"},{"catgeory_name": "Footner"}]} ] } 我们如何映射它以获得这样的输出 ["Sigma", "Footner"] 因为我还在映射时出现未定义的错误。我的道具中有这样的数据let filterbrandsnew = this.props.tvfilter.brand

【解决方案2】：

这里是使用地图的简单解决方案，由于选项在第一个索引内，您可以使用yourArray[0]

var yourArray = [ 
            {
            "options": [
                {
                    'id':1,
                    'name':'All'
                },{
                    'id':2,
                    'name':'Javascript'
                },{
                    'id':2000,
                    'name':'Ruby'
                }    
            ]
            }
        ];
        
var newArray = yourArray[0].options.map(i => i.name)
console.log(newArray)

【讨论】：