자바스크립트 함수를 이용한 객체 생성

자바스크립트 개발 환경은 Microsoft Visual Studio 2015 버전 HTML 기능 및 Chrome을 이용하고 있습니다.

자바스크립트에서 객체(배열)에 값을 넣을 때 보통 이렇게 넣곤 한다.

var a = [1,2,3,4];

하지만 하나의 인덱스에 여러 값을 넣으려면 다음과 같이 해야한다.

var a = [["고", 1, 2, 3], ["나", 2, 3, 4]];

이런식으로 계속해서 작성해 나가거나 push를 통해 만들어야하는데 불편할 수 밖에 없다.

따라서 이번에는 함수를 이용하여 객체를 생성하고 바로 삽입하는 방식을 알아보고자 한다.

<title>test title</title>
<script>
        function makeProfile(name, korean, math, science) {
            var ret = {
                이름: name,
                국어: korean,
                수학: math,
                과학: science,
 
                getSum: function () {
                    return this.국어 + this.수학 + this.과학;
                },
 
                getAvg: function () {
                    return this.getSum() / 3;
                },
 
                getString: function () {
                    return this.이름 + "  " + this.getSum() + "  " + this.getAvg();
                }
            };
            return ret;
        };
 
        var student = [];
 
        student.push(makeProfile('고관우', 10, 20, 30));
        student.push(makeProfile('홍길동', 100, 20, 70));
        student.push(makeProfile('김길수', 70, 80, 90));
 
        var output = "이름  총점   평균\n";
 
        for (var i in student)
        {
            output += student[i].getString() + "\n";
            alert(output);
        }
 
</script>
 
//                                                       This source code Copyright belongs to Crocus
//                                                        If you want to see more? click here >>

클릭하시면 결과 화면을 확인 할 수 있습니다.

makeProfile부분을 보자.

ret이라는 변수를 만드는데 이때 이 변수에는 다음과 같은 내용들이 있다.

이름, 국어, 수학, 과학 및 3가지 함수가 있다.

getSum은 국어,수학,과학 합을 구하고

getAvg는 국어,수학,과학 합의 평균을 구하고

getString는 이 합과 평균을 string으로 반환해주기 위한 행동을 한다.

이러한 ret를 결국 return하게되면 하나의 객체가 생성될 수 있다는 것을 알 수 있다.

이제 우리는 student 객체에 makeProfile을 이용하여 객체 하나하나를 삽입 해줄 수 있다.