HTML_4일차 [JavaScript]
자바스크립트(JavaScript)
- 객체(object) 기반의 스크립트 언어입니다.
- HTML로는 웹의 내용을 작성하고, CSS로는 웹을 디자인하며, 자바스크립트로는 웹의 동작을 구현할 수 있습니다.
자바스크립트는 주로 웹 브라우저에서 사용되나, Node.js와 같은 프레임워크를 사용하면 서버 측 프로그래밍에서도 사용할 수 있습니다.
- 파이썬(Python) 처럼 타입을 자동지정해줌
- 사칙연산 가능, bool 형등 c# 과 같음
- switch, if ,else if 모두 작성가능
<script>태그안에 작성
alert : 알람창
ex) alert("hello javaScript");
prompt() : 입력값 받음 (scanf, readline)
document.write: 화면에 출력
/* */, //: 주석
bool 끼리 크기 비교를 하면 true=1, false=0 으로 인식하여 계산
변수할당: var 사용
var var1=1;
var var1=2;// 타 언어 프로그래밍 시 에러유발
alert(var1);
- 숫자와 문자열을 덧셈 연산하면 문자열 우선
- 더하기 연산자를 제외한 사칙 연산자는 숫자가 우선
예제> 입력된 두 수의 합 구하기
<!DOCTYPE html>
<html lang="ko">
<head>
<title></title>
<meta charset="UTF-8">
<style>
body{font-a}
</style>
</head>
<body>
<!--Java script-->
<script>
var num1=prompt("첫번째 수");
var num2=prompt("두번째 수");
var result=Number(num1)+Number(num2);
document.write("정답은"+result+"입니다.");
</script>
</body>
</html>
실행창>
new Date(): 날짜 생성객체
.toDateString(): 날짜를 문자열로 전환
.toLocateDateString(): 현재시간을 문자열로 전환
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
</head>
<body>
<script>
var now = new Date();
var hour= now.getHours();
document.write("현재시간"+hour+"시 <br>");
switch (true){
case hour < 11:
document.write("아침 먹을 시간입니다" );
berak;
case hour < 15:
document.write("점심 먹을 시간입니다" );
berak;
default:
document.write("저녁 먹을 시간입니다" );
berak;
}
</script>
</body>
</html>
결과>
예제>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
table{
border-collapse: collapse;
margin:10px;
float:left;
}
th{
background-color: gainsboro;
}
</style>
</head>
<body>
<script>
for(var i=1;i<10;i++){
document.write("<table border=\"1\"><tr><th>"+i+"단</tr></th>");
for(var j=1;j<10;j++){
document.write("<tr><td>"+i+" X "+j+" = "+i*j+"</td></tr>");
}
document.write("</table>");
}
</script>
</body>
</html>
결과>
함수선언
function 함수() {내용) ; } 형식으로 함수선언