2017. 2. 22. 22:59
반응형

자바스크립트 객체 정렬하기

학생객체 : 학생명, 점수

점수를 기준으로 내림차순 정렬

배열 정렬 기능 활용: sort(function(a,b){return b.score-a.score})



HTML/JavaScript 소스 코드

<script>

var studentArray = [];


function createStudent(name, score) {

this.name = name;

this.score = score;

}

function randomStudent() {

var name = "student-"+parseInt(Math.random()*1000);

var score = parseInt(Math.random()*100);

studentArray.push(new createStudent(name, score));

document.getElementById("studentTable").innerHTML = outStudent(studentArray);

}

function outStudent(arr) {

var tableTag = "<table border='1' style='width:500px;text-align:center;'><tr><th>이름</th><th>점수</th></tr>";

for(i=0;i<arr.length;i++) {

tableTag += "<tr><td>"+arr[i].name+"</td><td>"+arr[i].score+"</td></tr>";

}

tableTag += "</table>";

return tableTag;

}

function sortTotal() {

studentArray.sort(function(a,b){return b.score-a.score});

document.getElementById("studentTable").innerHTML = outStudent(studentArray);

}

</script>

<button onclick="randomStudent()">학생객체생성</button>

<button onclick="sortTotal()">점수순으로 정렬</button>

<div id="studentTable"></div>


반응형