[1] Javascript 작성 방법: HTML 소스 코드에 포함되는 형태로 작성된다.
다음의 코드를 HTML 소스코드 안에 명시.
일반적으로 <head>~</head>에 위치한다.
<script [type="text/javascript"]>
... javascript 구문...
</script>
...
<script> 태그를 제외한 javascript 구문만 ".js"로 저장된 별도의 파일로 분리하고
<script> 태그의 src 속성으로 분리된 파일의 경로를 참조시킨다.
```javascript
<script [type="text/javascript"] src="*.js파일의 경로"></script>
```
[4] 콘솔: 웹 브라우저에서 화면에 표시되는 것과 관계없이 어떠한 내용을 출력하기 위한 공간.
[5] 변수
데이터를 저장하기 위한 키워드. 변수를 사용하기 위해서는 선언과 할당의 과정이 필요하다.
```javascript
var 변수이름; // 변수의 선언
변수이름 = 값; // 선언된 변수에 값 할당
```
[6] 선언과 할당을 결합한 형태
...javascript
var 변수이름 = 값;
...
- 변수의 이름은 영어+숫자+언더바의 조합으로 구성한다.
- 띄어쓰기가 필요한 경우 언더바를 사용하거나 첫 글자를 대문자로 표현.
- 값의 할당은 오른쪽에서 왼쪽으로만 가능.
* 저장 가능한 값의 종류
- Boolean : 논리값, 참(true) | 거짓(false)
- Number : 정수(integer, int), 실수(double, float)값
- String : 문자열(문장), 쌍따옴표나 홑따옴표로 감싸서 표현.
- Null : 값이 확정되기 이전에 임의로 비워둔 형태. - ""로 표현하기도 함.
- undefined : 값이 할당되기 이전에 임의로 비워둔 형태. (undefined만 앞글자가 소문자로 시작) - 처음부터 변수가 선언만 되고 아무런 값도 할당되지 않음!
[연산자]
1. 대입 연산: 변수에 숫자나 문자열 등의 자료를 입력하거나 연산 결과를 다른 변수에 할당한다. (=)
2. 사칙연산
- 기본적인 +, -, *, /(몫) , %(나머지) ----> 10/3=3.33333... | 10%3=1
- 곱하기, 나누기가 더하기, 빼기보다 우선함.
- 괄호 ()로 묶은 부분이 최우선 처리됨.
- 더해지는 값에 문자열이 포함되어 있는 경우 모두 하나의 문장으로 결합된다.
```javascript
var a = "가나다";
var b = 123;
var c = a + b; //"가나다123"
```
3. 단항연산
연산 결과를 변수 스스로에게 다시 적용할 경우의 단축표현.
모든 사칙연산자에 대해서 표현 가능함.
```javascript
var a = 100;
a = a + 10; //a가 10 증가됨.
a += 10; //같은 표현
```
4. 증감연산
단항 연산에서 사용되는 값이 1이고 덧셈과 뺄셈의 경우만 축약 가능함.
```javascript
var a = 100;
a++;
++a;
a--;
--a;
```
다른 연산식에 포함된 경우 증감연산자의 위치에 따라서 계산되는 시점이 다르다.
```javascript
var a = 1;
//(뒷북) 100+1을 먼저 수행해서 y값을 확정. 그 후 a가 증가함.
y = 100 + a++;
//(앞북) a가 먼저 1 증가하고 100+2가 수행되서 y값을 확정.
y = 100 + ++a;
```
5. 비교연산
일반적인 부등식
- 같다: ==
- 다르다: !=
- 크다(초과): >
- 크거나 같다(이상): >=
- 작다(미만): <
- 작거나 같다(이하): <=
부등식의 결과는 참 (true), 혹은 거짓(false)이 된다.
```javascript
var a = 100 < 1000; //true
var b = 50 >= 1000; //false
```
ex) 평균점수가 80점 이상인 사람을 구하기 ...
... > 80
6. 논리연산
참과 거짓을 and(&&), or(||)로 비교하여 결과를 도출
&&: 모든 값이 참인 경우만 결과가 참.
||: 하나라도 참이면 결과가 참.
[프로그램의 흐름제어]
-조건문-
1. if 문
괄호안에 주어진 조건이 참인 경우 블록 {}안을 수행.
cf) { ... } 안에 들어갈 구문이 한 줄만 있는 경우, { } 를 생략 가능.
```javascript
if(조건) {
//..조건이 참인 경우 실행할 명령 ...
}
조건에 명시할 수 있는 형식
비교식 (==, !=, >, >=, <, <=)
논리식 (&&, ||)
논리값 (true / false)
2. If ~ else 문
조건이 참인 경우 if 블록이 실행. 그렇지 않은 경우 else 블록이 실행
if (조건) {
//...조건이 참인 경우 실행할 명령...
} else (조건) {
//...조건이 참이 아닌 경우 실행할 명령...
}
3. If ~ else if ~ else문
여러 개의 조건을 나열하여 그 중 가장 처음 만나는 참인 조건의 블록을 수행함. 그 외의 블록은 실행하지 않고 빠져 나간다.
if (1차 조건) {
...
} else if (2차 조건) {
...
} else if (3차 조건) {
...
} else { ---> 생략가능
...
}
4. switch문
하나의 변수값에 대한 여러가지 경우의 수를 나열하고 그 중 참인 경우를 실행함.
switch (변수) {
case "값1" : //경우의 수는 필요한 만큼 나열
...
break;
case "값2" :
...
break;
case "값3" :
...
break;
default : //일치하는 경우가 없을 경우 수행할 블록 (생략가능)
...
break;
}
[프로그램의 흐름제어]-조건문-1. if 문괄호안에 주어진 조건이 참인 경우 블록 {}안을 수행.cf) { ... } 안에 들어갈 구문이 한 줄만 있는 경우, { } 를 생략 가능.```javascriptif(조건) {//..조건이 참인 경우 실행할 명령 ...}조건에 명시할 수 있는 형식비교식 (==, !=, >, >=, <, <=)논리식 (&&, ||)논리값 (true / false)2. If ~ else 문조건이 참인 경우 if 블록이 실행. 그렇지 않은 경우 else 블록이 실행if (조건) {//...조건이 참인 경우 실행할 명령...} else (조건) {//...조건이 참이 아닌 경우 실행할 명령...}3. If ~ else if ~ else문여러 개의 조건을 나열하여 그 중 가장 처음 만나는 참인 조건의 블록을 수행함. 그 외의 블록은 실행하지 않고 빠져 나간다.if (1차 조건) {...} else if (2차 조건) {...} else if (3차 조건) {...} else { ---> 생략가능...}4. switch문하나의 변수값에 대한 여러가지 경우의 수를 나열하고 그 중 참인 경우를 실행함.switch (변수) {case "값1" : //경우의 수는 필요한 만큼 나열...break;case "값2" :...break;case "값3" :...break;default : //일치하는 경우가 없을 경우 수행할 블록 (생략가능)...break;}반응형