如何迭代 json 对象结构以仅获取名称？答案

【问题标题】：How to iterate json object structure to get only names?如何迭代 json 对象结构以仅获取名称？
【发布时间】：2016-05-04 10:58:21
【问题描述】：

我有以下 json 对象，如何获取/循环仅获取名称值？

var jsonobject = {
    "jsontest": [{
        "name": "firstnamevalue",
        "firstkey": "firstvalue"

    }, {
        "name": "secondnamevalue",
        "secondkey": "secondvalue",
        "thirdkey": false
    }, {
        "name": "thirdnamevalue",
        "fourthkey": null
    }],
    "fifthkey": "testvalues"
}

我只需要名称值，例如：firstnamevalue, secondnamevalue, thirdnamevalue 在我的警报消息中？请让我知道并提前感谢。

【问题讨论】：

您可以轻松使用简单的 for 循环，因为 jsonobject.jsontest 是一个数组

标签： javascript jquery angularjs json

【解决方案1】：

您可以使用 javascript map 方法根据您的要求获取数组值。

  var results = jsonobject.jsontest.map(function(item,index){
     return item["name"];

    })
    results //
["firstnamevalue", "secondnamevalue", "thirdnamevalue"]

带有粗箭头的 ES2015 (ES6)

jsonobject.jsontest.map((item,index)=> item["name"])

【讨论】：

【解决方案2】：

如果你使用下划线或lodash。可以这样做：

_.pluck(jsonObject.jsonTest, 'name');

数组的映射函数

 var names= jsonobject.jsontest.map(function(item,index){
     return item["name"];
    })

【讨论】：

pluck 在 lo dash 中已弃用，但您可以以相同的方式使用 map，因此我将显示 _.map 来替换您的 _.pluck

【解决方案3】：

你可以使用javascript的forEach方法

var arr=jsonobject.jsontest;
arr.forEach(function(item, index){console.log(item.name)})

【讨论】：

【解决方案4】：

我将在这里简单介绍一下 JavaScript 解决方案：首先，您可能必须解析出这个 JSON，因为您有 angular，您可以安全地使用 `angular.fromJson(obj)' 进行解析

var jsonObj = angular.fromJson(jsonobject)

然后

var nameArray = [];

设置空数组，您可以在其中存储名称，也可以使用 map 但不那么简单。

for (var i = 0; i < jsonObj.jsonsontest.length; i++){

设置for循环..

nameArray.push( jsonObj.jsonsontest[i].name);

添加元素

} 关闭一个 for 循环...

这是漫长的一步一步。

【讨论】：

【解决方案5】：

通过这个，使用jsonobject.jsontest来解决你的问题

var jimApp = angular.module("mainApp",  []);

jimApp.controller('mainCtrl', function($scope){
  var jsonobject = {
    "jsontest": [{
        "name": "firstnamevalue",
        "firstkey": "firstvalue"

    }, {
        "name": "secondnamevalue",
        "secondkey": "secondvalue",
        "thirdkey": false
    }, {
        "name": "thirdnamevalue",
        "fourthkey": null
    }],
    "fifthkey": "testvalues"
};
  
  $scope.results = jsonobject.jsontest.map(function(item,index){
     return item["name"];

    })
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="mainApp" ng-controller="mainCtrl">
  {{results}}
</div>

【讨论】：

角码完全是多余的，只会污染答案
另外，如果您要显示 HTML，可能只需使用 <span ng-repeat='person in jsonObj.jsonTest'> {{person.name}}