JavaScript[1] - JavaScript와 EMCAScript
JavaScript 란?
JavaScript는 웹 페이지를 동적으로 만들기 위한 언어
클라이언트 측 웹(브라우저)에서 실행
웹 페이지 동작을 제어
클라이언트?
서버로부터 정보를 받아와 사용자의 컴퓨터에서 실행되는 애플리케이션 또는 프로그램

V8 엔진
대표적인 자바스크립트 엔진으로는 구글 크롬의 V8 엔진
자바스크립트 코드를 빠르게 실행할 수 있도록 최적화되어 있습니다.
자바스크립트 엔진은 코드를 실행하기 전에 먼저 파싱 하여 추상 구문 트리(Abstract Syntax Tree)로
변환한 뒤, 이를 바탕으로 코드를 실행합니다.
추상 구문 트리??
추상 구문 트리
추상 구문 트리는 프로그래밍 언어의 코드를 구성하는 문법 요소들을 추상적인 구조로 나타낸 것 즉, 추상 구문 트리는 코드의 의미를 파악할 수 있는 구조를 제공 JavaScript 엔진은 코드를 실행하기 전에 먼저 추상 구문 트리로 변환한 뒤, 이를 바탕으로 코드를 실 행합니다. 따라서, 추상 구문 트리는 JavaScript 엔진이 코드를 실행하는 데 매우 중요한 역할
Web Browser로 실행하기
- HTML 파일에 포함시키기
<!-- index.html -->
<!DOCTYPE html>
<html lang="en">
<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>Document</title>
</head>
<body>
<script>
console.log('hello, javascript')
</script>
</body>
</html>

2. 외부 JavaScript 파일 사용하기
//index.js
console.log('hello, javascript')
<!-- index.html -->
<!DOCTYPE html>
<html lang="en">
<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>Document</title>
</head>
<body>
</body>
<script src="index.js"></script>
</html>
3. Web Browser에서 바로 입력하기

특별하게 웹 브라우저에서 바로 실행할 수 있는 JavaScript 문법들을 Vanilla JavaScript라고 함
ECMAScript 란?
ECMAScript는 JavaScript의 표준을 제공하는 언어로, 새로운 기능 및 개선 사항을 제공하여 자바스크립트의 기능을 보완하고 업그레이드할 수 있도록 도와줍니다. JavaScript 기본 문법 데이터 타입, 객체 모델, 함수, 연산자 등을 정의
'Front-end > JavaScript' 카테고리의 다른 글
JavaScript[6] - this와 배열 메서드 기초 (0) | 2023.04.20 |
---|---|
JavaScript[5] - 함수와 Arrow Function (0) | 2023.04.20 |
JavaScript[4] - 조건문과 반복문 (0) | 2023.04.20 |
JavaScript[3] - 데이터 타입과 연산자 (0) | 2023.04.20 |
JavaScript[2] - JavaScript 기본 문법과 호이스팅(hoisting) (0) | 2023.04.19 |
JavaScript[1] - JavaScript와 EMCAScript
JavaScript 란?
JavaScript는 웹 페이지를 동적으로 만들기 위한 언어
클라이언트 측 웹(브라우저)에서 실행
웹 페이지 동작을 제어
클라이언트?
서버로부터 정보를 받아와 사용자의 컴퓨터에서 실행되는 애플리케이션 또는 프로그램

V8 엔진
대표적인 자바스크립트 엔진으로는 구글 크롬의 V8 엔진
자바스크립트 코드를 빠르게 실행할 수 있도록 최적화되어 있습니다.
자바스크립트 엔진은 코드를 실행하기 전에 먼저 파싱 하여 추상 구문 트리(Abstract Syntax Tree)로
변환한 뒤, 이를 바탕으로 코드를 실행합니다.
추상 구문 트리??
추상 구문 트리
추상 구문 트리는 프로그래밍 언어의 코드를 구성하는 문법 요소들을 추상적인 구조로 나타낸 것 즉, 추상 구문 트리는 코드의 의미를 파악할 수 있는 구조를 제공 JavaScript 엔진은 코드를 실행하기 전에 먼저 추상 구문 트리로 변환한 뒤, 이를 바탕으로 코드를 실 행합니다. 따라서, 추상 구문 트리는 JavaScript 엔진이 코드를 실행하는 데 매우 중요한 역할
Web Browser로 실행하기
- HTML 파일에 포함시키기
<!-- index.html -->
<!DOCTYPE html>
<html lang="en">
<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>Document</title>
</head>
<body>
<script>
console.log('hello, javascript')
</script>
</body>
</html>

2. 외부 JavaScript 파일 사용하기
//index.js
console.log('hello, javascript')
<!-- index.html -->
<!DOCTYPE html>
<html lang="en">
<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>Document</title>
</head>
<body>
</body>
<script src="index.js"></script>
</html>
3. Web Browser에서 바로 입력하기

특별하게 웹 브라우저에서 바로 실행할 수 있는 JavaScript 문법들을 Vanilla JavaScript라고 함
ECMAScript 란?
ECMAScript는 JavaScript의 표준을 제공하는 언어로, 새로운 기능 및 개선 사항을 제공하여 자바스크립트의 기능을 보완하고 업그레이드할 수 있도록 도와줍니다. JavaScript 기본 문법 데이터 타입, 객체 모델, 함수, 연산자 등을 정의
'Front-end > JavaScript' 카테고리의 다른 글
JavaScript[6] - this와 배열 메서드 기초 (0) | 2023.04.20 |
---|---|
JavaScript[5] - 함수와 Arrow Function (0) | 2023.04.20 |
JavaScript[4] - 조건문과 반복문 (0) | 2023.04.20 |
JavaScript[3] - 데이터 타입과 연산자 (0) | 2023.04.20 |
JavaScript[2] - JavaScript 기본 문법과 호이스팅(hoisting) (0) | 2023.04.19 |