JavaScript, как разобрать массив JSON - PullRequest
Новая
       6

JavaScript, как разобрать массив JSON

77 голосов
/ 03 апреля 2012

Я использую Sencha Touch (ExtJS), чтобы получить сообщение JSON с сервера. Я получаю следующее сообщение: 

{
"success": true,
"counters": [
    {
        "counter_name": "dsd",
        "counter_type": "sds",
        "counter_unit": "sds"
    },
    {
        "counter_name": "gdg",
        "counter_type": "dfd",
        "counter_unit": "ds"
    },
    {
        "counter_name": "sdsData",
        "counter_type": "sds",
        "counter_unit": "   dd       "
    },
    {
        "counter_name": "Stoc final",
        "counter_type": "number    ",
        "counter_unit": "litri     "
    },
    {
        "counter_name": "Consum GPL",
        "counter_type": "number    ",
        "counter_unit": "litri     "
    },
    {
        "counter_name": "sdg",
        "counter_type": "dfg",
        "counter_unit": "gfgd"
    },
    {
        "counter_name": "dfgd",
        "counter_type": "fgf",
        "counter_unit": "liggtggggri     "
    },
    {
        "counter_name": "fgd",
        "counter_type": "dfg",
        "counter_unit": "kwfgf       "
    },
    {
        "counter_name": "dfg",
        "counter_type": "dfg",
        "counter_unit": "dg"
    },
    {
        "counter_name": "gd",
        "counter_type": "dfg",
        "counter_unit": "dfg"
    }

    ]
}

Моя проблема в том, что я не могу разобрать этот объект JSON, чтобы я мог использовать каждый из объектов счетчика.

Я пытаюсь сделать это так: 

var jsonData = Ext.util.JSON.decode(myMessage);
for (var counter in jsonData.counters) {
     console.log(counter.counter_name);
 }

Что я делаю не так? Спасибо!

Ответы [ 9 ]

123 голосов
/ 03 апреля 2012

Javascript имеет встроенный анализ JSON для строк, который, я думаю, у вас есть: 

var myObject = JSON.parse("my json string");

для использования с вашим примером будет: 

var jsonData = JSON.parse(myMessage);
for (var i = 0; i < jsonData.counters.length; i++) {
    var counter = jsonData.counters[i];
    console.log(counter.counter_name);
}

Вот рабочий пример

РЕДАКТИРОВАТЬ : При использовании цикла for произошла ошибка (я пропустил это при первом чтении, кредит @Evert за спот). использование цикла for-in установит var в качестве имени свойства текущего цикла, а не фактических данных. Смотрите мой обновленный цикл выше для правильного использования

ВАЖНО : метод JSON.parse не будет работать в старых старых браузерах - поэтому, если вы планируете сделать свой веб-сайт доступным через какое-то изнурительное интернет-соединение, это может стать проблемой! Если вам действительно интересно, вот график поддержки (который помечает все мои поля).

6 голосов
/ 03 апреля 2012

В цикле for переменная содержит имя свойства, а не значение свойства. 

for (var counter in jsonData.counters) {
    console.log(jsonData.counters[counter].counter_name);
}

Но так как счетчики - это массив, вы должны использовать обычный цикл for: 

for (var i=0; i<jsonData.counters.length; i++) {
    var counter = jsonData.counters[i];
    console.log(counter.counter_name);
}
5 голосов
/ 19 марта 2013

Это мой ответ, 

<!DOCTYPE html>
<html>
<body>
<h2>Create Object from JSON String</h2>
<p>
First Name: <span id="fname"></span><br> 
Last Name: <span id="lname"></span><br> 
</p> 
<script>
var txt = '{"employees":[' +
'{"firstName":"John","lastName":"Doe" },' +
'{"firstName":"Anna","lastName":"Smith" },' +
'{"firstName":"Peter","lastName":"Jones" }]}';

//var jsonData = eval ("(" + txt + ")");
var jsonData = JSON.parse(txt);
for (var i = 0; i < jsonData.employees.length; i++) {
    var counter = jsonData.employees[i];
    //console.log(counter.counter_name);
    alert(counter.firstName);
}

</script>
</body>
</html>
1 голос
/ 30 мая 2017

«Способ Сенча» для взаимодействия с данными сервера настраивает Ext.data.Store с прокси на Ext.data.proxy.Proxy (в данном случае Ext.data.proxy.Ajax), снабженный Ext.data.reader.Json (для данных в кодировке JSON, есть другие устройства чтениядоступно также).Для записи данных обратно на сервер есть Ext.data.writer.Writer s нескольких видов.

Вот пример такой установки: 

    var store = Ext.create('Ext.data.Store', {
        fields: [
            'counter_name',
            'counter_type',
            'counter_unit'
        ],

        proxy: {
            type: 'ajax',
            url: 'data1.json',

            reader: {
                type: 'json',
                idProperty: 'counter_name',
                rootProperty: 'counters'
            }
        }
    });

data1.json в этом примере (также доступнов эта скрипка ) содержит ваши данные дословно.idProperty: 'counter_name', вероятно, является необязательным в этом случае, но обычно указывает на атрибут первичного ключа.rootProperty: 'counters' указывает, какое свойство содержит массив элементов данных.

При такой настройке хранилища вы можете перечитать данные с сервера, вызвав store.load().Вы также можете подключить хранилище к любым соответствующим компонентам пользовательского интерфейса Sencha Touch, таким как сетки, списки или формы.

0 голосов
/ 05 мая 2019

Ответ с более высоким голосом имеет ошибку. когда я использую это, я узнаю это в строке 3: 

var counter = jsonData.counters[i];

Я изменил его на: 

var counter = jsonData[i].counters;

и у меня это сработало. Есть разница с другими ответами в строке 3: 

var jsonData = JSON.parse(myMessage);
for (var i = 0; i < jsonData.counters.length; i++) {
    var counter = jsonData[i].counters;
    console.log(counter.counter_name);
}
0 голосов
/ 25 июля 2018

Это работает как шарм!

Поэтому я отредактировал код в соответствии с моим требованием. И вот изменения: Это сохранит идентификационный номер из ответа в переменную окружения. 

var jsonData = JSON.parse(responseBody);
for (var i = 0; i < jsonData.data.length; i++)
{
    var counter = jsonData.data[i];
    postman.setEnvironmentVariable("schID", counter.id);
}
0 голосов
/ 30 мая 2018

Не уверен, что мои данные точно совпадают, но у меня был массив массивов объектов JSON, которые были экспортированы из jQuery FormBuilder при использовании страниц.

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

Данные выглядели примерно так: 

var allData = 
[
    [
        {
            "type":"text",
            "label":"Text Field"
        }, 
        {
            "type":"text",
            "label":"Text Field"
        }
    ],
    [
        {
            "type":"text",
            "label":"Text Field"
        }, 
        {
            "type":"text",
            "label":"Text Field"
        }
    ]
]

Чтобы разобрать это, я просто сделал следующее: 

JSON.parse("["+allData.toString()+"]")
0 голосов
/ 30 мая 2017

Что-то более важное для меня .. 

var jsontext = '{"firstname":"Jesper","surname":"Aaberg","phone":["555-0100","555-0120"]}';  
var contact = JSON.parse(jsontext);  
document.write(contact.surname + ", " + contact.firstname);  
document.write(contact.phone[1]);  
// Output:  
// Aaberg, Jesper  
// 555-0100

Ссылка: https://docs.microsoft.com/en-us/scripting/javascript/reference/json-parse-function-javascript

0 голосов
/ 03 апреля 2012

Вы должны использовать хранилище данных и прокси в ExtJ. Существует множество примеров этого, и программа чтения JSON автоматически анализирует сообщение JSON в указанной вами модели.

Нет необходимости использовать базовый Javascript при использовании ExtJs, все по-другому, вы должны использовать способы ExtJs, чтобы все было правильно. Внимательно читайте там документацию, это хорошо.

Кстати, эти примеры также применимы к Sencha Touch (особенно v2), который основан на тех же основных функциях, что и ExtJ.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...