＊ 객체 기반 언어
＊ 모든 브라우저 지원
＊ 클래스 생성 불가 - 만들어진 클래스를 사용, prototype
＊ 가변 데이터형 - 값을 입력할 때 데이터형 결정
＊ 에러 발생
＊ 클라이언트 값의 유효성 검증
＊ Ajax에서 필수
＊ <script>태그로 정의 - <script language = "javascript"> 또는 <script type = "text/javascript">
＊ 클라이언트 컴퓨터가 해석
＊ 스타일 형식 - <style type = "text/css"></style>
＊ 일반적으로 위치는 <head></head>
＊ 자바의 주석기능 사용가능 - //, /* */
1. 변수
1) 선언
var var_name;//var 생략가능
2) 할당
var var_name=value;
3) 사용
- 화면 출력 : document.write(value + value + var + ...);
이전 페이지가 삭제되고 출력하는 경우 발생
- 경고창 출력 : alert(value + value + var + ...);
2. 연산자
자바와 동일
1) 단항연산자
~ : 1의 보수 연산, 2진수로 바꿔서 계산
! : true -> false, false -> true
+ : 형식적 제공
- : 부호바꿈 연산자
++, --
2) 산술연산자
+, -, *, /, %
3) 시프트연산자 - bit밀기
<<, >>, >>>
4) 관계연산자
>, <, >=, <=, ==, !=
이중부호는 소요시간이 길어짐
5) 논리연산자
- 일반논리
&&(AND)
||(OR)
- 비트논리
&(AND) 상위비트가 1이고 하위비트가 1이면 1 반환
|(OR) 상위비트가 0이고 하위비트가 0이면 0 반환
^(XOR) 상위비트, 하위비트 둘 중 하나가 1이면 1반환
6) 삼항연산자(조건연산자)
( ? : )
7) 대입연산자
=(순수대입연산자)
+=, -=, *=, /=, %=(산술대입, 누적합)
<<=, >>=, >>>=(시프트대입연산자)
&=, !=, ^=(비트논리대입연산자)
3. 제어문
1) 조건문
if else, switch case
2) 반복문
for, while, do while
for(var i=0;i<10;i++){/* */}//javascript
for(int i=0;i<10;i++){/* */}//java
3) 분기문
break, continue, return
4. 배열
선언하면서 값 입력이 가능
csv data를 만들고 사용하는 쪽이 편리
5. 함수(function) - 메소드와 비슷
행동을 미리 정의해두고 필요한 시점에 호출해서 사용 - 직접 호출 가능
1) 정의
function function_name(arg){/* body*/}
2) 호출 - html body 호출 : 사용자의 동작에 의해서 호출된다.
function_name();
| 사용자 동작 |
속성 |
사용 태그 |
| body 태그 로드 |
onLoad |
<body onLoad="f_name()"> |
| click |
onClick |
all tag |
| double click |
ondblClick |
all tag |
| 키가 눌릴 때 |
onKeyDown |
포커스를 가지는 컨트롤 |
| 키가 올라올 때 |
onKeyUp |
포커스를 가지는 컨트롤 |
| 마우스가 들어올 때 |
onMouseOver |
all tag |
| 마우스가 나갈 때 |
onMouseOut |
all tag |
| 값 변경 |
onChange |
<select onChange="f_name()"> |
| 포커스를 잃었을 때 |
onBlur |
포커스를 가지는 컨트롤 |
6. 값 얻기
조건
- form 태그가 반드시 존재
- control의 이름이 존재
<form name="form_name">
<input type="input_type" name="control_name">
함수에서 컨트롤을 호출할 때 경로를 지정할 때 필요하다.
function getName(){
// var name=window.document.frm.name.value;
// var name=document.frm.name.value;
var name=frm.name.value;
alert("name : "+name);
}
<body>
<input type="text" value="name">
<input type="button" value="send" onclick="getName()">
