JavaScript 코드를 미화하고 최소화하는 방법

이 도구로 할 수 있는 일

JavaScript 코드를 한 줄에 가깝게 작성했거나, 기존 코드의 구조를 다시 읽기 쉽게 만들고 싶을 때 이 도구를 활용할 수 있습니다. 입력한 JavaScript 텍스트를 미화 형식 또는 최소화 형식으로 바꾸므로, 검토 단계와 배포 준비 단계에서 서로 다른 목적에 맞춰 사용할 수 있습니다. 미화는 들여쓰기와 줄바꿈을 넣어 구조를 살피기 좋게 만드는 방식이고, 최소화는 일부 주석과 공백을 줄여 텍스트를 간결하게 만드는 방식입니다.

다만 서식 변경은 코드의 실행, 컴파일, 문법 검증과 다른 작업입니다. 결과가 보기 좋게 바뀌었다는 사실만으로 문법이 올바르거나 원래 동작이 보존된다고 판단해서는 안 됩니다. 정리한 결과를 실제 작업에 반영하기 전에는 별도의 검토 절차로 의도한 동작과 문법을 확인하는 편이 안전합니다. 입력이 비어 있는 경우와 내용이 있는 경우의 처리도 다르므로, 먼저 사용할 코드의 상태를 파악하면 설정을 고르기 쉽습니다.

입력부터 결과 확인까지

JavaScript 텍스트를 입력 영역에 붙여 넣습니다. 공백만 포함한 입력도 빈 입력으로 처리되며, 이 경우 오류 없이 빈 형식의 텍스트가 결과로 생성됩니다. 실제 코드를 정리하려면 입력이 문자열인지 먼저 확인하고, 내용이 들어 있는지 살펴보세요.
결과의 목적에 따라 미화 또는 최소화 모드를 지정합니다. 미화 모드를 사용하면 구조를 읽기 쉽게 정리할 수 있고, 최소화 모드를 사용하면 따옴표 바깥의 줄 주석과 블록 주석, 줄일 수 있는 공백을 줄일 수 있습니다. 모드를 지정하지 않거나 거짓인 값이 전달되면 미화가 선택됩니다. 문자열 모드는 소문자로 바뀐 뒤 판단되므로, 최소화를 선택하려면 문자열로 된 모드 값을 사용해야 합니다.
들여쓰기 크기를 정합니다. 내용이 있는 입력에서는 설정값이 정수로 변환되며, 값을 생략하면 공백 2개가 기본으로 적용됩니다. 변환할 수 없는 값이나 0부터 8까지의 범위를 벗어난 값은 공백 2개로 대체됩니다. 따라서 네 칸 들여쓰기를 원한다면 허용 범위 안의 정수 4를 지정하고, 결과에서 실제 간격을 확인하세요.
서식 지정 동작을 시작한 다음 결과를 입력과 비교합니다. 미화 결과에는 선택한 들여쓰기 크기가 반영되며, 기존 줄바꿈은 연속 두 줄바꿈까지 유지됩니다. 결과 끝에 마지막 줄바꿈이 자동으로 추가되지는 않습니다. 최소화 결과에서는 따옴표 바깥의 주석과 정리할 수 있는 공백이 처리되고, 반복되는 빈 줄도 줄어듭니다. 따옴표 안에 있는 문자열 내용과 그 안의 이스케이프된 문자는 유지되므로, 문자열 자체를 검토할 때는 원문과 결과를 함께 비교하세요.
결과가 목적에 맞는지 확인합니다. 미화 결과는 들여쓰기, 줄바꿈, 괄호 주변의 공백을 기준으로 읽고, 최소화 결과는 주석과 공백이 줄어든 정도 및 문자열 보존 여부를 기준으로 살펴보면 됩니다. 내용이 긴 입력이라면 전체를 한 번에 처리하기 전에 크기와 구성을 확인하고, 결과를 사용하기 전에는 별도로 실행 가능성과 동작을 점검하세요.

결과의 모양과 처리 범위

미화 결과에서 여러 줄 구조와 일정한 들여쓰기가 보이면 선택한 정리 방식이 반영된 것입니다. 기존에 있던 줄바꿈이 모두 같은 형태로 늘어나는 것은 아니며, 연속된 줄바꿈은 두 줄까지 유지될 수 있습니다. 또한 결과 마지막에 줄바꿈이 없더라도 오류로 볼 수 없습니다. 괄호 안쪽에 불필요한 공백을 만들지 않는 형식도 결과의 특징에 포함됩니다.

최소화 결과는 원문보다 짧아질 수 있지만, 입력에 있던 모든 문자나 모든 공백이 제거된다는 뜻은 아닙니다. 따옴표 밖의 줄 주석과 블록 주석이 대상이며, 따옴표 안의 문자열과 이스케이프된 문자는 보존됩니다. 그러므로 문자열 안에 주석처럼 보이는 문자가 있어도 결과에서 사라졌는지 여부만으로 처리 이상을 판단하지 말고, 해당 문자열의 내용을 원문과 대조하세요.

비어 있지 않은 입력이 UTF-8 기준 1,000,000바이트를 초과하면 서식 지정에 실패할 수 있습니다. 입력이 문자열이 아닌 경우에도 일반적으로 처리되지 않으며, 필요한 JavaScript 서식 지정 기능을 사용할 수 없는 상황에서는 내용이 있는 입력이 실패할 수 있습니다. 이런 결과는 미화와 최소화의 품질을 나타내는 값이 아니라 입력 크기, 입력 형태 또는 처리 조건을 다시 살펴볼 신호입니다.

서식 지정이 끝났다는 사실은 코드가 실행되었다는 의미가 아닙니다. 특히 최소화는 주석과 공백을 다루는 과정이므로, 복잡한 구문과 문자열 주변의 결과를 그대로 신뢰하기보다 원문과 대조하고 별도의 검증을 진행해야 합니다. 미화와 최소화 중 어느 방식이 적합한지는 읽기 편한 검토가 필요한지, 간결한 텍스트가 필요한지에 따라 결정하세요.

사용 예시

짧은 JavaScript 함수가 한 줄로 붙어 있어 구조를 읽기 쉬운 형태로 바꾸려는 상황입니다.

한 줄로 붙어 있는 짧은 함수 코드를 입력하고 미화 모드와 공백 4개 들여쓰기를 지정한 뒤 결과의 줄바꿈과 들여쓰기를 원문과 비교합니다.

결과는 줄바꿈을 포함한 여러 줄의 정리된 텍스트가 되며 공백 4개 들여쓰기가 반영되고 마지막 줄바꿈은 추가되지 않습니다.

제한 사항

내용이 있는 입력이 1,000,000 UTF-8바이트를 초과하거나 입력이 문자열이 아니면 처리가 실패할 수 있으며, 필요한 JavaScript 서식 지정 기능을 사용할 수 없는 경우에도 실패할 수 있습니다.

자주 발생하는 오류

최소화를 선택했는데 미화 결과가 나오면 모드가 문자열이 아니거나 거짓 값으로 전달되었을 가능성이 있습니다. 최소화를 뜻하는 문자열 모드 값을 다시 지정하고, 다른 문자열은 미화로 처리된다는 점도 확인하세요.

자주 묻는 질문

JavaScript 입력을 비워 둬도 처리되나요?

입력이 비어 있거나 공백만 포함한다면 처리에 성공하며 빈 형식의 텍스트가 생성됩니다. 코드가 들어 있는 입력과 같은 방식으로 결과가 채워지는 것은 아닙니다.

최소화하면 문자열 안의 내용도 삭제되나요?

최소화 모드에서도 따옴표 안의 문자열과 이스케이프된 문자는 보존됩니다. 따옴표 바깥의 줄 주석과 블록 주석은 제거 대상이 될 수 있으므로 원문과 결과를 함께 비교하세요.

입력 크기에 제한이 있나요?

내용이 있는 입력이 UTF-8 기준 1,000,000바이트를 넘으면 서식 지정에 실패할 수 있습니다. 크기 외에도 문자열이 아닌 입력이나 필요한 처리 기능을 사용할 수 없는 상황이 결과에 영향을 줄 수 있습니다.