방통대 컴퓨터과학과 html 웹프로그래밍 정리내용입니다.
- 자바스크립트 VS 자바
Java : 별도의 소스 파일로 작성, 컴파일 언어, 객체지향언어, 자료형 선언, 보안유지 가능
javascript : html 내에 직접삽입, 인터프리터 언어, 객체기반언어, 자료형 선언 불필요, 보안취약
- 자바스크립트 선언 방식 : 내부 스크립트, 외부 스크립트, 인라인 스크립트 방식
- 변수 : 프로그램에서 다루는 데이터를 저장하기 위한 공간
- 식별자 : 변수/함수의 이름으로 사용하기 위해 프로그래머가 만든 단어(첫글자는 반드시 영문자, _ , $로 시작)
권장사항 : 낙타체표기 -> camelCase (첫 단어는 소문자, 나머지 단어 첫 글자는 대문자)
- 키워드 : 예약어(마음대로 사용 X)
- 변수선언 : 명시적인 선언 'var 변수명'
- 연산자 : 연산의 대상이 되는 피연사에 적용되는 연산
- 조건 연산자
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<script>
var a, b;
var result;
var max;
document.write("<h4>조건 연산자</h4>");
a = parseInt(prompt("첫 번째 숫자를 입력하세요", ""));
b = parseInt(prompt("두 번째 숫자를 입력하세요", ""));
result = " 입력 받은 숫자 " + a + ", " + b + " 중에서 ";
alert("a is : " + a + " b is : " + b);
max = a>b?a:b;
document.write(result + " 최대값은 " + max + " 입니다<br/>");
</script>
<title>Document</title>
</head>
<body>
</body>
</html>
- 조건문 : if, if else, switch case default
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<script>
var today = prompt("요일을 입력하세요 월/화/수/목/금/토/일", "");
switch (today) {
case "월" : document.write("오늘은 월요일입니다."); break;
case "화" : document.write("오늘은 화요일입니다."); break;
case "수" : document.write("오늘은 수요일입니다."); break;
case "목" : document.write("오늘은 목요일입니다."); break;
case "금" : document.write("오늘은 금요일입니다."); break;
case "토" : document.write("오늘은 토요일입니다."); break;
case "일" : document.write("오늘은 일요일입니다."); break;
default : document.write("올바른 요일을 입력하세요");
}
</script>
<title>Document</title>
</head>
<body>
</body>
</html>
- 반복문 : for, while, do~while(최소 한 번은 실행함)
for문
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<script>
var i, j, msg;
msg = prompt("input text", "hello");
for (i=6; i>=1; i--) {
document.write("<h" + i + "> " + msg + "</h" + i + "> ");
}
document.write("</hr>");
</script>
<title>Document</title>
</head>
<body>
</body>
</html>
do-while문
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<script>
document.write("do-while문으로 구구단 2단 출력<br/>");
var num = 1;
do {
document.write(" 2 * " + num + " = " + 2 * num + "<br/>");
num++;
}
while (num<=9);
</script>
<title>Document</title>
</head>
<body>
</body>
</html>
'문돌이의 IT > JavaScript' 카테고리의 다른 글
| [HTML 웹프로그래밍]자바스크립트 객체 (0) | 2017.05.15 |
|---|---|
| [HTML 웹프로그래밍]자바스크립트 함수 (0) | 2017.05.13 |
| AJAX 비동기방식 페이징처리 (0) | 2017.01.21 |
| CSS, JavaScript를 활용한 Modal Box 생성하기 (0) | 2017.01.19 |
| 자바스크립트 함수의 사용(리턴값있는함수, 매개변수) (0) | 2016.08.02 |