1 minute read

개요 및 전제조건

응답은 JSON타입 전제한다.
Map<String, List<Map<String, Object»> 형태로 서버에서 응답값이 전달된다면?
💡 서버측에서 응답으로 보내는 컬렉션을 javascript 에서 직접 구현해보기.

방법0: 서버없이 하드코딩

클라이언트

//예시) Map<List<Map<String,Object>>>
let result = {
  bckList : [
    JSON.parse('{"totalCount" : 36, "sqlCtnt" : "select * from dual", "ROWNUM" : 36}')
  ]
};


//리스트SET
$.each(result.bckList, function(i,row){
    //리스트에서 맵 꺼냄
    $.each(row, function(colNm, colVal){
      //맵에서 키값꺼냄
      console.log(colVal);
  });
});


/*
//순수 JS 방법 (forEach문)

//리스트SET
result.bckList.forEach(function(row) {
  //리스트에서 맵 꺼냄
  Object.entries(row).forEach(function([colNm, colVal]) {
    //맵에서 키값꺼냄
    console.log(colVal);
  });
});
*/

방법1: 서버에서 JSON형 String 응답

서버

@ResponseBody
@RequestMapping(value="/app/createMap",method = RequestMethod.POST)
public String createString(@RequestBody Map<String, Object> params){
    
    String jsonString = "{\"totalCount\" : 36, \"sqlCtnt\" : \"select * from dual\", \"ROWNUM\" : 36}";

    return jsonString;
}

클라이언트

//예시) Map<List<Map<String,Object>>>
let result = {
  bckList : [
    JSON.parse(/* 서버응답 String */)
  ]
};


//리스트SET
$.each(result.bckList, function(i,row){
    //리스트에서 맵 꺼냄
    $.each(row, function(colNm, colVal){
      //맵에서 키값꺼냄
      console.log(colVal);
  });
});

방법2: 서버에서 Map<List<Map<String,Object»> 응답

서버

@ResponseBody
@RequestMapping(value="/app/createMap",method = RequestMethod.POST)
public Map<String, Object> createMap(@RequestBody Map<String, Object> params){
    Map<String, Object> resultMap = new Map<String, Object>();

    List<Map<String, Object>> list = bckService.getSelect(params);
    resultMap.put("bckList", list);

    return resultMap;
}

클라이언트

//예시) Map<List<Map<String,Object>>>
let result = /* 서버응답 객체 */
  

//리스트SET
$.each(result.bckList, function(i,row){
    //리스트에서 맵 꺼냄
    $.each(row, function(colNm, colVal){
      //맵에서 키값꺼냄
      console.log(colVal);
  });
});

Leave a comment