JSON객체를 아래와 같이 생성했을 때 자동으로 key에 의해 정렬이 됩니다. 브라우저마다 좀 틀리기는 한듯..ㅡ.ㅡ;
//선언
var testData1 = {
"55": "빨강",
"33": "초록",
"30": "검정",
"16": "파랑",
"29": "노랑"
};
//테스트
$.each(testData1,
function(index, value){
window.console.log("정렬전 : " +
index + " =
" + value);
});
결과
로그: 정렬전 : 16 = 파랑
로그: 정렬전 : 29 = 노랑
로그: 정렬전 : 30 = 검정
로그: 정렬전 : 33 = 초록
로그: 정렬전 : 55 = 빨강
이경우 value로 정렬하고 싶을때는 색인배열화하여 sort로 정렬하여 사용하면 됩니다.
//배열로
var sortData =[];
$.each(testData1,
function(index, value){
window.console.log("정렬전 : " +
index + " =
" + value);
sortData.push({key: index, value:
value});
});
//sortData는 아래와 같은 형태가 된다.
var testData2 = [
{"key": "55", "value": "빨강"},
{"key": "33", "value": "초록"},
{"key": "30", "value": "검정"},
{"key": "16", "value": "파랑"},
{"key": "29", "value": "노랑"}
];
//정렬
sortData.sort(function(a, b){
return(a.value < b.value) ? -1 :
(a.value > b.value) ? 1 : 0;
});
//테스트
$.each(sortData,
function(index, value){
window.console.log("정렬후 : " +
value.key + " =
" + value.value);
});
결과
로그: 정렬후 : 30 = 검정
로그: 정렬후 : 29 = 노랑
로그: 정렬후 : 55 = 빨강
로그: 정렬후 : 33 = 초록
로그: 정렬후 : 16 = 파랑
html 전체소스
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8">
<title>JSON
정렬 테스트</title>
<!--
<script
type="text/javascript" src="http://code.jquery.com/jquery.js"
charset="utf-8"></script>
<script
type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"
charset="utf-8"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" charset="utf-8"></script>
-->
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.7.1.min.js" charset="utf-8"></script>
<script type="text/javascript" charset="UTF-8">
$(document).ready(function(){
//JSON 선언
var testData1 = {
"55": "빨강",
"33": "초록",
"30": "검정",
"16": "파랑",
"29": "노랑"
};
//배열로
var sortData =[];
$.each(testData1, function(index, value){
window.console.log("정렬전 : " +
index + " =
" + value);
sortData.push({key: index, value:
value});
});
//sortData는 아래와 같은 형태가 된다.
var testData2 = [
{"key": "55", "value": "빨강"},
{"key": "33", "value": "초록"},
{"key": "30", "value": "검정"},
{"key": "16", "value": "파랑"},
{"key": "29", "value": "노랑"}
];
//정렬
sortData.sort(function(a, b){
return(a.value < b.value) ? -1 :
(a.value > b.value) ? 1 : 0;
});
//테스트
$.each(sortData, function(index, value){
window.console.log("정렬후 : " +
value.key + " =
" + value.value);
});
});
</script>
</head>
<body>
<div>
</div>
</body>
</html>
'others' 카테고리의 다른 글
AES, SHA 암호화 1, JAVA (1) | 2015.08.26 |
---|---|
facebook note에 있던 잡다한것들.. (0) | 2013.06.03 |
checkbyte jQuery plugin (0) | 2011.11.11 |
Velocity에서의 Map 사용 (0) | 2009.11.24 |
자바스크립트 체크박스 관련 (0) | 2009.07.30 |