【问题标题】:JSON response parsing in Javascript to get key/value pair [duplicate]在Javascript中解析JSON响应以获取键/值对[重复]
【发布时间】:2012-12-11 06:48:49
【问题描述】:

如何仅在 Javascript 中获取每个对象的名称和值?

【问题讨论】:

标签: javascript json parsing


【解决方案1】:

有两种方法可以访问对象的属性:

var obj = {a: 'foo', b: 'bar'};

obj.a //foo
obj['b'] //bar

或者,如果您需要动态执行:

var key = 'b';
obj[key] //bar

如果您还没有将其作为对象,则需要convert it

举一个更复杂的例子,假设你有一个代表用户的对象数组:

var users = [{name: 'Corbin', age: 20, favoriteFoods: ['ice cream', 'pizza']},
             {name: 'John', age: 25, favoriteFoods: ['ice cream', 'skittle']}];

要访问第二个用户的年龄属性,您可以使用users[1].age。要访问第一个用户的第二个“favoriteFood”,您可以使用users[0].favoriteFoods[2]

另一个例子:obj[2].key[3]["some key"]

这将访问名为 2 的数组的第三个元素。然后,它将访问该数组中的“key”,转到该数组的第三个元素,然后访问属性名称 some key


正如 Amadan 所指出的,可能还值得讨论如何循环不同的结构。

要遍历数组,可以使用简单的 for 循环:

var arr = ['a', 'b', 'c'],
    i;
for (i = 0; i < arr.length; ++i) {
    console.log(arr[i]);
}

循环一个对象有点复杂。如果您绝对肯定该对象是普通对象,则可以使用普通的 for (x in obj) { } 循环,但添加 hasOwnProperty 检查会更安全。在您无法验证对象不具有继承属性的情况下,这是必需的。 (它还对代码进行了一些未来的验证。)

var user = {name: 'Corbin', age: 20, location: 'USA'},
    key;

for (key in user) {
    if (user.hasOwnProperty(key)) {
        console.log(key + " = " + user[key]);
    }
}    

(请注意,我假设您使用的任何 JS 实现都有 console.log。如果没有,您可以使用 alert 或某种 DOM 操作。)

【讨论】:

  • 我投了赞成票,但令我震惊的是他想要“每个人的名称和价值”,所以for..inhasOwnProperty 的讨论也可能是必要的。
  • @Amadan 够公平的。稍后会添加它。
  • 但在上面的问题中,它的 json 响应与您对 pls check 所做的响应不同:)
  • 赞成。很好,详细的答案。
  • @user1927722 与您的对象相同的概念:obj.c.a[0].name //"cable - black"obj['c']['a'][0]['name'] //"cable - black"(或两者的任意组合)
【解决方案2】:

github 试用 Douglas Crockford 的 JSON 解析器。 然后,您可以简单地从您的 String 变量中创建一个 JSON 对象,如下所示:

var JSONText = '{"c":{"a":[{"name":"cable - black","value":2},{"name":"case","value":2}]},"o":{"v":[{"name":"over the ear headphones - white/purple","value":1}]},"l":{"e":[{"name":"lens cleaner","value":1}]},"h":{"d":[{"name":"hdmi cable","value":1},{"name":"hdtv essentials (hdtv cable setup)","value":1},{"name":"hd dvd \u0026 blue-ray disc lens cleaner","value":1}]}'

var JSONObject = JSON.parse(JSONText);
var c = JSONObject["c"];
var o = JSONObject["o"];

【讨论】:

    【解决方案3】:

    好的,JS代码如下:

    var data = JSON.parse('{"c":{"a":{"name":"cable - black","value":2}}}')
    
    for (var event in data) {
        var dataCopy = data[event];
        for (data in dataCopy) {
            var mainData = dataCopy[data];
            for (key in mainData) {
                if (key.match(/name|value/)) {
                    alert('key : ' + key + ':: value : ' + mainData[key])
                }
            }
        }
    }​
    

    FIDDLE HERE

    【讨论】:

      【解决方案4】:
      var yourobj={
      "c":{
          "a":[{"name":"cable - black","value":2},{"name":"case","value":2}]
          },
      "o":{
          "v":[{"name":"over the ear headphones - white/purple","value":1}]
      },
      "l":{
          "e":[{"name":"lens cleaner","value":1}]
      },
      "h":{
          "d":[{"name":"hdmi cable","value":1},
               {"name":"hdtv essentials (hdtv cable setup)","value":1},
               {"name":"hd dvd \u0026 blue-ray disc lens cleaner","value":1}]
      }}
      
      • 首先,组织起来是个好主意
      • 顶级引用必须是比 a..v... 等更方便的名称
      • 在 o.v,o.i.e 不需要数组 [] 因为它是一个 json 条目

      我的解决方案

      var obj = [];
      for(n1 in yourjson)
          for(n1_1 in yourjson[n])
              for(n1_2 in yourjson[n][n1_1])
                  obj[n1_2[name]] = n1_2[value];
      

      批准的代码

      for(n1 in yourobj){
          for(n1_1 in yourobj[n1]){
          for(n1_2 in yourobj[n1][n1_1]){
                  for(n1_3 in yourobj[n1][n1_1][n1_2]){
            obj[yourobj[n1][n1_1][n1_2].name]=yourobj[n1][n1_1][n1_2].value;
                  }
          }
       }
      }
      console.log(obj);
      

      结果

      *在使用 [] 方法或点表示法时应使用区分附件

      【讨论】:

      • 这不回答问题,或多或少是主观意见的清单,你的最后一点是错误的。
      • 最后一点不是重点,这是我的建议,我没有错,因为不知道数组的确切结构等是 OO 中提到的一个大问题
      • JSON 的结构清晰一致。顶级对象,其中每个属性都是另一个对象,其中每个属性都是一个数组。这怎么不是分层的?
      • 不,它是分层的,但您处理的对象类型是什么,目前尚不清楚为什么以这种方式放置以及出于什么原因
      • 感谢您更新您的答案,但您的解决方案不正确。我建议先在jsfiddle.net 进行测试。
      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2014-07-12
      • 2013-09-25
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多