KUMHO SOFTWARE DEVELOPMENT 이 름 : 정홍도 ( 과장 ) 팀 명 : 개발사업팀 일 자 : 2007.6.25 과목 명.

Presentation on theme: "KUMHO SOFTWARE DEVELOPMENT 이 름 : 정홍도 ( 과장 ) 팀 명 : 개발사업팀 일 자 : 2007.6.25 과목 명."— Presentation transcript:

1 KUMHO SOFTWARE DEVELOPMENT 이 름 : 정홍도 ( 과장 ) 팀 명 : 개발사업팀 일 자 : 2007.6.25 과목 명

2 KUMHO SOFTWARE DEVELOPMENT 2 ◈ 1. 주석문 작성방법 ◈ 2. 변수의 사용 ◈ 3. 예약어 ◈ 4. 자료형 ◈ 5. 변수의 자료형 변환 ◈ 6. 연산자 ◈ 7. 사용자 정의 함수 ◈ 8. 클래스의 사용 목 차

3 KUMHO SOFTWARE DEVELOPMENT 3 자바스크립트 소스에서 주석문의 2 개의 종류 1) 단일행 주석 // - “//” 부호로 시작되는 행은 실행하지 않는다. 2) 블록 주석 /* */ - “/*” 부호와 “*/” 사이의 코드는 실행되지 않는다. 자바스크립트 시험 2-1 /* 주석문 */ document.write(" 설명문 테스트 ") // 이것도 주석문 1. 주석문 (comment) 실행결과 : 예:예:

4 KUMHO SOFTWARE DEVELOPMENT 4 변수 (variable) 프로그램에서 자료를 저장하기 위해 가지고 있는 메모리 반드시 영문자나 ‘_’ 로 시작, 특수기호 불가 저장하고 있는 값은 변할 수 있다. 예약어는 변수로 사용할 수 없다. 대소문자를 구분한다. 변수 예 A, a, aa, num, it12, _abc 3sum, %ab, @com -> 잘못 만든 예 2. 변수의 사용

5 KUMHO SOFTWARE DEVELOPMENT 5 변수의 초기화 변수에 값을 저장하면 자동적으로 자료형이 정의된다. –a = 1; –str = ‘ 자바스크립트 ’; ☞ ‘a = b’ 는 b 값을 a 에 저장한다는 의미이다. var 를 이용한 변수의 선언 및 초기화 –var i = 10; 2. 변수의 사용

6 KUMHO SOFTWARE DEVELOPMENT 6 변수의 값 출력 자바스크립트 시험 2-2 /* 변수의 값 출력 */ a = 10; str = " 자바스크립트 "; document.write("a = " + a + " "); document.write(str); 2. 변수의 사용 예:예: 출력결과 :

7 KUMHO SOFTWARE DEVELOPMENT 7 var 키워드를 사용한 변수 선언 자바스크립트 시험 2-3 /* var 을 이용한 변수 선언 */ var a, aa = 10; var str = " 자바스크립트 "; document.write("aa = " + aa + " "); document.write(str); 2. 변수의 사용 예:예: 출력결과 :

8 KUMHO SOFTWARE DEVELOPMENT 8 예약어 예약어란 특별한 용도로 미리 지정한 단어 abstractbooleanbreakbytecase catchcharclassconstcontinue defaultdodoubleelseextends falsefinalfinallyfloatfor functiongotoifimplementsimport ininstanceofintinterfacelong nativenewnullpackageprivate protectedpublicreturnshortstatic superswitchsynchronizedthisthrow throwstransienttruetryvar voidwhilewith 3. 예약어

9 KUMHO SOFTWARE DEVELOPMENT 9 자료형란 컴퓨터가 처리하는 데이터의 종류 자바스크립트의 자료형 : 숫자형 ( 정수형, 부동소수점형 ) 문자형 논리형 : 참 (true), 거짓 (false) Null 참조형 ( 내장객체, 클래스 객체 ) 4. 자료형

10 KUMHO SOFTWARE DEVELOPMENT 10 정수형 (integer) : 소수점이 없는 수 10 진수 : -100,-50,-1,0,1,30,1000 8 진수 : 숫자 앞에 ‘0’ 을 붙인다. –0111, 0777 16 진수 : 숫자 앞에 ‘0x’ 를 붙인다. –0x1010, 0xB0A1 10 진수 8 진수 16 진수 4040x04 100120xA 300360x1E 4. 자료형

11 KUMHO SOFTWARE DEVELOPMENT 11 숫자형 데이터의 출력 자바스크립트 시험 2-4 /* 숫자 출력 예제 */ document.write(" 십진수 : " + 10 + " "); document.write("8 진수 (012) 도 십진수로 출력 : " + 012 + " "); document.write("16 진수 (0xa) 도 십진수로 출력 : " + 0xa+ " "); 4. 자료형

12 KUMHO SOFTWARE DEVELOPMENT 12 부동소수점형 (floating-point) 소수부분이 있는 숫자 2.1, -10.2 1.3E3(1.3*10 3 ) 자바스크립트에서 부동소수점 계산은 가끔 정확하지 않을 수 있다. -> 정수형 사용 권장 논리형 (Boolean) 크기가 1 비트 사용가능한 값 : true, false null 아무 값도 없음을 의미 4. 자료형

13 KUMHO SOFTWARE DEVELOPMENT 13 실수자료의 부정확성 자바스크립트 시험 2-4 /* 실수자료의 부정확성 */ aa = 10; bb = 5.333; cc = 5.444; document.write(aa + " + " + bb + " = " + (aa + bb)); document.write(" "); document.write(aa + " + " + cc + " = " + (aa + cc)); 4. 자료형

14 KUMHO SOFTWARE DEVELOPMENT 14 Boolean( 논리형 ) 자료의 출력 자바스크립트 시험 2-6 /* boolean 자료의 출력 */ aa = true bb = false; document.write("aa = " + aa); document.write(" "); document.write("bb = " + bb); 4. 자료형

15 KUMHO SOFTWARE DEVELOPMENT 15 문자형 문자자료 취급 따옴표 (‘ ’ 또는 “ ”) 를 사용하여 문자 기록 –‘ 자바스크립트 ’, “java” 특수문자의미 \n 다음 줄로 이동 \tTab \b 백스페이스 \r 리턴 \\ 역슬래시 (\) \’\’ 작은 따옴표 \”\” 큰 따옴표 4. 자료형

16 KUMHO SOFTWARE DEVELOPMENT 16 문자형 자료의 출력 자바스크립트 시험 2-7 /* boolean 자료의 출력 */ aa = " 특수문자 출력 : " bb = "\\, \', \""; document.write(aa + bb); 4. 자료형

17 KUMHO SOFTWARE DEVELOPMENT 17 1) 선언된 변수에 부동한 유형의 값을 대입하면 변수의 유형도 자동으로 변환된다. test = 10; -> test 는 정수형 test = “ 문자열 ”; -> test 는 문자형 2) 변수에 저장된 값의 변환 문자형 => 숫자형 - Number() 함수 - 예 : var strValue = “12”; alert(“ 변환 후 변수의 값 *100 : ” + (Number(strValue) * 100) ); 출력 결과 : 변환 후 변수의 값 *100 : 1200 숫자형 => 문자형 - 숫자형 + 문자형 => 문자형 - 예 : alert(“” + 1234); // 문자열 “1234” 출력 5. 변수의 자료형 변환 (Casting)

18 KUMHO SOFTWARE DEVELOPMENT 18 변수의 자료형 변환 사례 자바스크립트 시험 2-8 /* 변수의 자료형 변환 */ a = 10; document.write("a = " + a + " "); a = " 문자형으로 변환 "; document.write("a = " + a); 5. 변수의 자료형 변환 (Casting)

19 KUMHO SOFTWARE DEVELOPMENT 19  대입연산자  산술연산자  증감연산자  비교연산자  논리연산자  조건연산자  비트연산자 6. 연산자

20 KUMHO SOFTWARE DEVELOPMENT 20 대입연산자 - 할당연산자라고도 한다. - ‘=’ 기호 사용 a = b; –b 값을 a 에 저장한다는 의미 – 수학에서와 같이 a 와 b 가 같다는 의미가 아니다. –a = a + 1; 6. 연산자

21 KUMHO SOFTWARE DEVELOPMENT 21 산술연산자 +,-,*,/,% % : 나머지 자바스크립트 시험 2-11 a = 5; b = 2; document.write(a + " / " + b + " = " + (a/b)); document.write(" "); document.write(a + " % " + b + " = " + (a%b)); 6. 연산자

22 KUMHO SOFTWARE DEVELOPMENT 22 증감연산자 ++ : 1 증가 (a++ 는 a=a+1 과 동일 ) -- : 1 감소 (a-- 는 a=a-1 과 동일 ) 자바스크립트 시험 2-12 a = 5; b = 5; document.write("1.a = " + a++ + ", b = " + b-- + " "); document.write("2.a = " + a + ", b = " + b + " "); document.write("3.a = " + ++a + ", b = " + --b + " "); document.write("4.a = " + a + ", b = " + b + " "); 6. 연산자

23 KUMHO SOFTWARE DEVELOPMENT 23 비교연산자 - 값의 대소를 비교 비교연산자의미 a == b a 와 b 는 같다 a != b a 와 b 는 같지 않다 a < b a 는 b 보다 작다 a <= b a 는 b 보다 작거나 같다 a > b a 는 b 보다 크다 a >= b a 는 b 보다 크거나 같다 6. 연산자

24 KUMHO SOFTWARE DEVELOPMENT 24 숫자 비교 연산의 결과 출력 자바스크립트 시험 2-13 a = 10; b = 5; document.write("1." + a + " == " + b + " : " + (a == b) +" "); document.write("2." + a + " != " + b + " : " + (a != b) +" "); document.write("3." + a + " > " + b + " : " + (a > b) +" "); document.write("4." + a + " <= " + b + " : " + (a <= b)); 6. 연산자

25 KUMHO SOFTWARE DEVELOPMENT 25 문자비교 연산의 결과 출력 자바스크립트 시험 2-14 a = "abc"; b = "abc"; document.write("1." + a + " == " + b + " : " + (a == b) +" "); a = "AAA"; b = "ABC"; document.write("2." + a + " < " + b + " : " + (a < b)); 6. 연산자

26 KUMHO SOFTWARE DEVELOPMENT 26 논리연산자 - AND, OR, NOT 등 논리연산을 수행하는 연산자 논리요소 NOTANDOR AB!AA && BA || B TTFTT TFFFT FTTFT FFTFF 6. 연산자

27 KUMHO SOFTWARE DEVELOPMENT 27 논리연산자 사례 10 > 5 && 10 > 3 -> true 10 > 5 && 11 > 15 -> false 10> 5 || 15 > 20 -> true !(10 > 5) -> false 10 > 20 || 5 > 10 -> false 6. 연산자

28 KUMHO SOFTWARE DEVELOPMENT 28 예제 – 논리연산자 사용 자바스크립트 시험 2-15 a = 10; b = 5; c = 20; document.write("1.!(" + a + " > " + b + ") = " + !(a>b) +" "); document.write("2.10 > 5 && 20 > 5 = " + (10>5 && 20>5) +" "); document.write("2.10 > 5 && 5 > 20 = " + (10>5 && 5>20) +" "); document.write("2.10 > 5 || 5 > 20 = " + (10>5 || 5>20) +" "); document.write("2.10 20 = " + (10 20)); 6. 연산자

29 KUMHO SOFTWARE DEVELOPMENT 29 조건연산자 기본형식 조건 ? a : b ; 조건이 참이면 a 수행, 거짓이면 b 수행 자바스크립트 시험 2-16 a = 10; b = 5;; a > b ? c = true : c = false; document.write("c = " + c); 6. 연산자

30 KUMHO SOFTWARE DEVELOPMENT 30 비트연산자 값을 비트 단위로 AND(&), OR(|) 연산 11 & 5 = 00001011 & 00000101 = 1 자바스크립트 시험 2-17 document.write("11 & 5 = " + (11&5)); document.write(" "); document.write("11 | 5 = " + (11|5)); 6. 연산자

31 KUMHO SOFTWARE DEVELOPMENT 31 연산자 우선순위 우선순위연산자 1[], () 2++, --, ! 3*, /, % 4+, - 5, >= 6==, != 7& 8| 9&& 10|| 6. 연산자

32 KUMHO SOFTWARE DEVELOPMENT 32 함수의 사용 1) 함수의 선언 - function 키워드 사용 - 예 : FUNCTION 함수명 ( 형식 매개변수 리스트 ) { 함수체 … } 1) 함수의 호출 - 함수명 ( 실 매개변수 리스트 ) - 예 : function funcTest(value1,value2) { alert(“funcTest : 매개변수 : ” + value1 + “ : ” + value2); } var result = funcTest(“ 첫번째 매개변수 ”,” 두번째 매개변수 ”); 출력 결과 : funcTest : 매개변수 : 첫번째 매개변수 : 두번째 매개변수 7. 사용자 정의 함수

33 KUMHO SOFTWARE DEVELOPMENT 33 1) 클래스의 정의 - 함수의 정의와 마찬가지로 FUNCTION 키워드로 정의 - 예 : FUNCTION 클래스명 ( 형식 매개변수 리스트 ) { 클래스 맴버변수 선언 클래스 맴버함수 선언 } 2) 클래스의 사용 - 클래스는 new 키워드로 객체를 생성한 후 사용이 가능 - 예 : function userInfo(id,name) { this.userId = id; this.userName = name; } var objUserInfo = new userInfo(“0001”,” 홍길동 ”); alert(“ 아이디 : ” + objUserInfo.userId); alert(“ 사용자 : ” + objUserInfo.userName); 8. 클래스의 사용 클래스는 데이터와 데이터를 처리하는 함수를 포함

34 KUMHO SOFTWARE DEVELOPMENT 34 클래스 사용 사례 : function objDef(code,name){ this.defCode = code; this.defName = name; setCode = setDefCode; setName = setDefName; getCode = getDefCode; getName = getDefName; } setDefCode(code) { this.defCode = code; } getDefName() { return this.defName; } … var obj = new objDef(“0001”,” 홍길동 ”); alert(“ 사용자명은 ” + obj.getName()); 8. 클래스의 사용

35 KUMHO SOFTWARE DEVELOPMENT 35 감 사 합 니 다감 사 합 니 다