딩굴딩굴고양이

HTML5의 자바스크립트를 활용한 게임엔진

1. Boolean 타입
- Boolean 은 논리적인 요소를 나타내고, true 와 false 의 두 가지 값을 가질 수 있다.

2. Null 타입
- Null 타입은 딱 한 가지 값, null 을 가질 수 있다.

3. Undefined 타입
- 값을 할당하지 않은 변수는 undefined 값을 가진다. 별도로 Object 도 있음

4.Number 타입
- 정수만을 표현하기 위한 특별한 자료형은 없다. 부동 소수점을 표현할 수 있는 것 말고도, Number 타입은 세 가지 의미있는 몇가지 상징적인 값들도 표현할 수 있다. 이 값에는 +무한대, -무한대, and NaN (숫자가 아님)이 있다.

5. String 타입
- 자바스크립트의 String 타입은 텍스트 데이터를 나타내는데 사용한다. 이는 16비트 부호없는 정수 값 요소들의 집합이다. String의 각 요소는 String의 위치를 차지한다. 첫 번째 요소는 0번 인덱스에 있고, 다음 요소는 1번, 그 다음 요소는 2번... 같은 방식이다. String 의 길이는 String이 가지고있는 요소의 갯수이다.
C 같은 언어와는 다르게, 자바스크립트의 문자열은 변경 불가능 (immutable) 하다

6. Symbol 타입
-Symbol은 유일하고 변경 불가능한 (immutable) 기본값 (primitive value) 이다. 또한, 객체 속성의 key 값으로도 사용될 수 있다 (아래를 볼 것). 몇몇 프로그래밍 언어에서는 Symbol을 atom 이라고 부른다

[자바스크립트 엔진 파이프라인]

자바스크립트 엔진들이 소스 코드를 기계어로 만들기까지 공통적으로 수행하는 과정을 살펴봅시다.

먼저, 자신이 작성한 자바스크립트 소스 코드에서부터 시작합니다.

자바스크립트 엔진은 소스 코드를 파싱해서 Abstract Syntax Tree(AST) 로 만듭니다.

그리고 AST를 바탕으로, 인터프리터는 바이트 코드를 생성합니다.
여기까지가 자바스크립트로 작성된 코드를 실제로 엔진이 실행하는 부분입니다.
 
코드를 더 빠르게 실행하기 위해, 바이트코드는 프로파일링 된 데이터와 함께
최적화 컴파일러(optimizing compiler)로 보내집니다. 이곳에서는 프로파일링 데이터를 기반으로 매우 최적화 된 기계어를 생성합니다. 만약 정확하지 않은 결과가 나왔다면 다시 deoptimizes하여 바이트 코드로 되돌립니다.

[인터프리터 / 컴파일러 파이프라인]

인터프리터가 코드를 해석하고, 최적화 할 때 주요 자바스크립트 엔진들
사이에 어떤 차이가 있는지 알아봅시다.
일반적으로는 다음과 같은 공통된 파이프라인을 가집니다.

인터프리터(interpreter)
: 최적화되지 않은 바이트코드(bytecode)를 빠르게 생성합니다.

최적화 컴파일러(optimizing compiler)
: 매우 최적화된 기계어 코드(macine code)를 약간 시간을 들여서 생성합니다.

이 과정에서 바이트코드는 중간 언어(IR, intermediate representation)입니다. 만약 interpreter 모드라면 바이트코드를 하나씩 읽어서 실행하고, JIT 모드라면 바이트 코드를 기반으로 컴파일하여 수행합니다.

바이트코드(Bytecode, portable code, p-code)는 특정 하드웨어가 아닌 가상 컴퓨터에서 돌아가는 실행 프로그램을 위한 이진 표현법이다. 하드웨어가 아닌 소프트웨어에 의해 처리되기 때문에, 보통 기계어보다 더 추상적이다.

JIT 컴파일(just-in-time compilation) 또는 동적 번역(dynamic translation)은 프로그램을 실제 실행하는 시점에 기계어로 번역하는 컴파일 기법이다. 이 기법은 프로그램의 실행 속도를 빠르게 하기 위해 사용된다

프로그래밍 언어의 한 종류로,

기존에 이미 존재하는 소프트웨어(애플리케이션)를 제어하기 위한 용도로 쓰이는 언어이다. 

멀티-패러다임 언어로 명령형, 함수형, 객체지향형 언어다.

일반적인 응용 소프트웨어는 컴파일러를 사용하는 언어에 의해 기계어로 번역된 채로 실행되기 때문에, 수정이 빈번하게 발생하면 수정 후 일일이 컴파일을 다시 해야 한다. 덩치가 큰 프로그램은 컴파일 시간도 몇 시간 단위로 잡아먹는 일이 많은데다, 일일이 컴파일을 다시 하는 것도 상당히 귀찮은 작업이다. 

이 때문에 수정이 빈번하게 발생하는 부분은 소스코드를 한줄 한줄 읽어 바로바로 실행하는 인터프리터 방식이 상당히 유리하다.

스크립트 언어는 이런 부분에 사용하기 위해 나온 것으로, 응용 소프트웨어에서 스크립트 언어에 맞는 API를 제공, 응용 소프트웨어와 상호작용하면서 돌아가게 된다.

자바스크립트로 작성된 프로그램을 스크립트라고 하며, 컴파일이 필요하지 않다.

그냥 HTML 웹 페이지에 스크립트를 삽입하기만 하면 동작하며 최신 웹 브라우저에서 모두 동작한다.

자바스크립트를 주로 클라이언트 측 자바스크립트라고 하는데,
이는 스크립트가 웹 서버가 아닌 클라이언트 컴퓨터에 설치된 브라우저에서 실행된다는 의미다.

[자바스크립트의 특징]

1. 자바스크립트는 객체 기반의 스크립트 언어
2. 자바스크립트는 동적이며, 타입을 명시할 필요가 없는 인터프리터 언어
3. 자바스크립트는 객체 지향형 프로그래밍과 함수형 프로그래밍을 모두 표현가능

[DOM 문서객체모델]

DOM이란?

문서객체모델의 약자로, 브라우저에선 HTML문서의 태그, 속성, 프로퍼티, 텍스트 등은 모두 별도의 객체로 파싱되고 이 객체들을 DOM이라고 한다.

[브라우저 내부 동작 원리]

1.   처음 브라우저가 응답을 받으면, 브라우저가 가지고있는 파서를 이용해 HTML문서를 브라우저가 이해할 수 있는 DOM 트리 형식으로 파싱한다.

2.       CSS를 파싱하여 스타일 구조체의 형식으로 만든다. 이를 CSSOM이라고 한다.

3.       DOM과 CSSOM을 실제 화면에 표현하기 위한 데이터 구조인 렌더링 트리로 변환한다.

4.       해당 렌더링 트리를 그리고 화면에 표시한다.