Доступ к данным во вложенном массиве JSON с помощью jquery

Question

По какой-то причине у меня возникают проблемы с доступом к определенным значениям следующего вложенного массива:

[{
    "call_sign": "KTAB-TV",
    "facility_id": "59988",
    "operator": "Nexstar Media Group Inc",
    "programming_class": [{
        "primary": {
            "programming": "CBS",
            "resolution": "1080i",
            "resolution_type": "HD",
            "programming_classifier": "HD1"
        },
        "d_2": {
            "programming": "Telemundo",
            "resolution": "480i",
            "resolution_type": "SD",
            "programming_classifier": "SD1"
        },
        "d_3": {
            "programming": "Escape",
            "resolution": "480i",
            "resolution_type": "SD",
            "programming_classifier": "SD2"
        },
        "d_4": {
            "programming": "ION",
            "resolution": "480i",
            "resolution_type": "SD",
            "programming_classifier": "SD3"
        },
        "d_5": {
            "programming": "None",
            "resolution": "NULL",
            "resolution_type": "N\/A",
            "programming_classifier": "None"
        },
        "d-6": {
            "programming": "None",
            "resolution": "NULL",
            "resolution_type": "N\/A",
            "programming_classifier": "None"
        }
    }]
}]

В настоящее время мое лучшее предположение следующее:

$.ajax({
    method: "POST",
    url: "prep_station_data.php?sid=" + sid,
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(data) {
        console.log('success');
        for (key in data) {
            var value = data[key];
            console.log(value);
        }
        $.getJSON(jsonURL, function(key, value) {
            var resolutions = '';
            $.each(data[0].programming_class, function(key, value) {
                resolutions += value.resolution;

            });
            $('#primary_programming').append(resolutions);
        });
    },
    complete: function() {}
});
}

К сожалению,Я все еще получаю "неопределенный" результат.

Кроме того, мне бы очень хотелось узнать, как можно создать оператор if в jquery, который заполняет div, если ключ programming_classifier в массиве данных jsonэто конкретное значение.

Спасибо за любую помощь, как я застрял.

Answer 1

programming_class также является массивом с одним элементом.Итак ...

data[0].programming_class[0]

Вот рабочая функция обработки данных.

$(function() {

    var json = '[{"call_sign":"KTAB-TV","facility_id":"59988","operator":"Nexstar Media Group Inc","programming_class":[{"primary":{"programming":"CBS","resolution":"1080i","resolution_type":"HD","programming_classifier":"HD1"},"d_2":{"programming":"Telemundo","resolution":"480i","resolution_type":"SD","programming_classifier":"SD1"},"d_3":{"programming":"Escape","resolution":"480i","resolution_type":"SD","programming_classifier":"SD2"},"d_4":{"programming":"ION","resolution":"480i","resolution_type":"SD","programming_classifier":"SD3"},"d_5":{"programming":"None","resolution":"NULL","resolution_type":"N/A","programming_classifier":"None"},"d-6":{"programming":"None","resolution":"NULL","resolution_type":"N/A","programming_classifier":"None"}}]}]';

    function handleData(data) {
        var pc = data[0]['programming_class'][0];
        var ret = [];
        for (var i in pc) {
            if (pc.hasOwnProperty(i)) {
                for (var j in pc[i]) {
                    if (pc[i].hasOwnProperty(j)) {
                        if (j == 'resolution') {
                            ret.push(pc[i][j]);
                        }
                    }
                }
            }
        }
        return ret;
    }

    var stuff = handleData(JSON.parse(json));

    $('#content').text(stuff.join(', '));

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="content"></div>

Answer 2

Первое: обратный вызов getJSON не возвращает (key, value), он возвращается (parseArray, successString) =>, поэтому ваш цикл не будет работать.Проверьте ниже, возможное решение может быть: -

$.getJSON("https://api.jsonbin.io/b/5c7e2d275fe214587796753b", (data) => {
  
  // $.getJSON callback format returns  (data, status)
  // so if you get it as (key, value) you will get (Your JSON Array, "success") 
  // Solution is below
  
  data.forEach((value, key) => {
      if(value.programming_class){
          // programming class is an array in provided JSON
          // you can use static first index as well if it is fixed
          // value = value[0] to avoid  outer loop;
          value.programming_class.forEach((p) => {
              // p is not an array
              let keys = Object.keys(p);
              keys.forEach((k) => {
                  let classObj = p[k];
                  console.log(classObj);
                  // now you can perform actions on this object i-e: sum, multiple whatever
              });
          });
      }
  })
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>

Answer 3

это потому, что вы забыли добавить это, JSON.parse(), когда вы получаете результаты с сервера, который он возвращает в виде текста или неформатированной строки json, вы должны передать его через эту функцию для правильной визуализации javascript ..

поэтому здесь у нас будет -

 success: function(data) {

        data = JSON.parse(data);

        console.log('success');
        for (key in data) {
            var value = data[key];

    ...

Обратите внимание, что при получении данных с веб-сервера данные всегда являются строкой.я надеюсь, что это поможет.