자바스크립트 기초정리에요!
기초0) charset='UTF-8'
왠만하면 UTF-8로 설정하는게 나중을 위해서 더 폭넓은 선택이라고 합니다.!!
기초1)
대소문자 구분o : java, java script, servelt(class와 같습니다.)
대소문자 구분x : sql, html, jsp(html과 같습니다.)
기초2)
; 세미콜론으로 종료표시를 해야한다.
기초3)
<br>으로 개행처리이다. (자바에서는 \n)
기초4)
<script>태그에서 작성된다.
따라서, <body>에서 기본틀 => <head>에서 속성적용 => <script>에서 동작, 반복, 조건
기초5)
모든 스크립트 변수 var는 무조건 문자열로 받는다.
따라서, 정수표현을 위해서 parseInt(변수명)하고 연산해야합니다.
변수 var는 자료형이 정해지지 않기때문에, 아래와 같이 쓸 수 있습니다.
var k;
k=100;
k3.14;
k='javascript';
기초6) 큰 따옴표 " " 와 작은 따옴표 ' '의 구분이 없다.
기초7) 자바에서는 전역변수가 없지만, 스크립트에는 전역변수가 있다.
따라서, 전역변수, 지역변수를 잘 설정해서 사용해야 한다.
이때,
전역변수란 : 전체에 사용되는 변수입니다. 예를 들면 static변수와 같이 공용으로 사용되는 변수임.
지역변수란 : 함수와 같이 범위안에 있는 변수입니다..
매개변수는 function ABC( 매개변수 ){ }; <== "함수 또는 객체생성시"를 의미함.
파라미터(인자값)은 ABC( 인자 ); <== "함수 호출시"를 의미함.
기초8)
외부 Script는 <script src='myscript.js'></script>와 같이 사용되는데, 따로 페이지를 만들어줘야한다.
=> 이를 외부HTML작성 연결이라 한다.
내부 Script는 <script></script>안에서 작성하는 것을 말한다.
=> 이를 내부HTML작성이라 한다.
=> 그외 inline 방식 자바 스크립트가 있다.
기초13)
※ 필수내용: ajax + json + jquery
※ 선택기술: node.js + angular2.js + ...
기초10 출력문)
여기서부터는 당장에 사용하는 기본 기능들을 미리 정리하겠습니다. 뒤로가면서 중복되는 내용들도 있습니다.
document.write("문자열" 또는 변수명); : 브라우저창에 출력문1.
alert('문자열' 또는 변수명); : 해당 내용의 경고창을 띄우는 출력문2.
console.log('텍스트'); : 개발자도구창을 통한 출력
기초11 조건문)
==는 값만 같아도 T입니다.
===는 값과 참조값 둘다 같아야 T입니다.
※연산순서때문에 괄호가 중요하다.
기초12 입력문)
confrim('문자열' 또는 변수명); : 해당 내용의 예, 아니오의 선택창을 띄운다.(리턴값이 있는)
prompt('문자열'); : 해당 내용의 입력창을 띄운다.
alert('알림문자'); 알림경고창이다. (리턴값이 없는)
- var dap1 = confirm("정말로 가입하시겠습니까?"); //선택창
- var dap2 = alert("가입하셧습니다."); //알림창
- document.write(dap1 + b);
- document.write(dap2 + b);
- 변수선언만 하고 출력하면 undefined,
- 메소드리턴결과값이 없는데 출력하면, undefined
기초13 그외)
삼항연산자 : (연산)?T:F;
typeof : 타입의 자료형을 반환한다.
==> typeof(변수명)
indexOf : 시작값부터 문자열이 있는지 검사해서, 있다면 인덱스값 반환한다.
==> 변수.indexOf('문자열',시작인덱스 위치)
var day1 = new Date(); : 날짜 객체 day1을 생성한다.
==> new Date().__?__ 를 통해서 많은 정보를 불러올 수 있다.
document.getElementById('id값')= 'ABC' : 해당 아이디에 ABC를 넣는다.
document.getElementById('id값').innerHTML ='ABC' : 해당 아이디 태그값의 innerHTML에 ABC를 넣는다.
(그 외에 .value이나 .text와도 같은 것들이 있어요!)
코드(1)
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
|
<head>
<meta charset="UTF-8">
<title> 자바 스크립트 기초 </title>
<!-- src앞에 다른사람 pc의 ip주소를 통해 공유할 수 있다. -->
<script src='myscript.js'></script>
<script>
var t1= new Date();
document.write(t1+"<br>");
//colsole.log(t1); //브라우저 출력
</script>
</head>
<body>
<script>
var t2=new Date();
document.write(t2+"<br>");
</script>
<h1>2018/04/02</h1>
<p> 자바 스크립트는 이벤트에 반응할 수 있습니다</p>
<button type='button' onclick="alert('반갑습니다')"> 버튼을 클릭하세요</button>
</body>
|
더보기
아래와 같이 만들어보고,
자바스크립트로도 시간을 출력해는 문제입니다.
코드(2)
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
|
<body>
<script type="text/javascript">
var i = 100;
document.write(i+"<br>"); /* 100 */
var j;
document.write(j+"<br>"); /* undefined */
/* 오류: 변수값이 없기때문에 undefined */
var x = 'html';
var b = "<br>";
//자료형을 확인가능
document.write(typeof(x)+b); /* String */
x=100;
document.write(typeof(x)+b); /* number */
x=3.14;
document.write(typeof x+b); /* number */
x=true;
document.write(typeof x + b); /* boolean */
x=function(){}
document.write(typeof x + b); /* function */
x=new Array();
document.write(typeof x + b); /* object */
//정수<==정수+정수이고, 연산 시 괄호 필수 (두 개 이상에서)
//java의 String과 같은 메서드를 사용한다
var a=100;
var b=3;
document.write((a/b) + b); /* 36.333333333333336 */
document.write((a>b) + b); /* 4 */
var s= 'oracle ja va script';
document.write(s.length); /* 19 */
document.write(s.charAt()); /* o */
document.write(s.toUpperCase()); /* ORACLE JAVA SCRIPT */
document.write(s.indexOf('script', 0),+ b); /* 133 */
document.write(s.charAt(5)+ b); /* e3 */
</script>
</body>
|
'WEB 기초 > Script' 카테고리의 다른 글
| 6. 배열 (0) | 2018.04.12 |
|---|---|
| 5. 로그인_창 만들기 (0) | 2018.04.12 |
| 4. 조건문을 이용한 메뉴판 (0) | 2018.04.12 |
| 3. 계산기 만들기 (0) | 2018.04.12 |
| 2. 값의 비교, 입력확인창, 경고창 (0) | 2018.04.12 |