💻 1. 웹개발_Front end/1-4 Javascript

[Javascript] 02-1 자바스크립트 기초 문법

달님🌙 2021. 9. 5. 16:44
반응형

 

자바스크립트 선언문

 

- 선언문 : 자바스크립트 코드를 작성할 영역을 선언하는 것

- 선언문은 <head> 태그 영역 또는 <body> 태그 영역에 선언하면 된다.

 

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>hello javascript</title>
    <script>
        document.write("환영합니다");
    </script>
</head>
<body>
</body>
</html>

 

 

자바스크립트 주석 처리

 

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>hello javascript</title>
</head>
<body>
    <script>
        // 한 줄 설명글인 경우
        
        /*
            여러 줄인 경우 
        */
       
    </script>
    <!-- HTML 소스의 설명글은 이렇게 처리 -->
</body>
</html>

 

 

내부 스크립트 외부로 분리하기 

 

- 장점 1. 소스 찾기가 쉬워지고 소스를 손상시킬 염려가 사라짐

- 장점 2. 외부로 분리함으로써 프로젝트 관리를 원활하게 할 수 있음

 

<외부로 분리된 js 파일>

document.write("환영합니다.");

 

<html파일>

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>hello javascript</title>
    <script src="js/example.js"></script>
</head>
<body>
</body>
</html>

 

 

코드 입력 시 주의 사항

 

1. 대소문자 구분할 것

// 날짜 객체 생성 :

New date(); --> X
new Date(); --> O

 

2. 세미콜론 꼭 쓰기 (되도록 한 줄에 한 문장만 작성할 것)

// javascript에서는 세미콜론 생략가능하다. 하지만 헷갈리지 않도록 항상 써줄것
document.write("Hi") document.write("Bye"); --> X
document.write("Hi"); document.write("Bye"); --> O

 

3. 큰따옴표 vs 작은따옴표

 

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>hello javascript</title>
</head>
<body>
    <script>
         // 큰따옴표, 작은 따옴표 혼용 가능
        document.write("환영합니다.", "<br>");
        document.write('환영합니다.', "<br>");
        
        // 큰따옴표 출력
        // 방법 1. 큰따옴표를 표현하고자 할때는 이렇게 사용
        document.write('"환영합니다." ', "<br>"); 
        // 방법 2. 역슬래시를 문자 앞에 쓰면 해당 문자를 표출하겠다는 의미
        document.write("\"환영합니다.\"", "<br>");
        
        // 작은따옴표 출력
        document.write('\'환영합니다.\'', "<br>");
        document.write("'환영합니다.'", "<br>");
        
        var a = 'a';
        document.write(a, "<br>");
        
        var box;
        box = 100;
        document.write(box, "<br>");
    </script>
</body>
</html>

 

 

 

 

반응형