Code structure (JavaScript)

 

문장(Statements)

문장은 자바스크립트 문법 구조 및 명령어로 이루어지며 , 특정 동작을 수행함.

 

예를 들면 

 

alert('Hello, world!');

 

이 문장은 alert() 함수를 실행하여 "Hello, World!"를 출력함.

여러 개의 문장을 사용할 수 도 있으며 문장은 세미콜론(;)으로 구분이 됨. 

 

예제 : 여러 개의 문장

 

alert('Hello'); alert('World');

 

더 읽기 쉽게 작성하는 방법

 

alert('Hello');
alert('World');

 

각 문장을 개행 ( 새 줄 ) 하여 가독성을 높일 수 있음.

 

세미콜론(;) 사용법

 

자바스크립트에서는 대부분의 경우 세미콜론을 생략 가능하지만 명확한 구분을 위해 사용하는 것이 권장됨.

 

세미콜론 없이도 실행되는 코드 

 

alert('Hello')
alert('World')

 

이 경우, 자바스크립트는 자동으로 세미콜론을 삽입하여 코드가 정상적으로 실행됨.

이것을 자동 세미콜론 삽입(Automatic Semicolon Insertion , ASI )이라고 함.

하지만 자동 세미콜론 삽입이 항상 작동하는 것은 아님.

 

세미콜론을 생략하면 오류가 발생할 수 있는 예제

 

alert(3 +
1
+ 2);

 

위 코드는 3 + 1 + 2를 계산하여 6을 출력함. 

이유 : + 연산자는 줄 바꿈이 있어도 문장이 끝나지 않았다고 해석됨.

따라서 자바스크립트는 자동으로 세미콜론을 삽입하지 않음.

 

문장이 끝났다고 생각하지 않으니까 .

 

하지만 자동 세미콜론 삽입이 잘못 동작하는 경우도 있음.

 

예제 : 세미콜론을 생략하면 예상치 못한 오류 발생

 

alert("Hello")

[1, 2].forEach(alert);

 

 

아직 [] 괄호의 의미에 대해 생각할 필요는 없음. 나중에 공부할 것 

지금은 코드의 실행 결과만 기억하면 됨. 

 

Hello -> 1 -> 2 순으로 표시

 

이제 세미콜론을 제거해봄.

 

alert("Hello");
[1, 2].forEach(alert);

 

위의 코드와 다른점은 첫 줄의 세미콜론 하나임. 

이 코드를 실행하면 첫 번째 Hello만 실행이 되고 오류가 발생함. 

 

그 이유는 JavaScript가 대괄호 앞에 세미콜론을 가정하지 않기 때문.

따라서 마지막 예제의 코드는 단일 명령문으로 처리됨.

엔진이 이를 어떻게 동작시키는 지 확인해봄.

 

alert("Hello")[1, 2].forEach(alert);

 

alert이 이상해보임. 이 경우 이런 병합은 잘못된 것임.

코드가 제대로 작동하려면 뒤에 세미콜론을 넣어야 함. 

 

줄바꿈으로 구분하더라도 문장 사이에 세미콜론을 넣는 것이 좋음. 이 규칙은 커뮤니티에서 널리 채택되었음. 

다시 한 번 말하자면 세미콜론을 생략할 순 있음.  하지만 특히 초보자에겐 세미콜론을 사용하는 것이 더 안전함.

 

주석(Comments)

코드가 길어질수록 주석(Comment)을 이용하여 코드의 의미를 설명하는 것이 중요함.

주석은 프로그램 실행에는 영향을 주지 않으며 단순히 코드를 설명하는 역할만 함. 

 

한줄 주석 

 

한줄 주석은 //로 시작하며 , 해당 줄의 코드 실행을 막거나 설명을 추가할 수 있음.

 

예제 : 한 줄 주석 사용 

 

// 이 줄은 실행되지 않음
alert('Hello');

alert('World'); // 코드 뒤에도 주석을 추가할 수 있음

 

여러 줄 주석 

 

여러 줄 주석은 /* ... */로 감싸서 사용함.

 

예제 : 여러 줄 주석

 

/* 
   이 주석은 여러 줄을 차지할 수 있음.
   코드에 대한 설명을 길게 작성할 때 사용.
*/
alert('Hello');
alert('World');

 

이 주석 안의 내용은 실행되지 않음.

 

주석을 활용하면 코드의 가독성이 좋아지고 유지보수가 쉬워짐.

 

코드 비활성화 ( 일시적으로 실행 중지)

특정 코드를 일시적으로 실행하지 않을 때 주석을 사용할 수 있음.

 

예제 : 코드 실행을 막기 

 

/* 
alert('Hello'); // 이 부분은 실행되지 않음
*/
alert('World'); // 이 부분만 실행됨

 

주석 관련 추가 정보

주석 단축키 (Hotkeys)

 

대부분의 코드 편집기에서 빠르게 주석을 추가하는 단축키를 제공함. 

 

OS	한 줄 주석	여러 줄 주석
Windows/Linux	Ctrl + /	Ctrl + Shift + /
macOS	Cmd + /	Cmd + Shift + /

 

 

위 단축키를 사용하면 코드 작성이 훨씬 빨라짐.

 

중첩된 여러 줄 주석은 지원되지 않음.

다음과 같은 중첩 주석은 지원되지 않으며 오류가 발생함.

 

예제 : 중첩된 주석은 오류 발생 

 

/*
   /* 중첩된 주석!?! */
*/
alert('World');

 

위 코드는 오류가 발생하므로 중첩 주석을 사용하지 말 것 .

 

주석은 실제 코드 실행에 영향을 미치지 않는다.

주석은 코드의 크기를 증가시키지만 웹 사이트 실행 속도에는 영향을 주진 않음.

배포(프로덕션) 환경에서는 코드 압축(minify)을 통해 자동으로 주석이 제거됨.

 

즉 개발할땐 자유롭게 주석을 작성하여도 상관 없음.