🎨 Programming/JavaScript

[JavaScript] 1. 자바스크립트 기초 (ECMA6기준)

ryang x2 2020. 8. 28. 19:02
728x90
반응형

자바스크립트(JavaScript)란? 

자바스크립트(JavaScript)는 객체(object) 기반의 스크립트 언어입니다.

HTML로는 웹의 내용을 작성하고, CSS로는 웹을 디자인하며, 자바스크립트로는 웹의 동작을 구현할 수 있습니다.

자바스크립트는 주로 웹 브라우저에서 사용되나, Node.js와 같은 프레임워크를 사용하면 서버 측 프로그래밍에서도 사용할 수 있습니다.

현재 컴퓨터나 스마트폰 등에 포함된 대부분의 웹 브라우저에는 자바스크립트 인터프리터가 내장되어 있습니다.

 

 

● 자바스크립트의 특징 

1. 웹의 동작을 구현하기 위한 언어입니다. 
2. 웹 브라우저에서 작동합니다. -> (단, Node.js 서버에서도 동작 가능) 

3. 웹 브라우저에는 자바스크립트 엔진(인터프리터)가 내장되어 있습니다. 
4. 자바스크립트 문법은 HTML문서 내에서 <script> 태그 사이에 작성합니다. 
5. 대소문자를 구별합니다. 
6. 객체 기반의 스크립트 언어입니다. (JAVA의 객체지향프로그램이 아니다.)

 

 

● 자바스크립트의 출력방법 

1. HTML문서에서 <script> 태그 사이에 document.write() 함수를 사용하여 출력합니다. 
2. console.log() 함수를 사용하여 브라우저 콘솔에 출력합니다. 
<script> 위치는 상관없다. 출력원하는 위치에 써주면 된다.

 

* 자바스크립트의 문자열을 쓸때는 ' ',  " ", ` ` 셋 다 가능

* document 객체이며 body를 뜻함 화면에 출력하는 방식은 스크립트로 사용되지 않는다. 

* console.log()는 사용자 모드가 아닌 개발자 모드에서 확인이 가능하다.

* ECMA5부터 ;(세미콜론)은 생략가능

 

<body>
    <h2>자바스크립트의 출력</h2>
    <script>
        document.write('안녕하세요. JavaScript : body에 출력'); // 화면에 출력 
        console.log('안녕하세요. JavaScript : console에 출력'); // 콘솔에 출력
    </script>
</body>

 

 

 

# 자바스크립트의 주석문 

// : 한 줄 주석 
/* */ : 여러줄 주석 


* 주석은 사용자에게 노출이 되므로 보안상 유의하여 사용해야한다.

/*
            2020-08-28
            자바스크립트의 출력 
*/

 

 

# 외부 자바스크립트 파일로 적용  

사용방법 : <script src="자바스크립트 파일 경로"></script>

* 자바스크립트 파일은 .js 확장자를 사용합니다. 
* 대부분 내부 자바스크립트는 맨 하단에 놓아야 속도가 빠를 수 있다. 또한, 외부 자바스크립트 파일은 웹 브라우저가 미리 읽어 올 수 있어 웹 페이지의 로딩 속도 또한 빨라집니다.

 

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>외부 자바스크립트</title>
    <script src="script.js"></script>
</head>
<body>
    <h2>외부 자바스크립트</h2>
</body>
/*
            2020-08-28
            자바스크립트의 출력 
*/

document.write('안녕하세요. JavaScript : body에 출력'); // 화면에 출력
console.log('안녕하세요. JavaScript : console에 출력'); // 콘솔에 출력

 

 

728x90
반응형