programing

JSON 구조에서 반복하려면 어떻게 해야 하나요?

copysource 2022. 10. 21. 22:22
반응형

JSON 구조에서 반복하려면 어떻게 해야 하나요?

JSON 구조는 다음과 같습니다.

[{ "id":"10", "class": "child-of-9" }, { "id": "11", "classd": "child-of-10" }]

JavaScript를 사용하여 반복하려면 어떻게 해야 합니까?

var arr = [ {"id":"10", "class": "child-of-9"}, {"id":"11", "class": "child-of-10"}];
    
for (var i = 0; i < arr.length; i++){
  document.write("<br><br>array index: " + i);
  var obj = arr[i];
  for (var key in obj){
    var value = obj[key];
    document.write("<br> - " + key + ": " + value);
  }
}

주의: 단순 객체에는 for-in 방식이 적합합니다.DOM 개체와 함께 사용하기에는 그다지 스마트하지 않습니다.

jQuery 문서에서 가져온 내용:

var arr = [ "one", "two", "three", "four", "five" ];
var obj = { one:1, two:2, three:3, four:4, five:5 };

jQuery.each(arr, function() {
  $("#" + this).text("My id is " + this + ".");
  return (this != "four"); // will stop running to skip "five"
});

jQuery.each(obj, function(i, val) {
  $("#" + i).append(document.createTextNode(" - " + val));
});

용도:

var mycars = [{name:'Susita'}, {name:'BMW'}];

for (var car of mycars) 
{
  document.write(car.name + "<br />");
}

결과:

Susita
BMW

쉽지 않은 경우 알려주시기 바랍니다.

var jsonObject = {
  name: 'Amit Kumar',
  Age: '27'
};

for (var prop in jsonObject) {
  alert("Key:" + prop);
  alert("Value:" + jsonObject[prop]);
}

이것이 고객님의 경우dataArray:

var dataArray = [{"id":28,"class":"Sweden"}, {"id":56,"class":"USA"}, {"id":89,"class":"England"}];

그 후, 다음과 같이 합니다.

$(jQuery.parseJSON(JSON.stringify(dataArray))).each(function() {  
         var ID = this.id;
         var CLASS = this.class;
});

http://www.w3schools.com 에서 복사 및 붙여넣기 할 경우 JQuery 오버헤드가 필요하지 않습니다.

var person = {fname:"John", lname:"Doe", age:25};

var text = "";
var x;
for (x in person) {
    text += person[x];
}

결과: 신원미상자 25명

mootools의 예:

var ret = JSON.decode(jsonstr);

ret.each(function(item){
    alert(item.id+'_'+item.classd);
});

objx - http://objx.googlecode.com/ 등의 미니 라이브러리를 사용할 수 있습니다.

다음과 같이 코드를 작성할 수 있습니다.

var data =  [ {"id":"10", "class": "child-of-9"},
              {"id":"11", "class": "child-of-10"}];

// alert all IDs
objx(data).each(function(item) { alert(item.id) });

// get all IDs into a new array
var ids = objx(data).collect("id").obj();

// group by class
var grouped = objx(data).group(function(item){ return item.class; }).obj()

이러한 데이터를 처리할 수 있는 '플러그인'이 더 많이 있습니다. http://code.google.com/p/objx-plugins/wiki/PluginLibrary를 참조하십시오.

중첩된 개체에서는 다음과 같이 재귀 함수를 통해 검색할 수 있습니다.

function inside(events)
  {
    for (i in events) {
      if (typeof events[i] === 'object')
        inside(events[i]);
      else
      alert(events[i]);
    }
  }
  inside(events);

as events는 json 객체입니다.

jQuery를 사용할 때는 왕후가 가장 좋은 답일 것입니다.

여기 JavaScript를 사용하는 순수 JavaScript와 비슷한 것이 있습니다.forEach방법.각각은 함수를 인수로 삼는다.그런 다음 해당 항목을 인수로 하여 배열의 각 항목에 대해 해당 함수가 호출됩니다.

간단하고 간단:

var results = [ {"id":"10", "class": "child-of-9"}, {"id":"11", "classd": "child-of-10"} ];

results.forEach(function(item) {
    console.log(item);
});

이것은 순전히 주석이 달린 JavaScript 예시입니다.

  <script language="JavaScript" type="text/javascript">
  function iterate_json(){
            // Create our XMLHttpRequest object
            var hr = new XMLHttpRequest();
            // Create some variables we need to send to our PHP file
            hr.open("GET", "json-note.php", true);//this is your php file containing json

            hr.setRequestHeader("Content-type", "application/json", true);
            // Access the onreadystatechange event for the XMLHttpRequest object
            hr.onreadystatechange = function() {
                if(hr.readyState == 4 && hr.status == 200) {
                    var data = JSON.parse(hr.responseText);
                    var results = document.getElementById("myDiv");//myDiv is the div id
                    for (var obj in data){
                    results.innerHTML += data[obj].id+ "is"+data[obj].class + "<br/>";
                    }
                }
            }

            hr.send(null); 
        }
</script>
<script language="JavaScript" type="text/javascript">iterate_json();</script>// call function here

var jsonString = `{
    "schema": {
        "title": "User Feedback",
        "description": "so",
        "type": "object",
        "properties": {
            "name": {
                "type": "string"
            }
        }
    },
    "options": {
        "form": {
            "attributes": {},
            "buttons": {
                "submit": {
                    "title": "It",
                    "click": "function(){alert('hello');}"
                }
            }
        }
    }
}`;

var jsonData = JSON.parse(jsonString);

function Iterate(data)
{
    jQuery.each(data, function (index, value) {
        if (typeof value == 'object') {
            alert("Object " + index);
            Iterate(value);
        }
        else {
            alert(index + "   :   " + value);
        }
    });
}

Iterate(jsonData);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

JSON 문서를 탐색하는 또 다른 솔루션은 JSONiq(Zorba 엔진에 구현됨)로, 다음과 같은 내용을 작성할 수 있습니다.

let $doc := [
  {"id":"10", "class": "child-of-9"},
  {"id":"11", "class": "child-of-10"}
]
for $entry in members($doc) (: binds $entry to each object in turn :)
return $entry.class         (: gets the value associated with "class" :)

http://public.rumbledb.org:9090/public.html에서 실행할 수 있습니다.

언급URL : https://stackoverflow.com/questions/1078118/how-do-i-iterate-over-a-json-structure

반응형