2. Contents
1. JavaScript?
2. Data Types
3. Comparisons
4. Variables
5. 조건문 – if
6. 반복문 - while
7. 반복문 – for
8. Function
9. Practice (1, 2)
2
3. 1. JavaScript?
▶ 웹 페이지를 동적으로, 프로그래밍적으로 제어하기 위해서 고안된 언어
HTML이 한번 화면에 출력된 후에는
그 형태나 동작방법을 바꿀 수 없는 문제를 해결 !
▶ 웹 브라우저에서 사용할 수 있는 프로그래밍 언어
웹의 중요함은 더욱 확대될 전망
웹에서 구동되는 언어인 JavaScript의 중요함도 점점 커질 것 !!
▶ 최근에는 자바스크립트가 웹을 벗어나서 광범위하게 사용
효용이 다각적이면서도 배우기 쉬움
중급 개발자나 프로그래밍 입문자 모두가 도전해볼만한 언어 !!!
3
4. 2. Data Types
▶ Number : 코드 작성 시, 따옴표(큰, 작은)가 붙지 않은 숫자는 숫자로 인식
ex) 4 , 4+2, 3-1, 2*6, 12/4
▶ String : 코드 작성 시, "(큰 따옴표) 혹은 '(작은 따옴표)로 감싸야 함
ex) “hello world”, ‘hello world’, “1”, ‘jaeeun’s javascript’
“hello. n javascript”
“hello"+“world”, “hello world”.length
▶ Boolean : true 또는 false 중 하나의 값만 취함
ex) true, false, 10>1, 1<10
4
5. 3. Comparisons
▶ 프로그래밍에서 비교란, 주어진 값들이 같은지, 다른지, 큰지, 작은지를 구분
=> 비교 연산자의 결과는 true나 false 중의 하나
true는 비교 결과가 참이라는 의미, false는 거짓이라는 뜻
(1) === : equal to
(2) !== : not equal to
(3) > : greater than
(4) < : less than
(5) >= : greater than or equal to
(6) <= : less than or equal to
5
6. 4. Variables
▶ 변수는 (문자,숫자 같은) 값을 담는 컨테이너로 값을 유지할 필요가 있을 때 사용
var varname = data ; ex) var a = 1;
alert(a+1); // 2
▶ 변수의 효용 – 코드의 재 활용성
alert(100+10);
alert((100+10)/10);
alert(((100+10)/10)-10);
alert((((100+10)/10)-10)*10);
a = 100;
a = a + 10; alert(a);
a = a / 10; alert(a);
a = a - 10; alert(a);
a = a * 10; alert(a);
6
7. 5. 조건문 - if
▶ 조건문이란 주어진 조건에 따라서 다르게 동작하도록 하는 것
if (false) {
alert(1);
} else if (false) {
alert(2);
} else if (true) {
alert(3);
} else {
alert(4);
} // 3
- 조건문은 if로 시작, if 뒤의 괄호에 조건이 옴
- if문의 조건이 true라면 if의 중괄호 구간이
실행되고, false라면 else 중괄호 구간이 실행
- else if는 다양한 케이스 조건을 검사할 수 있음
- else if의 특징은 여러개가 올 수 있다는 점
- else if의 모든 조건이 false라면 else가 실행
- else는 생략 가능
7
8. 6. 반복문 – while
▶ 반복문은 컴퓨터에게 반복적인 작업을 지시하는 방법
while (true) {
반복해서 실행할 코드
}
“ 무한루프 발생!!!!”
var i = 0;
while (i < 5) {
console.log(“Hello”);
i++
}
Hello
Hello
Hello
Hello
Hello
8
9. 7. 반복문 – for
▶ while과 for는 서로 대체 가능하기 때문에 상황에 따라 선택해서 사용 가능
for (초기화; 반복조건; 반복이 될 때마다 실행되는 코드) {
반복해서 실행될 코드
}
for (var i = 0; i < 5; i++) {
console.log(“Hello”);
}
Hello
Hello
Hello
Hello
Hello
9
10. 8. Function
▶ 함수란 하나의 로직을 재실행 할 수 있도록 하는 것, 코드의 재사용성을 높여줌
function 함수명 ( ) {
코드
return 반환값
}
function numbering() {
i = 0;
while (i < 5) {
console.log(i);
i += 1;
}
}
numbering();
0
1
2
3
4
var 함수명 = function ( ) {
코드
return 반환값
}
10
11. 8. Function
▶ 함수의 효용 – 재사용성
var i = 0;
while (i < 5) {
console.log(“Hello”);
i++
}
var i = 0;
while (i < 5) {
console.log(“Hello”);
i++
}
var i = 0;
while (i < 5) {
console.log(“Hello”);
i++
}
function numbering(){
var i = 0;
while(i < 10){
console.log(i);
i += 1;
}
}
numbering();
numbering();
numbering();
11
12. 9. Practice (1) – “rock, paper, scissors game! ”
12
user : rock
computer : rock
"The result is a tie!"
13. 13
9. Practice (2) – “ dragon slaying mini game! ”
◈ 이겼을 때
You hit the dragon
player slew the dragon
◈ 졌을 때
The dragon defeated you