반응형
1. Date Object
Date객체는 날짜와 시간을 다루는 객체이다.

(1)기본 사용법 : 날짜 객체(Date object)를 사용하려면 먼저 new연산자를 통해서 객체를 만들어낸다. 그리고 해당 객체를 통해서 필요한 함수(method, function)를 불러 사용하면 된다.

예) 현재 날짜를 출력하는 예제
var d = new Date(); //현재 날짜를 가져온다.
document.write(d); // 출력한다.


2. Math Object
수학과 관련된 상수나 삼각함수들은 이 Math객체를 이용해서 사용할 수 있다. Math객체는 new를 통해서 생성할 필요가 없다.

예)
 var pi = Math.PI; //pi가 파이값을 가지게 된다.
var a = Math.sin(0,3); //0.3의 sin값


3. String Object

예)
var str = new String("deadfire");
또는 var str = "deadfir";
문자열 객체는 ""로 new연산자를 대신한다고 볼 수 있다.


4. Array Object
배열은 동일한 속성을 지니는 값들을 차례로 담아서 하나의 변수로 관리 할 수 있다는 장점 땜누에 모든 언어에서 기본적으로 지원하는 기능

예)
var obj = new Array(10); // 10개를 담을 수 있는 배열 생성
var obj = new Array(); //지정된 개수 없이 생성
var obj = new Array(1, "AAA", Nan) // 생성과 동시에 값 할당.
*자바스크립트에서는 데이터의 종류가 존재하지 않기 때문에 배열안에 숫자, 문자, NaN등이 동시에 들어가도 문제가 없다.


5. Boolean Object
boolean이라는 기본적인 값이 있다. 이 값은 true, false 값만을 가진다. 이걸 객체라는 이름으로 한번 씌운 것이 Boolean객체이다. 단순히 다음과 같이 생서할 수 있다.

var b = new Boolean(true);


6. Function Object
함수도 객체로 간주된다. 따라서 new를 통해서 새로운 함수를 작성 할 수도 있다.

var sum = new Function("a", "b", "return a+b");

위의 예를 일반적으로 함수를 선언하는 방식으로 옮겨보면

Function sum(a,b){
   return a+b;
}


7. Argument Object
함수의 하위 속성 중 하나가 arguments가 된다.

arguments[0], arguments[1], ////
arguments.length

와 같이 사용할 수 있다. 생성자는 존재하지 않는다.
이 객체는 함수에 종속되어 자동으로 생성되는 객체로 반드시 arguments라는 명칭을 가지도록 되어있다.


8. Number Object
자바스크립트에서 사용되는 변수 중에 숫자 값이 가질 수 있는 최대, 최소값과 같은 상수를 가지고 있는 객체이다.

document.write("MAX_VALUE : " +Number.MAX_VALUE+"<BR>");
document.wirte("MIN_VALUE : " +Number.MIN_VALUE+"<BR>");


9. Global Object
이 객체는 실제로 사용되지 않는다. new를 통해서 생성 할 수도 없다. 다만 eval(), parseInt(), parseFloat(), Infinity와 같은 속성이나 함수가 속하게 되는 객체로서의 의미만 지닌다.


10. Image Object
속성은 name, src 두가지가 있다.

예)
imageName = new Image(height, width);
imageName.src = "image_filename";

객체를 이용하게 되면, Image를 Preload하는 장정이 있으며, 이를 응용하면 rollover기능을 다음과 같이 구현 할 수 있다.

inimg = new Image(100,100);
inimg.src = "inbutton.gif";
outimg = new Image(100,100);
outimg.src = "outbutton.gif";

<A href src="../index.html"
onMouseOver="gol.src = inimg.src;"
onMouseOut="gol.src = outimg.src;">
NAME="gol" SRC="outbutton.gif" Border=0></A>


11.기타 Object
지금까지 나열한 것 이외에 다음과 같은 객체들도 존재하나 자주 사용되지 않는다.

Object Object : 브라우저에서 사용하는 모든 객체의 조상 격인 객체
Screen Object : 사용자가 현재 사용하고 있는 화면에 대한 정보 즉, 해상도나 색상에 대한 정보를 담고 있는 고유한 객체이다.
RegExp Object : 문자열에서 특정한 문자를 찾아낼 때 사용하는 패턴(pattern)을 말한다.


12. with
특정한 객체 특히 Math객체의 경우는 생성자 없이 그대로 사용하기 때문에 많은 수학관련 함수를 사용할 때 일일이 Math.라고 써주기가 너무 귀찮고, 코드도 지저분해 보여서 with라는 구문을 사용한다.

var ret = Math.sin( Math.PI ) + Math.cos (Math.E );

위와 같은 문장을 with 구문을 사용하면 간단히 쓸 수 있다.

with (Math) {
var ret = sin(PI) + cos(E);
}


13. delete
객체를 생성하면 필요 없을 때 삭제하는 기능이 필요하여 추가된 연산자로 다음과 같이 사용한다.

myobj = new Number();
delete = myobj;

삭제를 성공하면 true를 리턴한다. delete시킬 수 있는 대상은 새로 생성한 객체나 특정한 객체의 속성, 또는 배열에서 특정한 변수를 삭제시킬 수 있다. 그러나 이 연산은 거의 사용되지 않는다.






[출처]Deadfire(http://deadfire.hihome.com)
반응형

'공부 > Javascript' 카테고리의 다른 글

객체  (0) 2011.06.21
javascript 문법  (0) 2011.06.20
Javascript 기초  (0) 2011.06.17
Javascript란?  (0) 2011.06.15
반응형
1. Object란?
객체란 간단히 속성과 함수를 가지고 있는 모듈 단위. 즉, 특정한 기능을 하도록 내부에 변수와 외부와의 연동을 위해서 함수를 제공하는 것이다.

2. 속성과 함수
모든 객체는 속성과 함수를 가지고 있다. 그래서 그 객체가 가지고 있는 속성이나 함수를 부르거나 값을 가져오려면,

객체이름.객체속성
객체이름.함수()

객체나 속성도 변수의 일종으로 볼 수 있으며 따라서, 대소문자를 가린다.

객체 이름 뒤에 점을 찍어주면 된다. document.write()처럼....

- 최상위 객체
alert()함수를 앞에 객체도 없이 그냥 마구 쓸 수 있다? 그건 아니다. 최상위에 window라는 객체가 있다. alert()함수는 바로 이 window객체의 함수인 것이다. 즉,

     window.alert();

이렇게 사용하는 것인데, 최상위에 있다보니 지정하지 않은 모든 변수나 함수는 window객체의 속성과 함수가 되는 것이다. 그래서 window.alert()으로 쓰나 그냥 alert()이라고 쓰나 동일한 것이 된다.
더구나 document.write()라고 쓰지만, 사실은 window.document.write()인 것이다.

자바스크립트는 객체에 대한 상당히 유연한 방법을 지원하고 있다. 어떠한 객체가 있을 때 속성을 추가하는 방법은 매우 간단하다. 즉, man 이라는 객체가 이미 존재한다고 할 때, 추가 속성으로 age, company를 더 넣고 싶다면,

man.age = 28;
man.company = "deadfire Co.";

이렇게 하면, man이라는 객체에 두 개의 속성(age, company)가 추가되는 것이다.


3. 객체의 생성과 사용
이미 만들어져서 제공되는 객체나 함수 말고, 사용자가 필요한 객체를 생성할 수 도 있다.

자동차라는 객체를 만들어 보자. 먼저 자동차의 특성을 나타내는 것들을 뽑아보자. 그래야 그 것들을 가지고 속성으로 만들어 줄 테니까, 간단히 자동차의 색상, 모델명, 차주인 이름을 속성으로 갖는다고 하면, 나중에 사용할 모습은 이렇게 될 것이다.

   car.color
   car.model
   car.owner

이러한 속성 값들을 가지도록 만들면 될 것이다. 이제 생성해보자. 자바스크립트에서는 새로운 객체를 만들어 낼 때 속성와 함수가 필요하다. 먼저 함수를 만들면,

//먼저 객체의 함수를 선언
function print(){
   alert(" This Car : " + this.color + ", " + this.model + ", " + this.owner );
}

//객체용 함수 선언
function car(color, model, owner) { //생성자 선언
   this.color = color;
   this.model = model;
   this.owner = owner;
   this.print = print;
}

- this는 this라는 문자가 들어가 있는 가장 바깥쪽의 괄호의 주인을 가리킨다. 즉, this는 car라는 함수 자신이 되는 것이다. 정확히 말하면 생성되는 객체 자체를 가리킨다. new라는 연산자에 의해서 생성되는 객체를 this가 지칭한다.

다음과 같이 mycar라는 인스턴스를 생성하고, 사용할 수 있게 되는 것이다.

var mycar = new car("빨간색", 1010, "deadfire"); // 인스턴스생성
mycar.print();  //해당 인스턴스 정보출력

이미 생성된 인스턴스에 새로운 속성(Property, Attribute)를 추가하고 한다면, 단순히 해당 인스턴스에 새로운 속성을 할당만하면 된다. 위에서 새로 생성된 mycar라는 인스턴스에 등급(grade)를 추가하려면 다음과 같이 하면된다.

mycar.grade = "1"; //프라퍼티 첨가

객체에 속한 모든 값
앞에서 for ... in...에 대해서 간단히 살펴보았었다. 이 기능을 확용하면, 객체가 가지고 있는 모든 속성이나 함수에 뭐가 있는지 한번에 볼 수 있다. 위에서 생성한 mycar라는 인스턴스를 예로들면,

var mesg = "";
for (obj in mycar){ // mycar에 속하는 각 obj
   mesg += obj + "\n";
}
alert(mesg);


[출처]Deadfire(http://deadfire.hihome.com)
반응형

'공부 > Javascript' 카테고리의 다른 글

내장객체  (0) 2011.07.11
javascript 문법  (0) 2011.06.20
Javascript 기초  (0) 2011.06.17
Javascript란?  (0) 2011.06.15
반응형
1. 변수(Variable)
값을 저장하는 곳을 말하며, 이 저장된 값이 계속 변경되기 때문에 변하는 수 즉, 변수라고 부른다. 자바스크립트 뿐만 아니라 모든 개발 언어들이 변수를 사용하여 값을 저장하게 된다.

(1) 변수명 부여 규칙
변수의 이름은 알파벳(대소문자 A ~ Z, 소문자 a ~ z), 밑줄(_)이나 달라($)로 시작될 수  있으며, 그 다음에는 알파벳, 밑줄, 달라 기호에 추가로 숫자(0 ~ 9)까지 사용할 수 있다.

(2) 데이터의 유형
1) 숫자 : 정수, 실수
2) 문자열(String)
3) 논리값(Boolean) : true, false
4) 널(null)

(3) 변수의 선언
일반적인 다른 언어들은 데이터의 종류에 따라서 다양한 변수의 형을 사용하는데 비하여 선언은 var한가지만 존재하여 대입되는 값에 따라 형이 변하게 된다. 변수명은 대소문자를 구분한다. 또한 var를 굳이 명시하지 않더라도 처음으로 변수가 나타나면 자동으로 새로 선언하도록 되어있다.

예) var name = "Killer!";
     var answer = 20;

(4) 변수의 범위
지역변수(Local variable) - 함수의 내부에서 사용된 변수
전역변수(global variable) - 함수 외부에서 사용된 변수

* 전역변수로 선언한 변수명이 특정 함수에서 사용하게 될 때, 변수명은 같지만 다른 값을 가지게 되는 지역변수로 사용하고 싶다면 처음에 값을 할당하기 전에 var로 선언해주면 된다.

(5) 형 변환
자바스크립트는 그안에 들어가는 내용에 의해서 문자인지 숫자인지 구분하게 된다.

예) var result = "test"; result = 100;

(6) 문자(literals)
상수를 표현하기 위한 방법

1) 정수
2) 실수
3) 불린 : true, false
4) 문자 : single() 또는 double() quotation 마크에 의해 둘러싸인 문자열, 다음과 같은 특수문자도 포함가능
\b(back space), \f(form feed), \r(Return), \n(new line), \t(tab), \\(back slash)


2. 연산
(1) 논리연산자 : &&(and), ||(or), !(not)
(2) 비교연산자 : ==, !=, =>, <, >, >=, <=  (비교연산도, 문자, 숫자 구분없이 그냥 ==로 비교하면 된다.)


3. 조건문 ( C언어와 동일)

(1) if...else...
형식> if (조건문1) { 조건문1이 참일때 실행되는 내용
         } else if (조건문2) { 조건문2가 참일때 실행되는 내용
         } else { 앞의 조건들에 해당하지 않을 때 실행되는 내용
         }

(2) switch
형식> switch (값) {
         case 값1:
         값이 값1과 동일할 경우 실행되는 내용
         case 값2:
         값이 값2와 동일할 경우 실행되는 내용
         default :
         값이 설정한 값들(값1, 값2)와 동일하지 않을 경우 실행되는 내용
         break;
}

4. 반복문
(1) for
설명> 초기값이 조건문에 참일 때 까지 반복
예제1> for (i=0; i <10; i++) {
          document.write(i)
}

설명> 객체의 속성 개수만큼 반복
예제2> for(var j in obj) {
          answer += "" + i + ":" + obj[i]
}

(2) while / dowhile
for문이 i와 같은 변수가 증감되면서 처리되는데 유효하다면 while문은 몇 개 인지 모를 대상을 가지고 반복문을 구성할 때 주로 사용

예제1>var num = 1;
         while ( num <= 10) {
                  document.write(num);
                  num++;
         }

예제2>i = 3;
         do{
               document.write(i);
               i++;
         }while(i<10)

while문은 조건을 먼저 검사하고, 내부의 반복문을 수행시킬지 검사하지만, do...while문은 일단 한번은 내부의 문장을 수행하고 그 다음부터 계속 반복할지를 결정한다는 점이 다르다.

(3) break / continue (C 언어와 동일)
해당 블럭을 완전히 탈출하는 break와, 바로 다음 증감분을 시행하는 continue는 흐름을 제어하게 된다.

5. 사용자함수
(1)선언
형식> function function_name (입력값1, 입력값2, .... ) {
         함수의 내용
         return 리턴값;
}


설명> 두 값을 받아서 합을 계산하여 Return해 주는 함수의 예이다.
예> function sum(a, b) {
      return a+b;
      }

* 추가속성 : 각 함수는 자기가 받은 인자를 arguments라는 배열에 저장하며, 그 배열은 length라는 값을 가지고 배열의 개수를 지칭할 수 있다. 즉, arguments[i], arguments.length 라는 두 개의 변수를 함수안에서 사용할 수 있다.
예>
function func(){
   var sum = 0;
   for ( var i = 0; i < n ; i++ ) {
        sum += func.arguments[i]
   }

   return sum;
}

alert( func(1) );
alert( func(1,2) );
alert( func(1, 2, 3) );
alert( func(1, 2, 3, 4) );

(2) 재귀 함수
재미있는 것은 자신이 자기를 부를 수 있다는 점이다. 이렇게 호출하는 것을 재귀 호출이라고 하는데, 가장 대표적인 것이 계승(factorial) 값을 구하는 함수이다. 즉, 5의 계승은

5! = 5 X 4 X 3 X 2 X 1

이다. 이러한 계승을 자바스크립트 함수로 구성해 보면 다음과 같다.
예>
function factorial(n){
   if( n <= 1) return n; // 1 is end
   else reutrn n * factorial(n-1); // recall
}




[출처]DEADFIRE Homepage // Deadfire Program Master
반응형

'공부 > Javascript' 카테고리의 다른 글

내장객체  (0) 2011.07.11
객체  (0) 2011.06.21
Javascript 기초  (0) 2011.06.17
Javascript란?  (0) 2011.06.15
반응형
1. HTML 문서에 추가하기
HTML문서에 자바스크립트 구문은 <SCRIPT></SCRIPT>로 감싸면 된다. Server Side Javascript의 경우는 Tag를 사용한다.

예>
<SCRIPT LANGUAGE="JavaScript" SRC="JavaScript.js">
<!--
JAVA SCRIPT 문장
-->
</SCRIPT>

- 파란색부분은 옵션으로 생략가능
- SRC : 자바스크립트가 위치한 URL(확장자:js)
- 주석은 // 로 처리 (한줄 주석)
- <!--, --> : HTML내의 주석으로 script를 인식하지 못하는 브라우져에게 감춘다.
- BODY나 HEAD에 위치할 수 있고, 여러번 Tag를 사용할 수 있다. 주로 <HEAD></HEAD>사이에 삽입한다. HEAD Tag에 자바스크립트를 기술하게 되면, HTML문서를 보여주기 전에 실행 된다.
- {}는 블록을 의미하고, /*에서 */까지는 주석문으로 인식하고, ;는 문장을 구분할 때 쓰인다.
- 자바스크립트 안에서는 대소문자를 구분한다. <Tag를 제외한 문자들>


2. 예제 실습
예제1>
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JAVASCRIPT">
//test
document.write("Hello, World!");
</SCRIPT>
</HEAD>
<BODY>
TEST Document
</BODY>
</HTML>

예제1 결과>
Hello, World! TEST Document

예제설명>
- // : 한줄 주석
- document.write("") : document라는 객체(실제로 화면에 출력되는 BODY에 대응되는 객체라고 생각하면된다.)에 "Hello, World!"라는 문장을 쓴라는 것이다.
- ; : 맨마지막에 ;문자는 C언어에서 온 것이지만, 약간 다른 것은 single line문장일 경우는 ;를 반듯이 사용할 필요가 있는 것은 아니다. 여러문장을 하나의 줄에 쓸때, 각 문장을 ;로 구분하는 것이다.

3. 함수사용하기
예제2>
<HTML>
<HEAD>
<script>
function call(){
    document.write("TEST")
}
</script>
<body>
<script>call();</script>
Result...
</body>
</html>

예제2 결과>
TEST Result...

4. 기본함수
alert(String) - String을 경고문으로 출력한다. (리턴값 없음)
confirm(String) - 화면에 경고문구와 확인, 취소버튼을 출력 (리턴값 true, false)
prompt(String, IntString) - 화면에 문자를 쓰고 초기값을 넣어준다. (리턴값 String)
parseInt(String) - 문자를 정수로 바꾸어 반환한다. (리턴값 int)
parseFloat(String) - 문자를 실수로 바꾸어 반환한다. (리턴값 Float)
eval(String) - 문자를 식으로 인식하여 계산결과를 반환한다. (리턴값 number)




[출처]DEADFIRE Homepage // Deadfire Program Master
(개인공부를 겸해 정리를 하는 것임을 알려드립니다.~)
반응형

'공부 > Javascript' 카테고리의 다른 글

내장객체  (0) 2011.07.11
객체  (0) 2011.06.21
javascript 문법  (0) 2011.06.20
Javascript란?  (0) 2011.06.15
반응형
1. 자바스크립트의 정의
클라이언트, 서버 응용프로그램 개발이 가능한 객체기반의 스크립트 언어 이다.

2. 작동원리
JavaScript는 HTML문서속에 포함되어서 전송되어 진다. 즉, 브라우져가 특정한 HTML을 요청하게 되면, 웹서버가 이를 브라우져에게 전송하게 된다. 브라우져는 HTML부분은 화면에 출력하고, Javascript부분은 실행 하게 되는 것이다. JavaScript는 HTML문서내에 포함되어 사용자의 행위에 반응하게 된다.

3. 장점
빠른 개발이 가능
배우기 쉽다
사용 컴퓨터의 OS에 무관하게 프로그램이 수행된다.
웹서버에 주는 부담이 적다

4. 단점 
사용할 수 있는 메소드가 적다.
소스코드를 감출 수가 없다.
디버깅도구와 개발도구가 부족하다.



[출처]DEADFIRE Homepage // Deadfire Program Master
(개인공부를 겸해 정리를 하는 것임을 알려드립니다.~)
반응형

'공부 > Javascript' 카테고리의 다른 글

내장객체  (0) 2011.07.11
객체  (0) 2011.06.21
javascript 문법  (0) 2011.06.20
Javascript 기초  (0) 2011.06.17

+ Recent posts