sitelink1 | |
---|---|
sitelink2 | |
sitelink3 | |
sitelink4 | http://1 |
extra_vars4 | ko |
extra_vars5 | http://cafe.naver.com/swnara/50 |
extra_vars6 | sitelink1 |
Javascript로도 class를 만들 수 있다.
우선, class에 대해서 아주아주 간단히 짚어 보자.
1) class는 생성자를 갖는다.
예를 들어, Array를 보도록 하자.
var arr = new Array();
Array는 객체다. Array를 사용하기 위해서는 new Array()라는 형태로 생성해 주어야 하는데
이 때, Array()처럼 class명과 동일한 이름의 함수를 생성자라고 한다.
2) class는 member변수를 갖는다.
var arr = new Array();
alert( arr.length ); -> '0'을 출력해 줄것이다.
위에 보이듯이 arr.length의 length는 Array의 member변수이다.
3) class는 method를 갖는다.
method는 function을 말하며, Array의 경우
var arr = new Array();
alert( arr.toString() );
처럼, toString()이라는 method를 갖는다.
그럼, 이제 간단한 class를 만들어 보도록 하자.
지금부터 만들 class는 두개의 숫자를 입력받아 그 합을 출력하며,
그 합을 member변수에 기억시켜두는 기능을 갖고 있다.
1) 1번째 방법
var Class1 = function() // 생성자
{
// member변수
this.sum = 0;
};
Class1.prototype.add = function( a, b ) // method add()
{
this.sum = a + b;
return this.sum;
};
2) 2번째 방법
function Class1()
{
// member변수
this.sum = 0;
// method
this.add = addNum;
}
function addNum( a, b )
{
this.sum = a + b;
return this.sum;
}
3) 3번째 방법
// 개인적으로 이 방법이 제일 맘에 든다.
소개한 3가지 방법은 내부적으로 중요한 차이점이 있다. 이를 이해하기 위해서는 prototype 과 construct 에 대해서 학습해야 한다.
function Class1()
{
// private 변수
var m_sum = 0;
// public 변수 및 method
this.sum = 0;
this.add = addNum;
// private method
function addNum( a, b )
{
m_sum = a+b;
this.sum = m_sum;
}
}
4) 사용예
var sam = new Class1();
sam.add(11, 22) );
alert( "" + sam.sum ); // "33" 출력
이상, 별문지기(www.swnara.com) 였습니다.
댓글 0
번호 | 제목 | 글쓴이 | 날짜 | 조회 수 |
---|---|---|---|---|
66 | 익스플로러용 스크립트 디버거 (Script Debugger for Windows NT 4.0 and Later) | 황제낙엽 | 2008.12.11 | 473 |
65 | 소숫점을 포함한 반올림 | 황제낙엽 | 2008.12.11 | 440 |
64 |
int * float 연산 오류
![]() | 황제낙엽 | 2008.12.11 | 473 |
63 |
JavaScript Form Validation
![]() | 황제낙엽 | 2008.11.24 | 492 |
62 | 정규식 정리 | 황제낙엽 | 2008.11.24 | 500 |
61 | setTimeout() / setInterval() 메소드 | 황제낙엽 | 2008.11.05 | 459 |
60 | [key:value] 형태로 object를 저장할 수 있는 Static영역의 해쉬맵 클래스 (Map) | 황제낙엽 | 2008.11.04 | 391 |
59 | String xml 파싱 | 황제낙엽 | 2008.11.03 | 498 |
58 | innerHTML | 황제낙엽 | 2008.11.03 | 462 |
57 | DOM과 innerHTML 방법에 대한 비교 분석 | 황제낙엽 | 2008.11.03 | 481 |
56 | 익명함수의 사용 | 황제낙엽 | 2008.10.14 | 425 |
55 | Javascript 내장객체 Array (배열) | 황제낙엽 | 2008.10.13 | 433 |
54 | 자바 스크립트에서 sleep 기능을~ | 황제낙엽 | 2008.10.02 | 417 |
53 | position스타일과 top, left스타일 | 황제낙엽 | 2008.09.24 | 405 |
52 | 자바스크립트에서 이벤트 처리에 대한 일련의 흐름 | 황제낙엽 | 2008.09.18 | 505 |
51 | 함수와 인자값 (arguments) | 황제낙엽 | 2008.08.12 | 343 |
50 | 중첩 함수, 함수 클로저 | 황제낙엽 | 2008.08.12 | 1253 |
49 | 재사용 가능한 일회용 객체 | 황제낙엽 | 2008.08.08 | 465 |
48 | 생성자 체인과 상속 | 황제낙엽 | 2008.08.08 | 314 |
47 | Public/Private 프로퍼티와 this | 황제낙엽 | 2008.08.08 | 314 |