JavaScript Beautifier 및 포맷터 온라인
지저분하거나 압축된 JavaScript(.js / .min.js)를 실시간으로 즉시 형식화하고 축소 해제하고 정리합니다. 당사의 토큰 인식 JS 포맷터는 ES6+ 화살표 함수, 템플릿 리터럴, 정규 표현식, for 루프, https:// URL 및 연결된 메소드 호출를 정확하게 처리하며, 컴팩트한 프로덕션 코드를 위한 원클릭 JS Minifier를 포함합니다.
JavaScript 온라인을 아름답게 만들고 축소하는 방법
- 코드 붙여넣기: 압축된
.min.js번들 또는 형식화되지 않은 스크립트를 왼쪽의 Input JavaScript 편집기에 붙여넣거나 Load Sample를 클릭하여 ES6+ 기능을 테스트하세요. - 빠른 사전 설정 선택 또는 옵션 사용자 정의: 2 공백(표준) 클릭, 4 Spaces, Allman + Chain Break 또는 Minify(.min.js) 또는 미세 조정 오른쪽 패널의 중괄호 배치, 조건부 간격 및 주석 제거.
- 실시간 검토: 형식이 지정된 출력 및 문자/줄/블록 카운터는 입력하거나 설정을 전환할 때 자동으로 업데이트됩니다.
- 복사 또는 다운로드: clipboard로 복사 또는 Download .js를 클릭하여
script.beautified.js(또는script.min.js)를 저장합니다.
JavaScript 형식 지정 옵션 설명
| 옵션 | 제어 대상 | 전에 | 후에 |
|---|---|---|---|
| 동일선 교정기(K&R) | 헤더 라인(선택) 또는 Allman 스타일의 새 라인(선택 해제)에 여는 {를 배치합니다. |
if(ok){run();}else{stop();} |
if (ok) { |
| 조건부 앞의 공간 | if, for, while, switch, catch 및 (. |
for(let i=0;i<5;i++) |
for (i = 0; i < 5; i++) |
| Break Chained 메서드 | 들여쓰기된 줄 전체에서 흐름 메서드 체인(.filter().map().sort())을 분할합니다. |
items.filter(fn).map(fn).sort(); |
items.filter(fn) |
| 댓글 제거 | https:// 문자열과 정규식을 그대로 유지하면서 // 및 /* */ 주석을 제거합니다. |
const u = "https://a.com"; // url |
const u = "https://a.com"; |
토큰 인식 JavaScript 포맷터를 사용하는 이유는 무엇입니까?
간단한 텍스트 대체 규칙을 사용하여 JavaScript 형식을 지정하면 /, ; 및 {와 같은 문자가 상황에 따라 다른 의미를 갖기 때문에 유효한 코드가 손상되는 경우가 많습니다. 우리의 포맷터는 다음을 이해하는 전용 JavaScript 어휘 토크나이저를 사용합니다.
- 문자열 및 ES6 템플릿 리터럴: 작은따옴표(
'...'), 큰따옴표("..."), 백틱 템플릿 문자열(`Hello ${name}`) 및 이스케이프된 백슬래시 ("C:\\Users\\")은 그대로 보존됩니다. - 정규식 대 Division:
/^user_[0-9]+;?/i와 같은 regex 리터럴을(a + b) / 2와 같은 나누기 표현식과 구별하므로 regex 내부의 세미콜론이나 슬래시는 줄을 나누지 않습니다. for (...)루프 헤더:for 내부의 세미콜론(let i = 0; i < n; i++)는 세 개의 개별 라인으로 분리되는 대신 동일한 헤더 라인에 유지됩니다.- 안전한 댓글 제거: 한 줄
//및 여러 줄/* */주석은 별도로 토큰화되므로"https://api.example.com"와 같은 URL은 주석을 제거할 때 절대 잘리지 않습니다.
자주 묻는 질문
온라인에서 .min.js 파일의 축소를 어떻게 해제합니까?
압축된 .min.js 코드를 왼쪽의 Input JavaScript 편집기에 붙여넣습니다. 토크나이저는 여러 줄의 깔끔한 들여쓰기를 사용하여 실시간으로 명령문, 블록, 함수 및 루프를 자동으로 확장합니다.
댓글을 삭제하면 내 JavaScript의 https:// URL 또는 regex 리터럴에 영향을 미치나요?
아니요. 우리 포맷터는 순진한 정규 표현식이 아닌 어휘 토크나이저를 사용하기 때문에 작은 따옴표로 묶인 문자열, 큰 따옴표로 묶인 문자열, 템플릿 리터럴 및 정규 표현식(/pattern/g) 내의 // 및 /* */는 제거되거나 수정되지 않습니다.
K&R(동일 라인)과 Allman(개행) 버팀대 스타일의 차이점은 무엇입니까?
K&R 스타일은 여는 중괄호 {를 function, if 또는 루프 헤더(대부분의 JavaScript 스타일 가이드의 표준)와 동일한 줄에 배치합니다. 동일 줄 중괄호를 선택 취소하면 Allman 스타일로 전환되어 여는 중괄호를 닫는 중괄호와 정렬된 자체 새 줄에 배치합니다.
이 도구를 사용하여 JavaScript도 축소할 수 있나요?
예. Minify JS 버튼을 클릭하거나 설정 패널에서 Minify (Single-Line .min.js)를 선택하여 필수 키워드 공백을 그대로 유지하면서 주석과 불필요한 공백을 제거합니다.
내 JavaScript 코드가 다른 서버에 업로드됩니까?
아니요. 모든 JavaScript 형식화 및 축소는 브라우저에서 로컬로 100% 실행됩니다. 소스 코드는 절대로 장치를 떠나지 않습니다.