안녕하세요 독자 여러분, 이 기사는 엔진이 왜 필요한지, 어떻게 작동하는지 그리고 WTH는 JS 엔진 인지 궁금하신 분들을 위한 글입니다 !!!? 따라서 이 문서는 섹션으로 나뉩니다. JS가 작동하는 이유와 작동 방식.

면책 조항 - 우리는 핵심(스택, 메모리 힙 등)을 다루지 않을 것입니다. 이 기사는 JS 엔진에만 초점을 맞출 것입니다. 나는 이 글을 다른 따분한 글들과 달리 인터랙티브하게 만들기 위해 노력했습니다. 이 기사에서 제공하는 모든 것을 이해하고 얻을 수 있습니다.

질문을 해보자, 그렇지?

JS 엔진이 무엇이며 왜 필요한가요?

JavaScript 엔진 은 JavaScript 코드 를 실행 하는 소프트웨어 구성 요소 입니다 . 최초의 JavaScript 엔진 은 단순한 인터프리터 였지만 모든 관련 최신 엔진은 ...을 사용합니다. 등. (위키피디아에 따르면)

단조로움을 깨자: 위의 줄을 이해하는 대신, 이것을 이해합시다:

예를 들어 두 사람이 있는데 한 명은 프랑스인‍이고 다른 한 명은 독일인‍✈️인데 둘 다 대화가 필요합니다. 어떻게 할까요? 물론 일부 번역가/통역사의 도움으로.

컴퓨터 와 귀하의 코드 도 마찬가지입니다. 귀하의 컴퓨터는 코드를 이해할 수 없기 때문에 엔진/중개자가 필요 source code합니다 machine code.

그것은 이것이 당신이 이해하는 것을 의미합니다.

'여보세요!'

이것이 컴퓨터가 이해하는 것입니다.

' 01001000 01100101 01101100 01101100 01101111 00100001'

소스 코드 ➡️⚙️➡️ 기계 코드

코드를 변환하는 방식에 따라 유형이 결정됩니다. , interpreted, compiled및 JIT compiled.

컴파일 언어, 인터프리터, JIT 컴파일이 무엇인지에 대해 들어보셨을 것입니다????

그리고 저는 많은 사람들이 자바스크립트가 해석된 언어라고 생각한다고 믿습니다. 그렇지 않다는 것을 말씀드리겠습니다❌. " JS는 JIT(Just In Time) 컴파일 언어입니다".

각 방법을 이해합시다.

• 컴파일: 컴파일 시 전체 소스 코드가 한 번에 기계 코드로 변환되어 성능이 향상됩니다. 소스 코드가 이미 컴파일되었기 때문에 컴파일이 더 빠릅니다. 우리는 단지 그것을 실행하는 것입니다. 이미 바이트 코드/기계 코드가 준비되어 있습니다.

• 인터프리터: 동일한 작업을 수행하지만 모든 작업을 한 번에 수행하지는 않습니다. 컴파일러보다 10배 느립니다. 코드는 동시에 읽고 실행되며 JS는 순수하게 해석되는 언어였습니다. JS를 훨씬 훨씬 더 느리게 만들었습니다!!.

• 따라서 느린 실행을 방지하기 위해 최신 JS는 소스 코드가 기계 코드로 변환되지만 컴파일과 달리 이식 가능한 파일을 생성하지 않는 JIT(적시) 컴파일 방식을 사용합니다. 즉시 실행됩니다. 이는 최신 JS 엔진이 둘 다 사용한다는 것을 의미합니다.

1. 해석 — 한 줄을 읽고 한 줄을 번역합니다. 다시 두 번째 줄은 한 줄을 번역합니다. 정말 많은 시간이 걸립니다,
2. 편집 — 책 전체를 읽었습니다. 힌디어로 자신만의 책 버전을 만들고 친구에게 읽게 하세요. 그래서 나중에 누군가에게 설명해야 할 때마다 당신은 그것을 할 수 있을 것입니다. 더 빠른 방법입니다.
3. JIT 편집 — 책을 복사하는 대신 책을 읽습니다. 당신은 당신의 친구에게 설명하므로 책의 사본이 필요하지 않습니다. 가장 효율적이고 빠른 방법입니다.

이것이 엔진에서 JS 코드가 실행되는 방식이며, 엔진은 이러한 단계를 거쳐야 합니다. 소스 코드를 기계 코드로 변환하기 위해.

하나씩 이해합시다.

1. 첫 번째 단계는 제발 "코딩"하는 것입니다!, XD!
2. 구문 분석: parse는 소스 코드 를 토큰 으로 변환합니다 (즉, 코드가 const, message, =, 'hello'와 같음을 의미합니다. 이들은 4개의 토큰입니다.) 토큰 은 추상 구문 트리(AST )라는 데이터 구조로 변환됩니다. ) , 이렇게 생겼습니다.

이것은 단지 한 줄의 코드입니다. 프로그램이 얼마나 광범위할지 상상해 보세요. 왜 우리가 AST에 대한 구문 분석이 필요한지 궁금할 것입니다. 우리가 직접 가지고 있는 것을 컴파일할 수는 없습니까?

따라서 AST는 정확성✅과 프로그램 및 언어의 적절한 사용을 검증하는 데 중요한 역할을 한다는 점을 알려드립니다. (eg linting 은 AST를 사용하는데, lint에 대해 잘 모르시는 분들을 위해. 코드를 확인하고 오류를 보여주는데 멋지지 않나요) 그리고 AST는 babel, webpack, minifiers, and 구문 형광펜.

AST가 어떻게 생겼는지 확인하려면 이 웹사이트를 확인하십시오. 또는 이 예를 참조하십시오.

3. 컴파일: ⚙️ AST를 기계 코드/바이너리 코드로 변환합니다. 이제 코드는 컴퓨터가 이해할 수 있는 바이너리 코드(0, 1)로 변환되었습니다.

4. 실행: 호출 스택에서 발생합니다(또 다른 흥미로운 주제이지만 여기서는 다루지 않겠습니다). 이야기는 여기서 끝나지 않고,

5. 최적화: 최신 JS 엔진은 코드를 지속적으로 최적화합니다. JIT가 빠른 이유는 무엇입니까? 최적화되지 않은 버전의 기계 코드를 먼저 생성하므로 최소한 가능한 한 빨리 실행되고 백그라운드에서 코드를 최적화하고 이전의 최적화되지 않은 코드는 새로운 코드로 대체되는 지속적인 ♻️ 최적화가 있을 것입니다. 최적화된 것.

결론 :

엔진이 필요한 이유 는 무엇 입니까? ➡ 저희 코드(소스코드)는 컴퓨터가 이해할 수 없기 때문에 바이너리 코드(0,1)/기계코드만 이해합니다. 따라서 변환을 위한 중개자가 필요합니다(엔진이 하는 일).

엔진이 하는 일 ➡ 소스 코드 ➡️⚙️➡️ 기계 코드

엔진 작동 방식 ➡ 네 단계로 작동합니다.

소스 코드 ➡️⚙️➡️ ➡ AST (추상 구문 트리 ) ➡ ➡️⚙️➡️ ➡ 이진 코드/기계 코드 ➡ ➡️⚙️➡️ ➡ 호출 스택에서 실행 ➡ ➡️⚙️➡️ ➡ 최적화 ♻️