| sitelink4 | http://1 |
|---|---|
| extra_vars4 | ko |
| extra_vars5 | http://faidcy.tistory.com/68 |
| extra_vars6 | sitelink1 |
Javascript 에서 클래스를 만드는 방법은 몇가지 방법이 있다..
그중에 기본적인 2가지만 하겠다.
첫번째로
위와 같이 생성자가 있으면 메소드를 정할 수 있다.
메소드를 정의 하는 방법은 2가지가 있다.
지금은 쓰지 않고 예전에 많이 썻던 방법이 있다.
위와 같이 this 를 사용해서 distance 라는 멤버 메소드를 정의했다.
var p = new Position(3, 4);
var d = p.distance();
이렇게 클래스를 만들었는데 여기는 한가지 문제가 있다.
Position 오브젝트를 만들 때마다 바로 멤버 메소드 (여기서는 distance())의 포인터가 매회 만들어진다.
불필요한 메모리가 만들어지는 것이다.
이를 해결하기 위해 prototype 이라는 프로퍼티를 사용한다.
생성자는 함수다. 이것도 오브젝트의 일종이라서 prototype이라는 프로퍼티를 가진다.
new 연산자로 만들어지는 오브젝트의 prototype 오브젝트는 생성자의 prototyp 프로퍼티의 값이 된다.
즉
new Position(3, 4)
가 실행되면 우선 Position.prototype을 prototype 오브젝트가 this 로서 생성자 함수에게 건내져 초기화된다.
덧붙여 prototype 프로퍼티의 초기치는 constructor라고 하는 프로퍼티만을 가지는 오브젝트이다.
constructor 의 값은, 생성자 자신이다. 즉.
Position.prototype.constructor == Position
이 된다. Position.prototype이 가리키는 오브젝트에는 constructor 이외의 프로퍼티는 없다.
동일한 생성자에 의해서 만들어지는 오브젝트는 모두 같은 prototype 오브젝트를 가진다. 따라서 prototype 오브젝트의 프로퍼티로서 메소드를 추가하면, 생성자로 만들어진 오든 오브젝트는, 그 메소드를 이용할 수 있게 된다.
이렇게 하면 Position 오브젝트를 만들 때마다 distance 메소드가 새롭게 만들어지는 것은 없어진다.
메소드는 Position 오브젝트의 prototyp 오브젝트에 추가된다.
하지만 distance 의 호출하는 방법은 바뀌지 않는다.
var p = new.Position(3, 4);
var d = p.distance();
오브젝트 p가 가지는 프로퍼티에 distance 가 포함되지 않으면 p의 prototyp 오브젝트의 프로퍼티 안에 distance를 찾는다. 이로서 메모리 문제는 해결되었다.
그중에 기본적인 2가지만 하겠다.
첫번째로
var Position = function(x, y) {
this.xpos = x;
this.ypos = y;
};
this.xpos = x;
this.ypos = y;
};
위와 같이 생성자가 있으면 메소드를 정할 수 있다.
메소드를 정의 하는 방법은 2가지가 있다.
지금은 쓰지 않고 예전에 많이 썻던 방법이 있다.
var Position = function(x,y) {
this.xpos = x;
this.ypox = y;
this.distance = function() {
var x2 = this.xpos * this.xpos;
var y2 = this.ypos * this.ypos;
return Math.sqrt(x2 + y2);
};
};
this.xpos = x;
this.ypox = y;
this.distance = function() {
var x2 = this.xpos * this.xpos;
var y2 = this.ypos * this.ypos;
return Math.sqrt(x2 + y2);
};
};
위와 같이 this 를 사용해서 distance 라는 멤버 메소드를 정의했다.
var p = new Position(3, 4);
var d = p.distance();
이렇게 클래스를 만들었는데 여기는 한가지 문제가 있다.
Position 오브젝트를 만들 때마다 바로 멤버 메소드 (여기서는 distance())의 포인터가 매회 만들어진다.
불필요한 메모리가 만들어지는 것이다.
이를 해결하기 위해 prototype 이라는 프로퍼티를 사용한다.
생성자는 함수다. 이것도 오브젝트의 일종이라서 prototype이라는 프로퍼티를 가진다.
new 연산자로 만들어지는 오브젝트의 prototype 오브젝트는 생성자의 prototyp 프로퍼티의 값이 된다.
즉
new Position(3, 4)
가 실행되면 우선 Position.prototype을 prototype 오브젝트가 this 로서 생성자 함수에게 건내져 초기화된다.
덧붙여 prototype 프로퍼티의 초기치는 constructor라고 하는 프로퍼티만을 가지는 오브젝트이다.
constructor 의 값은, 생성자 자신이다. 즉.
Position.prototype.constructor == Position
이 된다. Position.prototype이 가리키는 오브젝트에는 constructor 이외의 프로퍼티는 없다.
동일한 생성자에 의해서 만들어지는 오브젝트는 모두 같은 prototype 오브젝트를 가진다. 따라서 prototype 오브젝트의 프로퍼티로서 메소드를 추가하면, 생성자로 만들어진 오든 오브젝트는, 그 메소드를 이용할 수 있게 된다.
var Position = function(x, y) {
this.xpos = x;
this.ypos = y;
}
Position.prototype.distance = function() {
var x2 = this.xpos * this.xpos;
var y2 = this.ypos * this.ypos;
return Math.sqrt(x2 + y2);
};
this.xpos = x;
this.ypos = y;
}
Position.prototype.distance = function() {
var x2 = this.xpos * this.xpos;
var y2 = this.ypos * this.ypos;
return Math.sqrt(x2 + y2);
};
이렇게 하면 Position 오브젝트를 만들 때마다 distance 메소드가 새롭게 만들어지는 것은 없어진다.
메소드는 Position 오브젝트의 prototyp 오브젝트에 추가된다.
하지만 distance 의 호출하는 방법은 바뀌지 않는다.
var p = new.Position(3, 4);
var d = p.distance();
오브젝트 p가 가지는 프로퍼티에 distance 가 포함되지 않으면 p의 prototyp 오브젝트의 프로퍼티 안에 distance를 찾는다. 이로서 메모리 문제는 해결되었다.
