HTML 파일에 작성하며 바디/헤드 태그 안쪽에
<script type="text/javascript"> </script> 사이에 작성한다.
모든 데이터 값의 변수 선언은 var로 통일된다.(자바의 int,String 등등)
System.out.println의 기능은 document.write로 구현되며
웹사이트에 나온다.
주로 html 태그 내의 유효성 검사시에 사용한다.(로그인 등)
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>01_Basic\Ex01.html</title>
</head>
<body>
<script type="text/javascript">
var a,b,c;
a=10;
b=0.123;
c="banana";
document.write("a: "+a+"<br>");
document.write("b: "+b+"<br>");
document.write("c: "+c+"<br>");
</script>
</body>
</html>
프롬프트
자바 스크립트 내에 있는 메소드로 입력을 받을 수 있다.
확인 클릭 : 입력한 값이 변수에 들어온다.
취소 클릭 : null이 변수에 들어온다.
<script type="text/javascript">
var myName = prompt("이름을 입력하세요");
document.write("나의 이름은 " +myName+"입니다. <br>");
</script>
자바 주석 : // 또는 /* */
오라클 주석 : --
HTML 주석 : <!-- -->
CSS 주석 : /* */
JavaScript 주석 : // 또는 /* */
confirm()
확인/취소만 선택 가능하고 불리언 타입으로 리턴한다.
<script type="text/javascript">
var result= confirm("게임 한판 할까요?");
document.write("result :" + result+"<br>");
var answer =result ? "좋아요" : "다음에 합시다."; //삼항 연산자
document.write("answer :"+answer+"<br>");
</script>
대화상자 : alert(),confirm(),prompt()
alert()
경고창의 형태로 띄워지며 어떠한 입력도 받을 수 없고 확인만 클릭가능하다.
Function :함수 자바의 메소드와 같은 역할을 한다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
alert("자바스크립스 너무 재미있음");
function summer(check){ //summer 함수 정의 check=true or false
if(check==true){
alert("여름은 더운 계절입니다.");
}
else {
alert("여름은 시원한 계절입니다.")
}
}
</script>
</head>
<body>
<h2>여름은 더운 계절입니까?</h2>
<form>
<input type="button" value="예" onClick="summer(true)">
<input type="button" value="아니오" onClick="summer(false)">
</form>
</body>
</html>
여기서 예를 클릭하면 true를 입력해서 여름은 더운 계절입니다. 라는 문장을 alret로 리턴한다.
전역 변수와 지역 변수
전역 변수는 굳이 var를 안붙여줘도 된다.
지역 변수를 새로 만들고 싶다면 꼭 var를 써줘야한다.
<script type="text/javascript">
var age=30; //전역 변수
document.write("나이1:" +age+"<br>");
function test() { //정의
var age=50; //지역 변수
document.write("나이2:" +age+"<br>");
}
test(); //호출
document.write("나이10:" +age+"<br>");
</script>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
var su= prompt("정수를 입력하세요.",10);
document.write(su+3+"<br>");
document.write(Number(su)+3+"<br>");
document.write(parseInt(su)+3+"<br>");
document.write(eval(su)+3+"<br>");
document.write(+su+3+"<br>");
document.write(Number("15+3*4")+"<br>"); //NaN: Not a Number
document.write(parseInt("15+3*4")+"<br>"); //기호가 나오기 전 숫자까지
document.write(eval("15+3*4")+"<br>");
</script>
</head>
<body>
</body>
</html>
ImplicitOBj :내장 객체
'Develop > JavaScript JQuery JSP' 카테고리의 다른 글
0704 이중배열 (0) | 2022.07.04 |
---|---|
0630 배열 (0) | 2022.07.04 |
0630 for문을 통해 구구단 테이블 만들기 (0) | 2022.07.04 |
0630 프롬프트로 입력받아 성적 구하기 (0) | 2022.07.04 |
0704 JavaScript 정리 (0) | 2022.07.04 |