WEB/Javascript

javascript의 기초 문법 정리

sit_min 2019. 1. 5. 16:50

javascript를 배우면서 해놓는 정리

목차

    - javascript를 html에 적용하기

    - 데이터 타입

    - 연산자

    - 조건문

    - 반복문

    - 배열

    - 함수

    - 객체

    - 라이브러리 나열

- javascript를 html에 적용하기

javascript를 HTML에 적용하기 위해서 나누는 방법은 많게는 3가지가 있다.

1. head태그 안에서 <script></script>를 넣고 모든 javascript코드를 다 넣어 사용하는 방법이다..

1
2
3
4
5
6
7
8
9
10
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
<script>
        var examPle="사용하는 ";
        document.write(examPle);
   </script>
</head>
<body>
    
</body>
</html>
cs

2. body 태그 안에 필요한 부분마다 넣어서 사용하는 방법

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
 
<h1>바디태그 안에 넣어서</h1>
    <script>
        var examPle="사용하는 ";
        document.write(examPle);
    </script>    
</body>
 
</html>
cs

3. 다른 파일에서 가지고 오는 방법 

1
2
3
4
5
6
7
8
9
10
11
12
13
<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="파일의 경로, 파일의 기본 경로는 이 HTML파일이 있는 "></script>
</head>
<body>
 
<h1>다른 파일에서 가지고 오기</h1>    
</body>
 
</html>
cs

- 데이터타입

String

Number

Variable

Boolean

Array

Function

Object

- 연산자

 


   
     
     
     
     


 

- 조건문

1
2
3
4
5
if(true){
    document.write("참");
else {
    document.write("거짓");
}
cs

- 반복문

while문

1
2
3
4
5
6
var i = 0;
while(i < 3){
  document.write(String(i)+"번째"+"<br>");
  i = i + 1;
}
cs

for문

1
2
3
4
5
for (var i = 0; i < 3; i++) {
    document.write(String(i)+"번째"+"<br>")
}
 
cs

- 배열

1
2
3
4
5
var example_array=[0,1,2]
for(var i=0;i<example_array.length;i++){
    document.write(String(i)+"번째"+"<br>")
}
 
cs

- 함수

1
2
3
4
5
6
7
8
9
10
11
12
13
function zero_ONE_two1(){
    for(var i = 0;i<3;i++){
        document.write(String(i)+"번째"+"<br>")
    }
}
zero_ONE_two1()
 


function zero_ONE_two2(Num){
    for(var i = 0;i<Num;i++){
        document.write(String(i)+"번째"+"<br>")
    }
}
zero_ONE_two2(3)
cs

- 객체

1
2
3
4
5
6
7
8
9
var example_Object={
    0:"zero",
    1:"one",
    2:"two",
};
for(var i =0;i<Object.keys(example_Object).length;i++){
    document.write(String(Object.keys(example_Object)[i])+"번째"+"<br>");
    document.write(example_Object[i]+"번째"+"<br>");
}
cs

Python에서 dictionary와 매우 비슷한 object

- 라이브러리 나열

Jquery