Web Publisher
- 영역: HTML4, JavaScript, HTML5, CSS3, Ajax, jQuery
1. API
http://www.w3schools.com/jsref/default.asp
2. 전역 함수
http://www.w3schools.com/jsref/jsref_obj_global.asp
javascript
- 1995년 Netscape의 브랜단 아이히에 의해 개발, 후에 LiveScript로 변경되었으며 최종적으로 JavaScript로 지정되었다.
- HTML과 Server Script(JSP)사이에서 접속자의 마우스 클릭, 키보드 입력등 이벤트 처리를 주로 담당합니다.
- Client Layer(HTML)과 Server Script(JSP) 사이에서 HTML에서 발생한 이벤트를 처리 및 JSP 페이지로 이벤트에 따라서 발생한 데이터를 전달하는 역활을 합니다.
HTML + CSS <---> Javascript <---> JSP
출력 동작/이벤트 데이터베이스 접속 처리(Oracle, MySQL...)
- Javascript는 Ajax통신을 이용하여 서버와 태그단위로(JSP는 페이지단위 통신, 페이지단위 이동) 비동기 통신이
가능하며, ->jsp는 페이지를 통째로 불러오는데 얘는 그럴 필요 없이 데이터만 처리 가능
jQuery로 Framework화되어 발전, Mobile jQuery로 발전 (요즘은 jQuery로 PC, Mobile용을 전부 사용하는 추세).
- WebGL와 연동하여 Web상에서 3D가 가능하도록 발전.
- javascript 코드는 Chrome(V8 엔진, 가장 고속), IE, FF등의 브러우저가 처리함.
- 웹상에서의 에러는 f12버튼을 눌러서 콘솔을 확인해 보면 된다
1. 자바스크립트의 선언
<script type="text/javascript”language="javscript"></script>
<script language='javascript'> </script>
<script language="Javascript" src="../test.js"></script>
- 다른 도메인의 스크립트는 보안 제약으로 참조할 수 없다.
현재 http://www.abc.com 이면 아래의 선언은 사용 불가능
<script language="Javascript" src="http://www.domain.com/test.js"></script>
2. 변수의 선언
- 변수에 할당되는 데이터에 따라 동적으로 타입이 할당됩니다. 자바는 타입이 철저 구분.
- 변수 선언시 int등의 데이터 타입을 선언하지 않습니다.
- var를 이용하여 선언합니다.
var str = "message string";
- var를 사용하지 않고 선언된 모든 변수는 전역변수, 함수안에서 선언해도전역변수로 바뀜 (권장 아님)
1. 내부에서 사용되는 Data Type
- 자바스크립트의 데이터타입은 프로그래밍 언어와 달리 하나의 타입에 여러가지의 데이터형을 저장할 수 있습니다.
- 개발자가 선언은 하지 않으며 자동으로 선언되고 변경됨
1) number: 정수, 실수, 숫자 0으로 시작하는 8진수, 0x로 시작하는 16진수등을 저장할 수 있는 복합적인 데이터 타입입니다.
2) string: "" 또는 ''를 이용해서 문자열을 표현합니다.
3) boolean: true, false를 값으로 가지며, 0, null, undefined는 false로 해석되고 그 외의 값은 true로 해석됩니다.
4) null: 데이터의 형식이 알려지지 않았거나 데이터가 없음을 나타내는데 사용합니다.
5) undefined: 변수를 선언후 데이터를 할당하지 않은 경우 갖는 값입니다.
2. 명시적 변수의 선언(권장)
- var를 사용합니다.
- 사용은 편리하나 복잡한 값 추적이 어려움.
- Eclipse Setting
type: Dynamic Web Project
name: js_test
>>>>> /js_test/WebContent/core/js01.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style type="text/css">
*{
font-family: gulim;
font-size: 22px;
}
</style>
</head>
<body>
<H2>var을 이용한 변수의 선언</H2>
<HR>
<script type="text/javascript">
// 문자열 표현: single quotation, double quotation 모두 사용
var month = 8;
document.write('지금은 ' + month + ' 월 입니다.');
document.write(' --> ' + typeof(month)); -> ( )의 자료형을 찾아온다.
document.write('<br><br>');
month = "August";
document.write('지금은 ' + month + ' 월 입니다.');
document.write(' --> ' + typeof(month));
document.write('<br><br>');
month = 0.6;
document.write('1년을 1 기준으로 ' + month + ' 이 지나갔습니다.');
document.write(' --> ' + typeof(month));
</script>
</body>
</html>
3. 지역 변수와 전역 변수의 차이
- 전역변수는 블럭간에도 참조가 가능합니다. (자바도 동일, 필드)
- 모든 변수는 var 선언을 절대적으로 권장 합니다.
>>>>> /js_test/WebContent/core/js02.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style type="text/css">
*{
font-family: gulim;
font-size: 22px;
}
</style>
</head>
<body>
<H2> 전역 변수와 지역 변수</H2>
<HR>
<script type="text/javascript">
var global = "전역 변수";
// 리턴 타입을 명시하지 않음
function test(){
local = "지역 변수"; // var을 생략해도 에러는 안남.
var local2 = "진짜 지역 변수";
}
</script>
<script type="text/javascript">
function print(){
document.write('global: ' + global);
document.write('<br>');
document.write('local : ' + local); // 호출 가능!
document.write('<br>');
document.write('local2: ' + local2); // 호출 불가능..안나옴
}
</script>
<script type="text/javascript">
test();
print();
</script>
</body>
</html>
4. 전역 함수를 이용한 형변환
<script type="text/javascript">
var no1 = '1000';
var no2 = '2000'; //''안쓰면 숫자가 됨
document.write('1. ' + (no1 + no2));
document.write("<br><br>");
document.write('2. ' + (parseInt(no1) + parseInt(no2)));
document.write("<br><br>");
var no3 = '0.25';
document.write('3. ' + (1000 * parseFloat(no3)));
</script>
[03] Operator(연산자)
자바에서는 정수/정수가 정수이지만 그 외 요즘 나오는 언어들(자바스크립트 포함)은 ㄷ ㅏ실수로 나온다.
pl("나누기: " + (i / j)); // 정수/정수=실수 (*)
