JavaScript / 한 줄·여러 줄 주석 작성법과 주의점

JavaScript에서는 // 뒤의 같은 줄을 한 줄 주석으로, /*와 */ 사이를 블록 주석으로 작성합니다. 주석은 설명을 남기거나 일부 코드의 실행을 잠시 멈추는 데 쓰지만, 사용자에게 전달되는 소스에서 내용을 숨기는 보안 기능은 아닙니다.

한 줄 주석과 블록 주석의 문법

// 이 줄은 실행하지 않는 설명입니다.
const count = 3; // 코드 뒤에도 주석을 붙일 수 있습니다.

/*
  여러 줄에 걸친 설명입니다.
  닫는 기호가 나올 때까지 주석입니다.
*/
const enabled = true;

//는 해당 위치부터 줄 끝까지를 주석으로 만듭니다. 앞에 이미 작성한 코드는 그대로 실행됩니다. /* ... */는 한 줄 안에서도 사용할 수 있고 여러 줄을 포함할 수도 있습니다. 블록 안에서 줄 앞에 *를 붙여 정리하는 것은 가독성을 위한 관례이며, 문법상 매 줄에 필요한 기호는 아닙니다.

공백과 주석이 코드의 의미에 미치는 범위는 MDN의 JavaScript 어휘 문법 설명에서 확인할 수 있습니다. 설명은 “이 줄에서 숫자를 곱한다”처럼 보이는 동작을 그대로 되풀이하기보다, 단위·선택 이유·변경하면 안 되는 조건을 남기는 데 사용하는 편이 도움이 됩니다.

한 줄의 주석만 바꿔 보는 전체 예제

아래 전체 코드를 comments.html에 UTF-8로 저장해 브라우저에서 여세요. 처음에는 15분을 3번 반복한 결과만 표시됩니다. 코드에 적힌 설명이나 주석 처리한 덧셈은 계산 결과에 추가되지 않습니다.

<!doctype html>
<html lang="ko">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>JavaScript 주석 실습</title>
</head>
<body>
<h1>주석으로 실험 조건 바꾸기</h1>
<p id="output"></p>
<pre id="markers"></pre>
<script>
const minutes = 15; // 한 번 작업하는 시간
const sessions = 3;
/*
  기본 계산에는 작업 시간만 포함합니다.
  아래 한 줄의 주석을 해제하면 5분을 더할 수 있습니다.
*/
let total = minutes * sessions;
// total += 5;
document.getElementById("output").textContent = `총 ${total}분`;

// 따옴표 안에 있는 기호는 이 위치에서 주석이 아닙니다.
const lineMarker = "//";
const blockMarker = "/* 설명 */";
document.getElementById("markers").textContent =
  `문자열의 기호: ${lineMarker}, ${blockMarker}`;
</script>
</body>
</html>

기본 결과는 총 45분입니다. // total += 5;에서 맨 앞의 //만 제거한 뒤 저장하고 새로고침하면 50분이 됩니다. 다시 //를 붙이면 45분으로 돌아옵니다. 한 번에 한 줄만 바꾸어, 주석 처리한 문장이 실행되지 않는다는 점을 확인하세요.

아래에는 //와 /* 설명 */라는 문자열도 그대로 출력됩니다. 따옴표 안에 들어간 기호는 이 예제에서 문자열의 내용입니다. 따라서 검색·치환으로 소스의 모든 //를 지우면 URL 같은 문자열 데이터까지 손상할 수 있습니다. 주석 처리는 단순히 특정 글자를 일괄 제거하는 작업과 다릅니다.

중첩·문법·공개 범위를 확인하기

블록 주석 안에 블록 주석을 또 넣어 중첩할 수는 없습니다. 먼저 나오는 */에서 주석이 끝나므로, 기존 블록 주석이 포함된 코드를 통째로 /* ... */로 감싸면 나머지가 코드로 해석돼 오류가 날 수 있습니다. 여러 줄의 코드를 일시적으로 끄려면 편집기의 줄 주석 전환 기능으로 각 줄에 //를 붙이는 방법을 검토하세요.

일반적인 HTML 파일의 본문 주석은 <!-- ... --> 문법을 사용합니다. JavaScript를 작성하는 script 내부와 HTML 문서 본문을 같은 주석 문법으로 취급하지 마세요. 또한 주석이 코드 중간을 차지하더라도 필요한 괄호나 연산자를 대신하지는 않습니다.

const total = 2 /* 첫 번째 값 */ + 3; // 5
const text = "// 이 기호도 문자열입니다.";

공개 웹페이지로 전송한 JavaScript 파일과 인라인 스크립트의 주석은 개발자 도구나 소스 보기에서 확인할 수 있습니다. API 비밀 키, 비밀번호, 개인 정보를 주석에 넣지 마세요. 작업을 끝내고 남기는 주석은 현재 코드와 설명이 맞는지 검토하고, 더는 필요하지 않은 임시 코드는 버전 관리 기록과 구분해 정리하는 것이 좋습니다.