如何获取数组中用于填充下拉选项的键值。Javascript

我有一个数组，我想加载operatingSystem值作为下拉选项

array = [
{count: "7", operatingSystem: "MacOS X"},
{count: "2", operatingSystem: "Windows 2012"},
{count: "2", operatingSystem: "FreeBSD / MacOS X"},  
{count: "2", operatingSystem: "Linux 2.2-2.6"},
{count: "2"}];

我是这样做的：

    renderFilterList(array) {
          let array2=[];
        array.map(function(obj, index) {
          Object.keys(obj).forEach(function(val) { 
            array2.push({label: val.groupBy, key: index}); 
          });
        });
// the above does not work as I'm not getting the value of the key `operatingSystem` inside in the array loop. The value `operatingSystem` is dynamic and is subject to change depending on the data I get.

//following is a internal react component im using to get the values in the dropdown
             <Dropdown
                    placeholder= "Select a value ..."
                    value={value}
                    listItems={array2}
                    key={key}
                    onSelect={this.onGroupValueSelect.bind()} />
                  </div>

    }

如何获取键值，以便能够使用数组中的值填充下拉选项？

---

有什么想法吗？？谢谢

我不知道您的

下拉列表
组件是什么样子的，但是，给定数组值，我会这样做

<select>
     { arr.map((item, index) => <option value={item.operatingSystem}>
       {item.operatingSystem}</option>) }
 </select>

更新了fiddle
如果您的数据有问题：最后一个条目没有
操作系统
键。现在我们可以先
过滤
，然后
映射
，但这是次优的，因为在内部它们都在数据上循环，因此会产生两个循环

如果没有
操作系统
键的数据始终是可能的，那么我认为您最好的选择是
减少
——它将循环减少到仅一次

let array2 = array.reduce((result, value, index) => {
  if (value.operatingSystem) {
    result.push({label: value.operatingSystem, key: result.length + 1})
  }
  return result;
}, []);

我喜欢这一点，而不是
forEach
（或
for
循环），您不需要单独初始化
array2=[]
，然后将
推到它上面；而是将
reduce
的结果直接分配给
array2
。请注意，我没有使用
索引
变量，但您可以编写
结果。按如下所示按
行，如果您需要，可能会得到不同的键，具体取决于您有多少数据以及有多少可能没有填充
操作系统
键：

result.push（{label:value.operatingSystem，key:index+1}）

如果您意外地包含了一个没有
操作系统
键的条目，并且他们实际上始终拥有该键，则只需使用
映射
，而不是使用
forEach
内部的方式：

let array2 = array.map((value, index) => {return {
  label: value.operatingSystem,
  key: index + 1
}});

为什么要使用
map
而不让它返回任何东西：这就是
map
的全部要点：是的，我会让它返回数组2，但现在，我一直在向数组2填充适当的值。不，调用
map
不会返回
array2
——怎么可能，
map
中没有
return
语句。您试图做的是从调用
map
中的（多余的）
forEach
填充
array2
。此外，
数组中的值之间没有逗号分隔。对不起，我忘了提到值“operatingSystem”是动态的，根据我获得的数据而变化。它可以是任何值，因此这可能对我不起作用..那么它总是在第二个索引中吗？是的，它总是第二个索引，但是动态键如果你真的想让键成为下拉列表的值，那么你可以用
value={item[secondKey]}
替换
value=[index+1]
let array2 = array.reduce((result, value, index) => {
  if (value.operatingSystem) {
    result.push({label: value.operatingSystem, key: result.length + 1})
  }
  return result;
}, []);

let array2 = array.map((value, index) => {return {
  label: value.operatingSystem,
  key: index + 1
}});