JavaScript 키워드 정리

• 개체(Object) : 개체라는 말은 상당히 추상적이다. 이 개념을 알려면 "객체지향"을 공부해야 한다. 이 과에서 의미한 개체는 HTML 문서, 브라우저 윈도우, 날짜/시간과 같은 것을 의미하며 일반적으로 개체는 그 개체가 할 수 있는 일을 정의한 메소드와 그 개체의 특징을 나타내는 속성으로 구성된다.
  • date : date는 시스템의 날짜와 시간을 얻기 위한 개체이다. 이 개체를 생성하는 방법은 다음과 같다 :

Nameofobject = new Date();

• document : 이것은 해당 자바스크립트를 포함하고 있는 HTML 문서를 참조할 수 있는 개체를 의미한다.
• history : history는 사용자가 방문했던 페이지를 기억하고 있는 개체이다. history 리스트의 크기는 특정 서핑 세션동안 사용자가 얼마나 많은 페이지를 방문했는지에 따라 틀릴 수 있다.
• location : location은 특정 URL을 지칭하는 개체이다. 다음과 같은 형식으로 사용된다:

 

parent.location='index.html'
(location이란 속성도 있는데 사용법이 서로 틀리다는 것을 기억하기 바란다.)

• navigator : navigator는 사용자의 브라우저를 지칭하는 개체이다. 이 개체를 통해 사용자 브라우저에 대한 간략한 정보를 얻을 수  있다.
• window : window는 브라우저 화면을 참조할 수 있는 개체이다.

• 메소드(Method) : 메소드는 어떤 개체로 하여금 어떻게 행동할지를 알려주는 하나의 명령을 의미한다.
  • alert() : alert는 window 개체 또는 하이퍼텍스트 링크내에서 대화 상자를 만들기 위해 사용되는 메소드이다. alert문의 괄호 안에 있는 텍스트를 대화 상자에 보여주고 OK 버튼이 함께 제공되며 사용자가 계속 진행하기 위해서는 이 버튼을 눌러야만 한다.
  • charAt() : (문자열 변수).charAt(i)를 하면 (문자열 변수)의 i번째 있는 값을 반환해 주는 메소드이다. 이 때 주의할 것은 i는 0부터 시작된다는 것이다. 예를 들어, zip이란 변수에 "123-456" 값이 들어 있다면 zip.charAt(0)은 "1"이고, zip.charAt(3)은 "-"이다.
  • clearTimeout() : Window 개체의 메소드로 실행되고 있는 setTimeout() 설정을 해제시켜준다.
  • close() : close는 window 개체의 메소드로 현재 브라우저 윈도우를 닫는다.
  • confirm() : confirm은 "확인"과 "취소" 버튼이 있는 대화 상자를 사용자에게 보여주는 메소드이다. 이 메소드는 대개 if...else문에서 주로 사용된다.
  • getMonth() : Date 개체의 메소드로 현재 월을 0~11 사이의 숫자로 반환한다.
  • getDate() : Date 개체의 메소드로 현재 날짜를 1~31 사이의 숫자로 반환한다.
  • getYear() : Date 개체의 메소드로 현재 연도를 0~99 사이의 숫자로 반환한다. (인터넷 익스플로러 5 이상에서는 4자리 숫자를 반환한다)
  • getFullYear() : Date 개체의 메소드로 현재 연도를 네자리 숫자로 반환한다. (넷스케이프 4.0 이상, 인터넷 익스플로러 3.x 이상에서 사용할 수 있다)
  • getDay() : Date 개체의 메소드로 현재 요일을 1~7 사이의 숫자로 반환한다.
  • getHours() : Date 개체의 메소드로 현재 시간을 0~23 사이의 숫자로 반환한다.
  • getMinutes() : Date 개체의 메소드로 현재 분을 0~59 사이의 숫자로 반환한다.
  • getSeconds() : Date 개체의 메소드로 현재 시간을 0~59 사이의 숫자로 반환한다.
  • indexOf() : (문자열 변수).indexOf(strVal)를 하면 (문자열 변수)에서 strVal이란 값을 찾아 그 값의 위치를 반환해 주는 메소드이다. 물론 그 위치는 0부터 시작된다. 예를 들어, zip이란 변수에 "123-456" 값이 들어 있다면 zip.indexOf("-")은 3을 반환한다.
  • open() : open은 window 개체의 메소드로 새로운 문서 또는 새로운 윈도우를 열어 준다.
  • prompt() : Prompt는 사용자가 데이터를 입력할 수 있도록 팝업 상자를 보여 주는 메소드이다. 사용자가 입력한 데이터를 활용하기 위해 prompt는 항상 그 결과 값을 변수에 담게 된다.
  • setTimeout() : Window 개체의 메소드로 타이머를 설정하고 일정 시간이 경과한 후 특정 명령 또는 함수를 실행시켜준다. setTimeout은 두 개의 인자를 취한다. 첫 번째는 일정 시간이 지나고 실행될 명령이나 함수를 문자열로 넘겨주는 것이고, 두 번째는 특정 명령을 실행 시킬 시간 주기를 밀리 초(mili seconds) 단위로 넘겨주는 것이다.
  • Write() : Write 메소드는 Document 개체가 웹 페이지 상에 텍스트를 표시할 수 있도록 해주는 메소드이다.

• 반복(Loop) : 기본적으로 두 가지의 반복문이 있다. 하나는 "for"문이고 또 하나는 "while"문이다. for문은 일반적으로 반복 횟수를 알고 있을 때 사용하고, while 문은 반복 횟수를 알지 못할 때 사용한다.
  • for : 반복문이 몇 번 반복되어야 할지를 구체적으로 명시할 수 있는 명령어이다.
    
  • while : 반복문이 몇 번 반복되어야 할지를 구체적으로 명시할 수 없을 때 사용하는 명령어이다.
• 배열(Array) : 일반적으로 변수는 한 번에 하나의 값만 저장할 수 있다. 하지만 때에 따라 여러 값을 가지고 있는 변수들의 집합을 이용해야할 때가 있다. 배열은 각각의 값을 가진 여러 변수들의 집합체라고 보면 된다.
• 변수(Variable) : 변수는 데이터를 담을 수 있는 저장 공간이다. 상수(constant)는 값이 변할 수 없지만 변수는 그 안에 저장된 데이터 값이 바뀔 수 있다. 변수를 사용하면 여러 라인의 코드 결과를 한 단어의 변수로 표현할 수 있다. 예를  들어, document.write("오늘은 " + objDate.getYear() + "년 " + objDate.getMonth() + "월 " + objDate.getDate() + "일입니다.")라는 것을 웹 페이지 내에서 10번 이상 반복해서 작성해야 한다면 정말 번거로울 것이다. 이 때 "오늘은 " + objDate.getYear() + "년 " + objDate.getMonth() + "월 " + objDate.getDate() + "일입니다." 부분을 변수로 저장해 놓고 사용하면 훨씬 간편해 진다. 즉, strToday = "오늘은 " + objDate.getYear() + "년 " + objDate.getMonth() + "월 " + objDate.getDate() + "일입니다." 와 같은 형식으로 사용한다는 것이다.
• 전역 변수(Global Variable) : 자바스크립트에서 전역 변수는 함수의 외부에 선언된 변수를 의미한다. 이 전역 변수는 어디서든 참조할 수가 있다. 만일 어떤 변수를 함수 내부에서 선언했다면 그 변수는 그 함수 내부에서만 사용할 수 있다.
• 속성(Properties) : 속성은 개체의 한 특징 또는 그 개체의 일부를 의미한다. 예를 들어 브라우저 윈도우의 상태 표시줄은 window 개체의 속성이며 windows.status로 참조된다. (표시형식 : 개체이름.속성이름)
  
• alinkColor : alinkColor는 document 개체의 속성이다. 이 alinkColor(active Link Color)속성은 하이퍼텍스트 링크가 활성화될 때 또는 클릭되는 순간의 색상을 나타내는 속성이다.
• appCodeName : appCodeName는 navigator 개체의 속성이다. 이 속성은 브라우저 제조사에 의해 사용된 브라우저 코드 네임을 의미한다.
• appName : appName은 navigator 개체의 속성이다. 이 속성은 Netscape 또는 Explorer와 같은 브라우저의 이름을 의미한다.
• appVersion : appVersion은 navigator 개체의 속성이다. 이 속성은 브라우저의 플랫폼과 버전을 의미한다.
• bgColor : bgColor는 document 개체의 속성으로 HTML 문서의 배경색을 의미한다.
• defaultStatus : defaultStatus는 window 개체의 속성으로 window.status와 마찬가지로 브라우저의 상태표시줄을 의미한다. window.status는 HTML 태그의 이벤트 핸들러와 밀접하게 사용된다면 defaultStatus는 HTML 태그 밖에서 사용하게 된다. 최신 브라우저에서는 큰 차이점 없이 사용할 수 있기도 하다.
• fgColor : fgColor는 document 개체의 속성으로 전경색 또는 텍스트 색상을 의미한다.
• host : host는 location 개체의 속성이다. 이 속성은 텍스트 형식 또는 IP 번호 형식으로 호스트의 URL을 알려 준다. hostname 속성과의 차이점은 포트(port) 정보까지 알려준다는데 있다. 만일 어떤 페이지의 주소가 "http://korea.internet.com/channel/content.asp?nid=12804"라면 이 페이지의 호스트는 korea.internet.com이 된다(포트가 있다면 포트 정보까지 나타난다). 만일 포트가 null이거나 서버에게 있어서 포트가 중요하지 않다면 hostname과 동일한 결과를 제공한다.
• hostname : hostname은 location 개체의 속성이다. 이 속성은 포트(port) 정보가 없다는 것을 빼고는 host 속성과 동일하다.
• lastModified : lastModified 속성은 document 개체의 속성이다. 이 속성은 해당 웹 페이지가 마지막으로 서버에 업데이드된 날짜/시간 또는 마지막으로 디스크에 저장된 날짜/시간을 알려 준다.
• length : length 는 history 개체의 속성이다. 이 속성은 브라우저의 history 파일에 있는 페이지 리스트 갯수를 알려 준다. 즉, 사용자가 현재 페이지를 방문하기 전에 방문했던 페이지들의 리스트 갯수이다.
• linkColor : linkColor는 document 개체의 속성이다. 이 속성은 하이퍼텍스트 링크의 색상을 의미한다.
• location : location은 document 개체의 속성이다. 이 속성은 웹 페이지의 URL을 의미한다. location이란 개체도 존재하는데 작동하는 방식이 다르다는데 주의해야 한다.
• name : name은 개체에 붙여준 이름 속성이다. 예를 들어 <IMG> 태그에 name 속성을 부여했다면 문서 내에서 이 이미지를 참조하고 싶을 때에는 name 속성에 부여한 이름을 참조하면 된다. 즉, <IMG src="aaa.gif name="pic1">이라고 했다면 이 이미지에 대한 접근은 document.pic1로 할 수 있다는 것이다.
• parent : parent는 특별히 프레임과 함께 자주 사용되는 속성으로 특정 프레임을 가리킬 때 사용된다. 만일 프레임 밖에서 사용된다면 브라우저 전체 윈도우를 가리키게 된다.
• referrer : referrer는 document 개체의 속성이다. 사용자가 어떤 페이지에서 현재 페이지로 왔는지를 알려주는 속성으로 바로 전 페이지의 URL을 알려 준다.
• self : self는 현재 윈도우를 의미하는 속성이다.
• status : status는 window 개체의 속성으로 브라우저 화면의 왼쪽 하단에 위치한 상태 표시줄을 의미한다.
• target : HREF 텍스트 링크와 함께 사용되며 링크로 걸린 사이트가 어떤 윈도우에 나타나야 할지를 표시해주는 속성이다.
• title : title은 document 개체의 속성이다. 이 속성은 HTML 문서에서 <TITLE>과 </TITLE>태그 사이에 위치한 텍스트를 알려 준다.
• userAgent : userAgent는 navigator 개체의 속성이다. 이 속성은 웹 서버에게 필요한 HTTP 헤더 정보를 알려 준다.
• value : Value는 특정 시점에 어떤 내용이 들어있을 수도 있고 아닐 수도 있는 값 속성으로 생각하면 된다. 예를 들어, 체크박스(checkbox)는 사용자의 클릭에 따라 "on" 또는 "off" 값을 가질 것이다. 텍스트 필드의 경우 사용자가 입력한 값이 있을 수도 있고 없을 수도 있다. 만일 텍스트 필드에 있는 내용을 사용자에게 보이고 싶지 않다면 그 값을 "hidden"으로 할 수도 있다. 여기서 강조하는 것은 폼 개체의 특정 필드에 대한 값을 참조할 때는 Value 속성을 사용해야 한다는 것이다. 이 Value 속성이 중요한 것은 다른 곳에서도 이 값을 사용할 수 있기 때문이다.
• vlinkColor : vlinkColor(visited Link Color)는 document 개체의 속성이다. 이 속성은 사용자가 방문했던 링크에 대한 하이퍼텍스트 링크 색상을 의미한다.

• 에러(Error) : 에러 또는 오류 메시지 창은 스크립트 안에 뭔가 문제가 있을 경우 발생한다. 크게 두 가지 종류가 있는데 구문(Syntax) 오류와 런타임(RunTIme) 오류이다.
• 구문 오류(Syntax Error) : 스크립트 안에 잘못된 철자가 있거나 컴퓨터가 인식하기 어려운 텍스트가 있을 경우, 자바스크립트 문법에 어긋난 경우 발생한다.
• 런타임 오류(Run-Time Error) : 런타임 오류는 잘못된 자바스크립트 명령어를 사용했을 때 발생한다.

• 이벤트 핸들러(Event Handlers) : 이벤트 핸들러는 HTML 코드에 내장되는 자바스크립트 명령어다. 사용자와 웹 페이지 사이의 상호 작용을 위해 HTML 코드와 함께 사용된다.
• onBlur : onBlur는 사용자가 select, text, textarea 폼 요소에 있다가 그 요소에서 벗어나게 될 때 발생하는 이벤트 핸들러이다. 즉, 사용자가 그 아이템에 대한 포커스를 잃을 때 발생한다.
• onChange : onChange는 사용자가 select, text, textarea 폼 요소에 있는 텍스트를 변경한 후 그 요소를 떠날 때 발생하게 된다.
• onClick : onClick은 사용자가 링크와 같은 오브젝트를 클릭할 때 발생한다.
• onFocus : onFocus는 사용자가 select, text, textarea 폼 요소를 선택할 때 발생한다. 즉 사용자가 그 폼 요소에 포커스를 맞출 때 발생한다.
• onLoad : onLoad는 웹 페이지가 열릴 때 발생하는 이벤트로 HTML의 BODY 태그 안에서 사용된다.
• onMouseOut : onMouseOut은 사용자가 마우스를 링크 위에 올려 놓았다가 떼는 순간에 발생하는 이벤트 핸들러이다.
• onMouseOver : onMouseOver는 사용자가 링크 위에 마우스를 올려 놓았을 때 발생하는 이벤트 핸들러이다.
• onSelect : onSelect는 사용자가 text, textarea 폼 요소에 있는 텍스트의 일부 또는 전체를 선택할 때 발생한다.
• onSubmit : onSubmit은 submit 버튼 폼 요소를 사용자가 틀릭할 때 발생한다.
• onUnLoad : onUnload는 사용자가 웹 페이지를 떠날 때 발생하는 이벤트로 HTML의 BODY 태그 안에서 사용된다.

• 조건(Condition) : 조건은 IF 문과 함께 발견된다. 조건은 IF문 바로 다음에 나오는 괄호 안에 있는 내용을 일컫는다. IF 문에 있는 조건이 참일 때 IF 문에 있는 내용이 실행되고 거직일 때 ELSE문에 있는 내용이 실행된다.
• 주석(Comment) : 주석은 더블 슬래쉬(//)로 표시한다. 주석 처리하고 싶은 텍스트의 왼쪽 옆에 "//" 표시를 해주면 된다. "//"는 // 표시의 오른 쪽에 있는 라인 전체를 주석 처리하는 것이다. 만일 주석 처리하고 싶은 줄이 여러 줄이라면 // 대신 시작을 "/*"로 끝을 "*/"로 막아 주면 된다. 즉, /*와 */ 사이에 있는 모든 내용이 주석 처리 된다는 것이다.
• 컴마(comma : ",") : 자바스크립트 이벤트 핸들러를 동시에 여러 개 사용하고자 할 때 컴마(,)를 사용한다.
• 특성(Features) : 특성(Features)은 자바스크립트 명령어의 어떤 속성들을 나타낸다. 가장 흔한 예는, 툴바(toolbar), 메뉴바(menubar), 스크롤바(scrollbars) 등의 특성들인데 , 이 특성들을 통해 새로운 윈도우의 모양, 크기 등을 조절할 수 있다.
• config : config는 window.open() 메소드에서 사용되는 명령어로 이 다음에 새로 열릴 창의 특성들을 적어주면 된다.
• directories : 연결 표시줄 유무를 결정하는 특성으로 가질 수 있는 값은 "yes" 또는 "no"이다.
• height : 새로운 윈도우 또는 이미지의 높이를 픽셀로 표시한다.
• location : 주소 표시줄 유무를 결정하는 특성으로 가질 수 있는 값은 "yes" 또는 "no"이다.
• menubar : 메뉴바 유무를 결정하는 특성으로 가질 수 있는 값은 "yes" 또는 "no"이다.
• resizable : 사용자가 윈도우의 크기를 조절할 수 있는지의 유무를 결정하는 특성으로 가질 수 있는 값은 "yes" 또는 "no"이다.
• scrollbars : 스크롤바 표시 유무를 결정하는 특성으로 가질 수 있는 값은 "yes" 또는 "no"이다.
• status : 상태 표시줄 유무를 결정하는 특성으로 가질 수 있는 값은 "yes" 또는 "no"이다.
• toolbar : 표준 단추(툴바) 표시 유무를 결정하는 특성으로 가질 수 있는 값은 "yes" 또는 "no"이다.
• width : 새로운 윈도우 또는 이미지의 폭을 픽셀로 표시한다.

• 파라미터(parameter) : 함수의 입력 값을 의미하며 인자(아규먼트, argument) 또는 매개변수라고도 한다. 가령, function newcolor(color)라는 함수가 있을 때 color를 파라미터라고 부른다. 파라미터의 갯수는 원하는 대로 정의할 수 있다. 단, 그 갯수만큼 함수를 호출하는 쪽에서 그에 대응하는 실제 값을 넣어줘야 한다.
• 함수(function) : 함수는 일련의 명령어들을 조합하여 원하는 역할, 기능을 담당하게 하는 것이다. 계속해서 반복되는 작업들을 함수로 만들어 놓음으로써 그런 기능이 필요할 때마다 여러 줄의 명령어들을 다시 작성하는 것이 아니라 함수를 한 번만 호출하여 원하는 결과를 얻을 수 있다.
• eval() : eval()이란 함수는 텍스트를 숫자로 변경할 때 사용한다. prompt를 통해 사용자로부터 숫자를 입력받았을 때 그것은 문자로 인식될 수 있다. 이 때 eval()을 통해 확실히 숫자로 인식되도록 할 수 있다.
• if...else 문 : If와 else는 사용자의 선택에 따라 서로 다른 행동을 할 수 있도록 한 조건문이다. if문은 조건 값이 참(true) 또는 예(yes)일 때 반응하고, else는 조건 값이 거짓(false) 또는 아니오(no)일 때 반응한다.