자바스크립트의 사용자 객체 정의 방법

  

자바스크립트는 객체 지향 프로그래밍 언어이기 때문에 사용자가 객체를 정의하여 사용할 수 있다. 객체는 프로퍼티(Properties, 속성)과 메소드(Methods)로 구성되어 있으며, 사용자가 객체를 정의하기 위해서는 속성과 메소드를 정의해야 한다.

 

 

 

■ 속성을 정의하는 방법

 

속성을 정의할 때는 this 키워드를 사용하여 속성을 정의합니다.

 

function Student(name, age, sex) {

    this.name = name;

    this.age = age;

    this.sex = sex;

}

 

 

■ 메소드를 정의하는 방법

 자바 스크립트 객체를 정의할 때 메소드를 정의하는 방법은 객체 외부에 메소드를 정의한 후 객체 변수에 메소드를 지정하는 방법과 객체 내부에 메소드를 정의하는 방법이 있습니다.

 

 

1. 외부 메소드를 객체 메소드로 정의하기

 

function Strudent(name, age, sex) {

    this.name = name;

    this.age = age;

    this.sex = sex;

    this.method = display;   // 위에서 정의한 함수를 객체에 포함시킵니다.

}

function display() {

    document.writｅ("이름 : " + this.name + "<br/>);

    document.writｅ("나이 : " + this.age + "<br/>");

    document.writｅ("성별 : " + this.sex + "<br/>");

}

 

2. 객체 내부에 메소드 작성방법

 

function Strudent(name, age, sex) {

    this.name = name;

    this.age = age;

    this.sex = sex;

 

    this.display = function() {

        document.writｅ("이름 : " + this.name + "<br/>);

        document.writｅ("나이 : " + this.age + "<br/>");

        document.writｅ("성별 : " + this.sex + "<br/>");    

    } 

}

 

 

실제 사용 예제)

<script type="text/javascript">
function TestClass() {
    this.name = document.getElementById("name").value;
    this.age = document.getElementById("age").value;

    this.print = function() {
        alert(this.name + this.age);
    }
}

 

function test() {
    var object = new TestClass();
   object.print(); 
}
</script>

 

<input type="text" name="name" id="name" />
<input type="text" name="age" id="age" /><br/>
<input type="button" value="테스트" onclick="test();"/>