- 자료형
- 정수
- 부동소수점:소수가 있는 10진수를 의미하며 지수를 사용하여 표현할수가 있다.
- Boolean형:1비트인 자료형으로 참과 거짓을 나타낸다.true=참 false=거짓
함수 리턴값, 관계 연산자의 결과값으로 사용을 한다. - null 값: 값이 없다는 것을 의미함
- 문자열: " " 나 ' '안에 들어가는 모든 문자를 의미한다.
문자열 안에 특수문자를 삽입할수가 있는데 의미는 아래의 표와 같다.\n 다음줄로 이동(newline) \b 백스페이스(backspace) \r 리턴(return) \t 탭문자 삽입(tab) \\ 역슬래시 \' 작은따옴표(') \" 큰따옴표(") - 변수선언
- 특정 자료형의 값을 지닌 저장 장소로 변수를 만들때 변수명의 시작은 반드시 알파벳이나
"_ "로 시작해야 한다.
- 자바스크립트에서 사용하는 키워드는 사용할수가 없다.
true, do, if ,for, return ,this,else.......등등
- 자바스크립트 에서는 변수에 값을 할당 하기만 하면 그 입력값에 해당하는 변수가
선언이 된 것이다.
str="중학생"(문자열 변수) , a1 = 1 (정수형변수)
- Var을 이용해서 선언을 할수도 있다.
Var intvar , str
- 자바스크립트 에서는 변수의 자료형을 쉽게 바꿀수가 있다
Var a1="학생"
a1은 현재 문자열 변수이다.
형변환 하려면 자료만 바꿔준다.
a1 = 20
a1은 정수형 변수로 형변환 되었다.
- 연산자
연산자에는 수치연산자,비교연산자,조건연산자,대입연산자,비트연산자 등이 사용된다.- 수치연산자
- 비교연산자
값을 비교해서 결과를 리턴하는 연산자이다.
작다,크다,같다,다르다 등을 주로 비교한다A < B A가 B보다 작다 A > B A가 B보다 크다 A <= B A가 B보다 작거나 같다 A >= B A가 B보다 크거나 같다 A == B A가 B와 같다 A != B A가 B와 다르다 - 조건연산자
주어진 조건이 참인지 거짓인지를 판단하여 그 결과를 리턴해준다.
두가지 조건이 동시에 만족해야 참인 AND(&&)연산자
두가지 조건중 하나만 만족하면 참인 OR(||)연산자
주어진 하나의 값이 참인지 거짓인지에 따라 값을 취하는 ?연산자(3진연산자)가 있다.A B A && B A || B true true true true true false false true false true false true false false false false ? 연산자는 조건이 참인 경우 " : " 기호 앞에 있는 값이 선택되고 거짓인 경우 " : "뒤에 있는
값이 선택된다.a = 4;
b = (a < 3) ? 7 : 10;
조건이 거짓이라 : 뒤에 있는 10이 선택된다.
결과: b = 10
- 대입연산자
대입 연산자는 오른쪽에 있는 값을 왼쪽에 대입 시키는 연산자이다.
a1 = 3 (3을 a1에 대입시킨다)
= 에 수치 연산자를 붙인것을 복합 대입연산자 라고한다.수식 같은표현 a1 = 3
a1 += 5
결과: a1 = 8
a1 = 3
a1 = a1 + 5
결과: a1 = 8
-= , *= , /= , %= 도 사용 할 수 있다. - 비트연산자
주어진 두수의 비트값에 AND , OR , XOR 연산을 하는 기능과
비트값을 좌우측 으로 수평이동(Shift연산) 시키는 기능도 가지고 있다.
비트값은 숫자의 2진수 표현이다.
XOR연산의 진리표이다A B A ^ B 1 1 0 1 0 1 0 1 1 0 0 0 두 값이 서로 달라야 참이된다.
시프트(shift)연산자는 비트값이 한자리씩 왼쪽이나(왼쪽 시프트연산)
오른쪽(오른쪽 시프트연산)으로 이동하는 것을 의미한다.A << B (A의 값을 B번 왼쪽으로 시프트)
A >> B (A의 값을 B번 오른쪽으로 시프트)10 << 1 (10을 왼쪽으로 1번 시프트함)
00001010 << 1 (10을 2진수 표현으로 변환한것,8비트적용)
0 0 0 0 1 0 1 0
↙↙↙↙ (왼쪽으로 한자리씩 이동함)
0 0 0 1 0 1 0 0 ← (앞의 비트값은 사라지고 뒤에 들어올 값이 없으면 무조건 0 이
들어간다.)
10100 => 20 ( 십진수로 표현) 한비트 움직일때마다 2를 곱해준 값하고 같다.예제1 실행화면 1.<script language="javascript">
<!--
x = 10 << 1;
document.write(x);
//-->
</script>
20 2.<script language="javascript">
<!--
x = 10 << 2;
document.write(x);
//-->
</script>
40
오른쪽 시프트는 한비트 이동할 때마다 2로 나누어준 값하고 같다.
예제2 실행화면 1.<script language="javascript">
<!--
x = 20 >> 1;
document.write(x);
//-->
</script>
10 2.<script language="javascript">
<!--
x = 20 >> 2;
document.write(x);
//-->
</script>
5
오른쪽 시프트는 부호가 필요없는 정수일때 앞에 0 이 들어가고
음수 일때는 1 양수일때는 0 이 들어간다. - Boolean NOT 연산자( ! )
Boolean 값을 반전시키는 연산자로 true 일때는 false 로 false일때는 true가 된다.
a = false;
a = !a;
a 의값은= true연산자 우선순위 순위 연산자 설명 1 . [] () 괄호 2 ++ -- ! 증감,불린not 3 * / % 수치연산 4 + - 수치연산 5 << >> 시프트연산 6 < > <= >= 비교연산 7 == != 비교연산 8 & 비트연산 9 ^ 비트연산 10 | 비트연산 11 && 조건연산 12 || 조건연산 13 ? : 조건연산 14 = += -= *= /= %= &= ^= |= >>= <<= 대입연산
수치계산에 쓰이는 연산자이다
+ (덧셈), - (뺄셈), * (곱셈), / (나눗셈), % (나머지),++ (증가),-- (감소), 단항연산자
++,--는 하나씩 증가 하거나 감소 시키는 연산자이다.a1 = 1
① sum = ++a1 (a1값이 2로 증가한후 sum에 대입된다)==> sum=2 , a1=2
② sum = a1++ (a1값 1이 먼저 sum에 대입된후 a1은 2가된다)==> sum=1 , a1=2
앞뒤 어디에 붙느냐에 따라 값이 변하므로 주의해야 한다.단항연산자는 변수값 앞에 부호를 붙인것을 의미한다.
-a1 = (-1*a1)
예외) "고등" + "학생" ==> 고등학생 (이때 +는 문자열 연산자로 변한다) - 제어문
- if-else
주어진 조건을 만족 할때만 지정된 동작을 수행한다. 조건1이 참인경우 문장1
조건2가 참인경우 문장2
모든조건이 거짓인경우 문장n예제3 실행화면 <script language="javascript">
<!--
a = 1, b = 2, c = 3;
if(a == 2) {
document.write("a = 2 입니다.")
}
else if(b == 4) {
document.write("b = 4 입니다.")
}
else {
document.write("모든 조건이 틀렸군요.<br>")
document.write("c값을 출력 하겠습니다.<br>")
document.write("c = "+c)
}
// -->
</script>
모든 조건이 틀렸군요.
c값을 출력 하겠습니다.
c = 3예제4 실행화면 <script language="javascript">
<!--
function food(form) {
for(var i=0 ; i < form.a1.length;i++) {
if(form.a1[i].checked == true) {
alert(form.a1[i].value + "를 좋아 하는군요")
return document.form1.reset();
}
}
}
// -->
</script>
<어떤음식을 좋아하세요?
<form name=form1>
김치찌게 <input name="a1" type=radio value="김치찌게">
된장찌게 <input name="a1" type=radio value="된장찌게">
피자 <input name="a1" type=radio value="피자"><input type=button value="선택" onclick="food(this.form)" >
</form>
어떤음식을 좋아하세요? <FORM name="form1">김치찌게 <INPUT type="radio" value="김치찌게" name="a1">
된장찌게 <INPUT type="radio" value="된장찌게" name="a1">
피자 <INPUT type="radio" value="피자" name="a1"><INPUT onclick="food(this.form)" type="button" value="선택하기"> </FORM>
- while
주어진 조건이 만족되는 동안 반복해서 지정된 기능을 수행한다.
반복 제어문 이다
while문은 조건을 먼저 검사한후 참이면 문장을 실행한다.
처음 조건이 거짓이면 문장을 한번도 실행 시키지 않는다.while (조건) {
문장;
}조건이 거짓(false)이 될때까지 계속 문장을 반복해서 수행한다.
바꿔 말하자면 참(true)인 동안에는 계속해서 문장을 반복수행 하고 거짓이 될때
while문을 빠져 나간다.예제5 실행화면 3단출력 <script language="javascript">
<!--
i=1;
while(i <10) {
document.write("3 * "+ i + " = " + 3*i + "<br>")
i++
}
// -->
</script>
3단출력 3 * 1 = 3
3 * 2 = 6
3 * 3 = 9
3 * 4 = 12
3 * 5 = 15
3 * 6 = 18
3 * 7 = 21
3 * 8 = 24
3 * 9 = 27
while(i <10)에서 i값이 참(true)이므로 3*i(1)를 실행한다
i++에 의해 i=2가 되었지만 그래도 조건이 참이므로 3*i(2) 를 실행한다
계속 반복 하다가 i값이 10이 되면 조건이 거짓(false)이 되므로 while문을 빠져 나간다. - do while
while문과 다른점은 일단 문장을 먼저 실행한후 조건을 검사해서 참이면 계속해서 문장을
실행 시키고 거짓이 되면 do while문을 빠져 나가게 된다.
최소한 한번은 문장이 실행된다.예제6 실행화면 4단출력 <script language="javascript">
<!--
i=1;
do {
document.write( "4 * "+ i + " = " + 4*i + "<br>")
i++
} while(i<10);
// -->
</script>
4단출력 4 * 1 = 4
4 * 2 = 8
4 * 3 = 12
4 * 4 = 16
4 * 5 = 20
4 * 6 = 24
4 * 7 = 28
4 * 8 = 32
4 * 9 = 36
- for
while처럼 주어진 조건이 참(true)인 동안만 문장을 반복해서 실행 시키고 거짓(false)이
되는 순간 for문을 빠져 나간다.for(초기값;조건;증감식) {
문장;
}변수에 초기값을 설정하고 변수가 조건에 참이면 문장을 실행한다
증감식에 의해 변수값은 1이 증감(증가와감소)하고 다시 조건을 비교해 본후 참이면
또 문장을 실행시킨다.
변수값이 증감 하다가 조건에 거짓이 될때 for문을 빠져나간다.예제7 실행화면 5단출력 <script language="javascript">
<!--
for(i=1 ; i<10 ; i++) {
document.write( "5 * "+ i + " = " + 5*i + "<br>")
}
</script>
5단출력 5 * 1 = 5
5 * 2 = 10
5 * 3 = 15
5 * 4 = 20
5 * 5 = 25
5 * 6 = 30
5 * 7 = 35
5 * 8 = 40
5 * 9 = 45
- break
반복 제어문(while,for) 안에서 제어문을 종료하는 역활을 한다.
break문 뒤에 실행을 중단시킬 위치를 지정 할 수 있다.예제8 실행화면 6.7단출력 <script language="javascript">
<!--
i=6 , j=1;
mirage1 :
while(true) {
mirage2 :
while(true) {
if(i == 8) break mirage1;
if(j == 10) {
j=1;
break mirage2;
}
document.write(i + " * " + j + " = " + i*j + "<br>")
j++;
}
i++;
}
// -->
</script>
6.7단출력 6 * 1 = 6
6 * 2 = 12
6 * 3 = 18
6 * 4 = 24
6 * 5 = 30
6 * 6 = 36
6 * 7 = 42
6 * 8 = 48
6 * 9 = 54
7 * 1 = 7
7 * 2 = 14
7 * 3 = 21
7 * 4 = 28
7 * 5 = 35
7 * 6 = 42
7 * 7 = 49
7 * 8 = 56
7 * 9 = 63
- continue
break문과는 다르게 제어문의 처음 부분으로 이동 시키는 역활을 한다.
continue문 뒤에 실행을 시작할 위치를 지정 할 수 있다 - return
함수에서 특정값을 리턴값으로 특정 위치에 보낼때 사용한다.
예제4 에 리턴값 으로 form을 초기화 시켰다. - switch
여러개의 조건마다 실행되는 문장을 서로 다르게 할때 사용한다.switch(표현식) {
case value1 :
문장1;
break;
case value2 :
문장2;
break;
........
default :
문장n;
}예제9 실행화면 1 ~ 10사이의 정수 영문출력 <script language="javascript">
<!--
i = prompt("1 에서 10 사이의 수를 적으세요.");
j = eval(i)
switch(j) {
case 1 : document.write("One");
break;
case 2 :document.write("Two");
break;
case 3 : document.write("Three");
break;
case 4 : document.write("Four");
break;
case 5 : document.write("Five");
break;
case 6 : document.write("Six");
break;
case 7 : document.write("Seven");
break;
case 8 : document.write("Eight");
break;
case 9 : document.write("Nine");
break;
case 10 : document.write("Ten");
break;
default : document.write("숫자오류");
}
// -->
</script>
1 ~ 10사이의 정수 영문출력 <INPUT onfocus="this.blur()" onclick="mirage2()" type="button" value="실행하기">
[출처] [2]자바스크립트 기초|작성자 붉은매
- if-else
10진수:일반정수
16진수:0x 로 시작하며 0~15까지의 수를사용, 10~15까지의 숫자는 영문 알파벳 A~F를
대신 사용한다
8진수:0 으로 시작하는수로 0 ~ 7 까지의 수를 사용한다