JavaScript 라이브러리에서 선행 세미콜론은 무엇을합니까?


156

여러 JavaScript 라이브러리에서 처음 에이 표기법을 보았습니다.

/**
 * Library XYZ
 */
;(function () {
  // ... and so on

"즉시 실행 된 함수"구문에 완벽하게 익숙하지만

(function(){...})()

최고의 세미콜론이 무엇인지 궁금합니다. 내가 생각해 낼 수있는 것은 그것이 보험이라는 것입니다. 즉, 라이브러리가 다른 버그가있는 코드에 포함 된 경우 "최신 설명은 여기에서 최신"종류의 속도 충돌로 끝납니다.

다른 기능이 있습니까?


답변:


140

여러 JavaScript 파일을 하나의 파일로 안전하게 연결하여 하나의 HTTP 요청으로 더 빨리 제공 할 수 있습니다.


16
그러나 모든 파일이 올바르게 코딩되면 필요하지 않습니까?
Boldewyn 2009

8
아니요 : 귀하의 예에서는을 얻습니다 (function(){...})()(function(){...})().
Aaron Digulla 2009

8
내가 '정확하게 코딩했다'는 의미로, 모든 도서관은 올바른 양의 후미 세미콜론으로 끝납니다 ...
Boldewyn

6
그래 Boldewyn, 그러나 그것은 사실이 아닙니다.
Mathias Bynens 2009

13
잘못 코딩 된 두 파일은 세 번째 파일에이 더티 픽스가 포함되어 있다는 사실만으로는 적합하지 않습니다. 결과로 커 넥티 에이터가 파일 사이에 세미콜론을 추가 할 수없는 이유는 무엇입니까?
Dávid Horváth

30

가장 좋은 대답은 실제로 질문에 주어 졌으므로 명확성을 위해 여기에 적어 두겠습니다.

선행 ;제대로 종료되지 표현식을 포함하는 파일에 연결하는 동안 파일을 추가 할 때 오류를 방지하기 위해 즉시-호출 함수 표현식 앞에이됩니다 ;.

모범 사례는 세미콜론으로 표현을 끝내고 선행 세미콜론을 보호 수단으로 사용하는 것입니다.


방어 세미콜론을 사용하는 경우 세미콜론으로 표현을 끝내는 이유는 무엇입니까? 모든 줄의 끝에 세미콜론이있을 가능성이 있거나 방어 세미콜론을 사용합니다. 두 가지를 모두 수행하면 사람들은 두 가지를 모두 할 이유가 있다고 잘못 결론을 내립니다. 방어 세미콜론을 사용하는 조언은 좋습니다. 조언도의 모든 인스턴스 교체 "\n"";\n"아무 의미합니다.
Vladimir Kornea

4
@VladimirKornea : 항상 자신의 라이브러리 만 사용하는 것은 아니기 때문에 :)
jvenema

@jvenema 왜 그렇게 생각하는지 모르겠습니다.
Vladimir Kornea

6
컨벤션에 따라 다른 사람의 코드에 의존 할 수 없기 때문입니다. 방어 적으로 코드를 작성하면됩니다.
jvenema

1
@VladimirKornea 원하는 경우 방어 적이라고 생각할 수 있습니다. 항상 방어 적 세미콜론으로 시작하지 않는 다른 사람의 코드를 방어합니다.
Nathan Hinchey

26

일반적으로 명령문이 (, [, /, + 또는-로 시작하면 이전에 명령문이 계속되는 것으로 해석 될 수 있습니다. /, + 및-로 시작하는 명령문은 실제로는 거의 없습니다. , 그러나 (와 [로 시작하는 문장은 적어도 일부 스타일의 JavaScript 프로그래밍에서는 전혀 드문 일이 아닙니다. 일부 프로그래머는 그러한 문장의 시작 부분에 방어 세미콜론을 넣어 문장이 있어도 제대로 작동하도록합니다. 수정되고 이전에 종료되는 세미콜론이 제거되기 전에 :

var x = 0 // Semicolon omitted here
;[x,x+1,x+2].forEach(console.log) // Defensive ; keeps this statement separate

출처:

JavaScript : 결정적인 안내서, 6 판


9

이것을 선행 세미콜론이라고합니다.

주요 목적은 잘못 닫히는 이전 코드로부터 자신을 보호하여 문제를 일으킬 수 있습니다. 세미콜론은이 문제를 방지합니다. 앞의 코드가 잘못 닫히면 세미콜론이이를 수정합니다. 제대로 닫히면 세미콜론은 무해하며 부작용이 없습니다.


7

한 줄 답변은 여러 JavaScript 파일을 안전하게 연결하는 것입니다. 세미콜론을 사용해도 문제가 발생하지 않습니다.

여러 기능이 있다고 가정하십시오.

IIFE 1

(function(){
  // The rest of the code
})(); // Note it is an IIFE

IIFE 2

(function(){
   // The rest of the code
})(); // Note it is also an IIFE

연결하면 다음과 같이 보일 수 있습니다.

(function(){})()(function(){})()

그러나 함수 앞에 세미콜론을 추가하면 다음과 같습니다.

;(function(){})();(function(){})()

따라서를 추가하면 ;식이 올바르게 종료되지 않은 경우주의를 기울입니다.

실시 예 2

변수가있는 JavaScript 파일이 있다고 가정하십시오.

var someVar = "myVar"

일부 기능을 가진 또 다른 JavaScript 파일 :

(function(){})()

이제 연결하면 다음과 같이 보입니다.

var someVar = "myVar"(function(){})() // It may give rise to an error

세미콜론을 사용하면 다음과 같습니다.

var someVar = "myVar";(function(){})()

4

JavaScript 코드를 축소 할 때 좋습니다. 예기치 않은 구문 오류를 방지합니다.


무엇처럼? 세미콜론은 다음 코드에 의미가 있습니까, 아니면 실제 라이브러리 앞에 병합 된 가상 버그 코드에 대한 것입니까?
Boldewyn 2009

이 코드만으로는 특별한 의미가 없지만 해당 코드가 다른 코드의 중간에 있고 한 줄로 축소하면 (1) 이전 행에서 세미콜론이 누락 된 것처럼 (1) 예기치 않은 오류가 발생할 수 있습니다. ) 이전 함수도 함수이므로 () () () (), 오류가 발생하고 디버깅하기가 어려울 때 버그가 발생한다고 말할 수 없습니다.
당신

1
그러나 이것을 올바르게 처리하는 것은 축소 기의 책임입니다. 오늘날 버기 축소 기가 표준입니까?
Vladimir Kornea
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.