프로젝트 하면서 javascript를 썼는데, 기초 내용도 탄탄히 안다지고 무작정 이렇게 쓰면 되는구나~ 하고 썼던 것 같아
기초 내용을 정리해두려한다. 틈틈히 몰랐던 내용 정리해놔야지~~
1. JavaScript 기초
1.1 DTD 선언
- HTML5 버전에 들어서면서 DTD 선언문이 간략화 되었다.
* 기존(XHTML1.0) : <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional //EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
* 현재(HTML5) : <!DOCTYPE html>
- DTD 선언은 HTML 페이지의 가장 첫 라인에 명시되어야 한다. 웹 브라우저가 HTML의 버전을 인식하고 HTML 태그나 CSS를 해당 버전에
맞도록 처리하기 때문. DTD 선언문은 웹 표준 준수를 위하여 반드시 명시되어야 한다!
1.2 파일 인코딩 형식
- HTML5 버전에 들어서면서 파일 인코딩 지정 방식도 간략화 되었다.
* 기존(XHTML1.0) : <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
* 현재(HTML5) : <meta charset="utf-8" />
** 인코딩(Encoding): 어떤 파일이 저장되는 방식. 한국어 처리를 위한 "euc-kr", 다국어 처리를 위한 "utf-8" 이 있다.
ajax에서는 "euc-kr" 형식을 지원하지 않기 때문에 최근 웹 페이지 제작은 대부분 "uft-8"을 사용한다.
1.3 HTML 페이지 내 Javascript 코드 포함
- Javascript 블록은 <script> 태그로 정의되며 구문의 종류를 의미하는 type = "text/javascript" 속성이 함께 명시된다.
- HTML 코드 안에 javascript 포함시키는 다른 방법은, javascript 명령문을 js 파일에 별도로 작성해 두고, HTML이 이 js 파일 내용을
참조하도록 설정해주는 것.
--> javascript 구문을 외부 js 파일 형태로 작성하게 되면 하나의 js 파일을 여러 HTML에서 참조 할 수 있기 때문에 javascript를 재사용
할 수 있다는 이점이 있다.
<script type="text/javascript" src="js 파일경로"></script> |
** html 코드 다음에 javascript 블록을 넣어주는 것 을 권장한다. 페이지 로딩 시, 위에서부터 소스코드를 읽어들이는데, 이때 자바스크립트에
오류 코드가 있으면 html 소스를 읽기 전에 에러가 떠, 화면 로딩 조차 되지 않기 때문이다. 화면은 기본으로 띄워주고 자바스크립트에 오류가 있을 경우 오류 메세지를 띄워주는게 낫겠죠 ㅎㅎ
1.4 Javascript 주석
- 한 줄 주석: //
- 여러 줄 주석: /* */
1.5 console 사용
- console.log("출력내용");
** 결과 확인은 브라우저의 확인 대화상자 호출(alert())
1.6 변수 데이터 타입 종류
Number |
숫자 표현. 산술 연산에 사용 |
String |
문자열 표현. |
Boolean |
true / false |
Object |
객체 저장 하기 위한 데이터 타입. 브라우저 제어 기능, form 제어 기능, html 태그 요소에 대한 제어가 가능하다 |
Null |
|
undefined |
변수만 선언되고 아무런 값도 할당되지 않은 상태. |
** Javascript 에서는 일반적인 프로그래밍언어와 달리 변수 선언할 때는 변수 존재 여부와 범위 만 결정되고, 변수의 자료형은 값을 할당 할 때 자동으로 결정된다! |
|
__________________________________________________________________________________________________________________________________________________________
** 본 포스팅에 대해 수정해야할 부분이나 추가 의견 등이 있으신 분들은 댓글 달아주세요. 언제나 환영입니다 :)
** 본 포스팅은 아래의 reference 들을 참고하여 내용을 덧붙인 글입니다. 혹시, 문제가 되는 경우 알려주시면 조치하도록 하겠습니다.
** 본 포스팅을 reference 자료로 참고하실 분들은 출처를 꼭 밝혀주시기 바랍니다.
- 책: [Javascript, jQuery, Ajax 완벽가이드], 저자: 주영아 이광호, 출판사: Interpress
'UX' 카테고리의 다른 글
| [WebSquare5] 웹스퀘어5 연동 (0) | 2017.04.29 |
|---|---|
| AJAX 통신 기초 (0) | 2017.02.26 |
| jQuery 기초 (0) | 2017.02.26 |
| Javascript 기초2 (0) | 2017.02.26 |
| [Error] maven 프로젝트 checkout 후 JSP 파일 에러 (0) | 2017.01.29 |