과목명: 웹프로그래밍응용
교재: 모던웹을 위한 JavaScript Jquery 입문, 한빛미디어
2014년 1학기
Professor Seung-Hoon Choi
Part1. JavaScript / Ch02. 기본문법
2.1 기본 용어
2.1.1 표현식과 문장
표현식
– 값을 만들어내는 간단한 코드 – 예
273
10 + 20 + 30 * 2
‘RintIanTta’
문장
– 하나 이상의 표현식이 모여서 문장이 됨 – 세미콜론으로 종결
– 예
10 + 20 + 30 * 2;
Var rintiantta = ‘Rint’ + ‘Ian’ + ‘Tta’;
alert(‘Hello JavaScript..!’);
2.1.2 키워드
키워드
– 자바스크립트가 처음 만들어질 때 정해진 특별한 의미가 있는 단어 (28개)
– 예
if, else, for, break, …
true, false, null, …
2.1.3 식별자
식별자
– 자바스크립트에서 이름을 붙일 때 사용하는 단어 – 변수, 함수, 속성, 메소드 이름을 위해 사용됨
– 규칙
키워드를 사용하면 안 됨
숫자로 시작하면 안 됨
특수 문자는 ‘_’과 ‘$’만 허용됨
공백문자를 포함할 수 없음 – 관례
생성자 함수의 이름은 항상 대문자로 시작
변수, 인스턴스, 함수, 메소드의 이름은 항상 소문자로 시작
여러 단어로 이루어진 경우 각 단어의 첫 글자를 대문자로 함
2.1.4 주석
주석
– HTML 태그의 주석
<!– 주석문 -->
– 자바스크립트의 주석
// 한 줄짜리 주석
/* 여러 줄짜리 주석 */
2.2 출력
alert 함수 이용
– Visual Studio 2013 Express for Web 에서는
alert([String message]) 형식으로 보여줌
– String 타입의 message를 입력매개변수로 받는다는 의미
2.3 문자열
자바스크립트에서의 문자열
– 작은 따옴표 또는 큰 따옴표 이용 – 예
‘This is a string’
“This is a string”
‘This is a “string”’ // 작은 따옴표 내부에 큰 따옴표
“This is a ‘string’” // 큰 따옴표 내부에 작은 따옴표
“This is a \”string\”” // 에스케이프 문자 이용
‘This is a \’string\’’ // 에스케이프 문자 이용
2.3 문자열
에스케이프 문자
– 자주 사용하는 에스케이프 문자
\t(수평탭), \n(줄바꿈)
\’(작은 따옴표), \”(큰 따옴표)
\\(역 슬래시) – 예
alert(‘동해물과 백두산이\n마르고 닳도록’);
문자열 연결
– ‘+’ 기호 이용 – 예
‘가나다’ + ‘라마’ + ‘바사아’
2.4 숫자
숫자 자료형
– 정수와 실수 구분이 없다.
– 예
alert(273);
alert(52.273);
사칙 연산자
– +, -, *, /
나머지 연산자
– %
2.5 부울리언 자료형
부울리언 자료형
– true(참), false(거짓)
비교연산자
– >=, <=, >, <, ==, !=
true는 1로, false는 0으로 변환한 뒤 비교 연산을 수행함
논리 연산자
– !, &&, ||
2.6 변수
변수
– 값을 저장할 때 사용하는 식별자
2.6.1 변수 생성과 사용
두 단계
– 1. 변수 선언
– 2. 변수에 값 할당
변수 선언
– var 식별자;
2.6.2 복합 대입 연산자
복합 대입 연산자
– 연산과 할당을 한꺼번에 수행하는 연산자 – +=, -+, *=, /=, %=
– 예
value += 10;
list += ‘<ul>’;
2.6.3 증감 연산자
증감 연산자
– 변수++, ++변수, 변수--, --변수
2.7 자료형 검사
자료형 검사시
– typeof( ) 연산자를 사용함 – 예
alert(typeof(‘String’)); // string이 출력됨
alert(typeof(273)); // number가 출력됨
자바스크립트에서의 6가지 자료형
– 문자열, 숫자, 부울리언 형 – 함수, 객체
– undefined
2.8 undefined 자료형
undefined 자료형
– ‘존재하지 않는 것’을 위한 자료형 – 예
typeof( foo );
– foo 라는 변수가 선언되어 있지 않은 경우, ‘undefined’ 자료형이 반 환됨
– 변수를 선언했지만 초기화하지 않은 경우에도, 그 변수는 undefined 자료형을 가진다.
2.9 입력
문자열을 입력 받는 함수
– String prompt([String message], [String defaultValue]) – 코드 2-41 참조
부울리언 형을 입력 받는 함수
– Boolean confirm([String message])
사용자가 ‘확인’ 버튼을 누르면 true 리턴
사용자가 ‘취소’ 버튼을 누르면 false 리턴 – 코드 2-42 참조
사용자로부터 숫자를 입력 받는 함수는 없다
– 문자열을 입력 받아 숫자로 변환해야 함
2.10 숫자와 문자열 자료형 변환
문자열과 숫자 연산
– 문자열과 숫자를 더하면 숫자가 문자열로 변환되어, 문자열 연 결이 수행된다.
예
– alert(‘52’ + 273); // ‘52273’을 출력함
– 더하기 연산 이외에는, 문자열이 숫자로 변환되어 연산이 수행 된다.
예
– alert(‘52’ * 273); // 14196이 출력됨
2.10 숫자와 문자열 자료형 변환
문자열을 숫자로 변환 시
– Number( ) 함수 이용 – 코드 2-46 참조
숫자를 문자열로 변환 시
– String( ) 함수 이용
NaN 값
– Not a Number 의 약자
– ‘숫자로 변환할 수 없는 상황’이라는 것을 나타내기 위한 값 – 예
alert(Number(‘우리나라’)); // ‘NaN’이 출력됨
복소수도 NaN으로 표시됨(코드 2-47 참조)
2.11 불 자료형 변환
불 자료형으로 변환할 때는 Boolean( ) 함수를 사용함
– 예(코드 2-48 참조)
Boolean(0), Boolean(NaN), Boolean(‘’), Boolean(null), Boolean(undefined)는 모두 false로 변환됨
이외의 경우는 모두 true로 변환됨
– Boolean(‘false’)는 true로 변환됨
• 이유: ‘false’는 일반 문자열이기 때문
2.12 일치 연산자
비교 연산자 ‘==‘ 사용 시
– 자동으로 형변환이 일어나서 예상치 못한 결과가 발생할 수 있 다
– 코드 2-50 참조
일치 연산자 ‘===‘, ‘!===‘
– 자료형까지 일치하는지 검사하고자 할 때 사용함 – 코드 2-51 참조