우리가 가장 먼저 공부할 것은 코드의 구성 요소입니다.
명령문은 작업을 수행하는 구문 구성 및 명령입니다.
우리는 이미 “Hello, world!”라는 메시지를 보여주는 alert('Hello, world!')
문을 보았습니다.
코드에는 원하는 만큼 많은 명령문이 있을 수 있습니다. 명령문은 세미콜론으로 구분할 수 있습니다.
예를 들어 여기서는 "Hello World"를 두 개의 경고로 분할합니다.
경보('안녕하세요'); 경고('세계');
일반적으로 명령문은 코드를 더 읽기 쉽게 만들기 위해 별도의 줄에 작성됩니다.
경보('안녕하세요'); 경고('세계');
줄 바꿈이 있는 경우 대부분의 경우 세미콜론을 생략할 수 있습니다.
이것은 또한 작동합니다:
경고('안녕하세요') 경고('세계')
여기서 JavaScript는 줄 바꿈을 "암시적" 세미콜론으로 해석합니다. 이를 자동 세미콜론 삽입이라고 합니다.
대부분의 경우 개행 문자는 세미콜론을 의미합니다. 그러나 “대부분의 경우”는 “항상”을 의미하지 않습니다!
개행 문자가 세미콜론을 의미하지 않는 경우가 있습니다. 예를 들어:
경고(3 + 1 + 2);
JavaScript는 여기에 세미콜론을 삽입하지 않기 때문에 코드는 6
출력합니다. 줄이 더하기 "+"
로 끝나면 "불완전한 표현"이므로 세미콜론이 올바르지 않다는 것이 직관적으로 분명합니다. 그리고 이 경우에는 의도한 대로 작동합니다.
그러나 JavaScript가 실제로 필요한 세미콜론을 사용하지 못하는 상황이 있습니다.
이러한 경우 발생하는 오류는 찾아서 수정하기가 매우 어렵습니다.
오류의 예
이러한 오류의 구체적인 예를 보려면 다음 코드를 확인하세요.
Alert("안녕하세요"); [1, 2].forEach(경고);
아직 대괄호 []
와 forEach
의 의미를 생각할 필요가 없습니다. 나중에 공부해 보겠습니다. 지금은 코드 실행 결과만 기억하세요. Hello
, 1
, 2
표시됩니다.
이제 alert
뒤의 세미콜론을 제거해 보겠습니다.
경고("안녕하세요") [1, 2].forEach(경고);
위 코드와 차이점은 단 하나의 문자입니다. 첫 번째 줄 끝의 세미콜론이 사라졌습니다.
이 코드를 실행하면 첫 번째 Hello
만 표시됩니다(오류가 있으므로 이를 보려면 콘솔을 열어야 할 수도 있습니다). 더 이상 숫자가 없습니다.
그 이유는 JavaScript가 대괄호 [...]
앞에 세미콜론을 사용하지 않기 때문입니다. 따라서 마지막 예제의 코드는 단일 문으로 처리됩니다.
엔진이 이를 인식하는 방법은 다음과 같습니다.
Alert("안녕하세요")[1, 2].forEach(alert);
이상해 보이죠? 이 경우 이러한 병합은 잘못된 것입니다. 코드가 올바르게 작동하려면 alert
뒤에 세미콜론을 넣어야 합니다.
이는 다른 상황에서도 발생할 수 있습니다.
줄 바꿈으로 구분된 경우에도 문 사이에 세미콜론을 넣는 것이 좋습니다. 이 규칙은 커뮤니티에서 널리 채택됩니다. 다시 한 번 알아두세요. 대부분의 경우 세미콜론을 생략 할 수 있습니다 . 그러나 특히 초보자의 경우 사용하는 것이 더 안전합니다.
시간이 지남에 따라 프로그램은 점점 더 복잡해집니다. 코드가 수행하는 작업과 이유를 설명하는 주석을 추가해야 합니다.
주석은 스크립트의 어느 위치에나 넣을 수 있습니다. 엔진은 이를 무시하기 때문에 실행에는 영향을 주지 않습니다.
한 줄 주석은 두 개의 슬래시 문자 //
로 시작합니다.
나머지 줄은 주석입니다. 자체적으로 전체 줄을 차지할 수도 있고 명령문을 따를 수도 있습니다.
여기처럼:
// 이 주석은 한 줄을 차지합니다. 경보('안녕하세요'); 경고('세계'); // 이 주석은 명령문 뒤에 나옵니다.
여러 줄 주석은 슬래시와 별표 /*
로 시작하고 별표와 슬래시 */
로 끝납니다.
이와 같이:
/* 두 개의 메시지가 있는 예입니다. 여러줄 주석입니다. */ 경보('안녕하세요'); 경고('세계');
주석 내용은 무시되므로 /* … */
안에 코드를 넣으면 실행되지 않습니다.
때로는 코드의 일부를 일시적으로 비활성화하는 것이 편리할 수 있습니다.
/* 코드 주석 처리 경보('안녕하세요'); */ 경고('세계');
단축키를 사용하세요!
대부분의 편집기에서는 한 줄 주석의 경우 Ctrl + / 단축키를 누르고 여러 줄 주석의 경우 Ctrl + Shift + / –와 같은 키를 눌러 코드 줄을 주석 처리할 수 있습니다(코드 조각을 선택하고 단축키 누르기). Mac의 경우 Ctrl 대신 Cmd를 , Shift 대신 Option을 사용해 보세요.
중첩된 댓글은 지원되지 않습니다!
다른 /*...*/
안에 /*...*/
가 없을 수도 있습니다.
이러한 코드는 오류와 함께 종료됩니다.
/* /* 중첩된 주석?!? */ */ 경고( '세계' );
주저하지 말고 코드에 주석을 달아주세요.
주석은 전체 코드 공간을 늘리지만 전혀 문제가 되지 않습니다. 프로덕션 서버에 게시하기 전에 코드를 축소하는 도구가 많이 있습니다. 주석을 제거하므로 작업 스크립트에 표시되지 않습니다. 따라서 댓글은 생산에 전혀 부정적인 영향을 미치지 않습니다.
튜토리얼 뒷부분에는 더 나은 주석을 작성하는 방법을 설명하는 코드 품질 장이 있습니다.