자바스크립트 개발자를 위한 AST

이 글은 Gyujin Cho | 자바스크립트 개발자를 위한 AST(번역)에 작성된 내용을 학습하면서 작성된 글이다.

AST(Abstract Syntax Tree): 추상 구문 트리

왜 AST를 알아야 할까?

코드 압축(minification), CSS 전처리기, ESLint, Prettier 등 도구들이 AST 처리를 기반으로 구축되었다.

AST가 무엇일까?

프로그래밍 언어의 문법에 따라 소스 코드 구조를 표시하는 계층적 프로그램 표현이다. 일반 코드를 입력하여 출력으로 트리 데이터 구조를 얻는다.

어떻게 AST를 추출하나?

컴파일러가 AST를 추출한다. 컴파일러는 어휘 분석 및 구문 분석(Lexical and Syntax Analysis) 단계가 있다. 두 단계의 결과물로 AST가 생성된다.

첫번째 단계인 어휘 분석은 스캐너라고도 한다. 어휘 분석기에 입력된 코드를 읽고 정의된 규칙에 따라 토큰을 만든다.

두번째 단계인 구문 분석은 파서라고도 한다. 구문 분석기는 어휘 분석기의 결과물은 토큰을 언어 구문을 검증하고, 트리 구조로 변환한다. 이 트리 구조가 AST다.