Javascript cách phân tích cú pháp mảng JSON

92

Tôi đang sử dụng Sencha Touch (ExtJS) để nhận thông báo JSON từ máy chủ. Tin nhắn tôi nhận được là:

{
"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"
    }

    ]
}

Vấn đề của tôi là tôi không thể phân tích cú pháp đối tượng JSON này để tôi có thể sử dụng từng đối tượng bộ đếm.

Tôi đang cố gắng diễn đạt như thế này:

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

Tôi đang làm gì sai? Cảm ơn bạn!

javascript json extjs

— maephisto
nguồn

1

Có thể trùng lặp của an toàn biến một chuỗi JSON thành một đối tượng

— T.Todua

140

Javascript có phân tích cú pháp JSON tích hợp cho các chuỗi, tôi nghĩ đó là những gì bạn có:

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

để sử dụng điều này với ví dụ của bạn sẽ là:

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

Đây là một ví dụ hoạt động

CHỈNH SỬA : Có một sai lầm trong việc sử dụng vòng lặp for của bạn (Tôi đã bỏ lỡ điều này trong lần đọc đầu tiên của tôi, ghi có cho @Evert để thay thế). sử dụng vòng lặp for-in sẽ đặt var là tên thuộc tính của vòng lặp hiện tại, không phải là dữ liệu thực tế. Xem vòng lặp cập nhật của tôi ở trên để sử dụng đúng

QUAN TRỌNG : JSON.parsephương pháp này sẽ không hoạt động trong các trình duyệt cũ cũ - vì vậy nếu bạn định cung cấp trang web của mình thông qua một số loại kết nối internet bị bẻ cong thời gian, đây có thể là một vấn đề! Nếu bạn thực sự quan tâm, đây là biểu đồ hỗ trợ (đánh dấu vào tất cả các ô của tôi).

— Nàng thơ
nguồn

1

Nếu anh ta sử dụng một thư viện hỗ trợ hàm parseJSON trên nhiều trình duyệt, anh ta nên sử dụng nó. Ngoài ra, bạn lặp lại lỗi lặp.

— Bergi

Tôi gặp lỗi ở dòng đầu tiên khi chạy cái này: Cú pháp chưa được thông báo Lỗi: Mã thông báo không mong đợi o

— đêm

@nights: Rất có thể khi đó bạn có một chuỗi JSON không hợp lệ, hãy thử một công cụ xác thực JSON trực tuyến, giống như

— Shuifan

8

Đây là câu trả lời của tôi,

<!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>

— Ngư dân
nguồn

6

Trong vòng lặp for-trong, biến đang chạy giữ tên thuộc tính, không phải giá trị thuộc tính.

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

Nhưng vì bộ đếm là một Mảng, bạn phải sử dụng vòng lặp for bình thường:

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

— Bergi
nguồn

1

"Sencha cách" để tương tác với dữ liệu máy chủ là thiết lập Ext.data.Storemột Ext.data.proxy.Proxy(trong trường hợp này Ext.data.proxy.Ajax) được hỗ trợ bởi một Ext.data.reader.Json(đối với dữ liệu được mã hóa JSON, cũng có sẵn các trình đọc khác). Để ghi dữ liệu trở lại máy chủ, có một Ext.data.writer.Writersố loại.

Đây là một ví dụ về cách thiết lập như vậy:

    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.jsontrong ví dụ này (cũng có sẵn trong fiddle này ) chứa nguyên văn dữ liệu của bạn. idProperty: 'counter_name'có thể là tùy chọn trong trường hợp này nhưng thường trỏ đến thuộc tính khóa chính. rootProperty: 'counters'chỉ định thuộc tính nào chứa mảng dữ liệu.

Với thiết lập cửa hàng theo cách này, bạn có thể đọc lại dữ liệu từ máy chủ bằng cách gọi store.load(). Bạn cũng có thể kết nối cửa hàng với bất kỳ thành phần giao diện người dùng thích hợp nào của Sencha Touch như lưới, danh sách hoặc biểu mẫu.

— rzen
nguồn

0

Một điều gì đó quan trọng hơn đối với tôi ..

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

Tham khảo: https://docs.microsoft.com/en-us/scripting/javascript/reference/json-parse-osystem-javascript

— hB0
nguồn

0

Điều này hoạt động như một sự quyến rũ!

Vì vậy, tôi đã chỉnh sửa mã theo yêu cầu của mình. Và đây là những thay đổi: Nó sẽ lưu số id từ phản hồi vào biến môi trường.

var jsonData = JSON.parse(responseBody);
for (var i = 0; i < jsonData.data.length; i++)
{
    var counter = jsonData.data[i];
    postman.setEnvironmentVariable("schID", counter.id);
}

— Sobhit Sharma
nguồn

0

Câu trả lời có phiếu bầu cao hơn có sai sót. khi tôi sử dụng nó, tôi phát hiện ra nó ở dòng 3:

var counter = jsonData.counters[i];

Tôi đã thay đổi nó thành:

var counter = jsonData[i].counters;

và nó đã làm việc cho tôi. Có sự khác biệt với các câu trả lời khác trong dòng 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);
}

— Mahdi Jalali
nguồn

1

Có thể bạn có nghĩa là có thể nơi bạn đã nói nên . Tuy nhiên, sẽ tốt hơn nếu bạn thêm nhiều chi tiết / giải thích vào mã của mình, điều đó sẽ giúp ích tốt hơn cho OP và những người có cùng câu hỏi.

— Tiw

Bạn cũng có thể giải thích một chút về lý do bạn chọn phương pháp này để người dùng tìm hiểu thêm một chút. Điều đó sẽ giúp cải thiện câu trả lời này.

— TsTeaTime

câu trả lời có nhiều phiếu bầu nhất đã trả lời câu hỏi này nhưng khi tôi sử dụng nó thì tôi hiểu nó sai ở dòng 4: var counter = jsonData.counters [i]; Nhưng tôi thay đổi nó thành: var counter = jsonData [i] .counters; va no đa hoạt động. vì vậy tôi nói có thể thay vì nên.

— Mahdi Jalali

0

Chỉ như một cái nhìn đầu ...

var data = JSON.parse(responseBody);

đã không được dùng nữa .

Postman Learning Centre hiện đề xuất

var jsonData = pm.response.json();

— Đã vẽ
nguồn

-1

Bạn nên sử dụng kho dữ liệu và proxy trong ExtJs. Có rất nhiều ví dụ về điều này và trình đọc JSON tự động phân tích cú pháp thông báo JSON thành mô hình bạn đã chỉ định.

Không cần phải sử dụng Javascript cơ bản khi sử dụng ExtJs, mọi thứ hoàn toàn khác, bạn nên sử dụng các cách ExtJs để mọi thứ diễn ra ổn thỏa. Đọc kỹ tài liệu ở đó, nó tốt.

Nhân tiện, những ví dụ này cũng phù hợp với Sencha Touch (đặc biệt là v2), dựa trên các chức năng cốt lõi tương tự như ExtJs.

— Geerten
nguồn

-1

Không chắc liệu dữ liệu của tôi có khớp chính xác không nhưng tôi có một mảng các đối tượng JSON, được xuất từ jQuery FormBuilder khi sử dụng các trang.

Hy vọng rằng câu trả lời của tôi có thể giúp bất cứ ai tình cờ gặp câu hỏi này đang tìm kiếm câu trả lời cho một vấn đề tương tự như những gì tôi đã gặp phải.

Dữ liệu trông giống như sau:

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

Những gì tôi đã làm để phân tích cú pháp này chỉ đơn giản là làm như sau:

JSON.parse("["+allData.toString()+"]")

— James Wolfe
nguồn