JS 코드에 세미콜론을 추가해야 합니까?

JavaScript의 세미콜론은 커뮤니티를 나눕니다. 어떤 사람들은 어쨌든 세미콜론을 사용하는 것을 선호합니다. 다른 사람들은 세미콜론을 추가하지 않는 것을 선호합니다.

수년간 세미콜론을 사용한 후 2017년 가을에 저는 필요에 따라 세미콜론을 추가하지 않기로 결정했고, 필요한 코드 구조에서 요구하지 않는 한 코드에서 세미콜론을 자동으로 제거하도록 Prettier를 설정했습니다.

이제 나는 세미콜론을 사용하지 않는 것이 매우 자연스럽다는 것을 알았고, 그러한 코드가 더 보기 좋고, 더 간결하고 읽기 쉽다고 생각합니다.

JavaScript에서는 세미콜론을 엄격하게 요구하지 않기 때문에 이는 전적으로 가능합니다. 어딘가에 세미콜론이 필요할 때 뒤에서 추가됩니다.

이 프로세스를 자동 세미콜론 삽입이라고 합니다.

예상과 다르게 동작하는 버그가 있는 코드를 작성하지 않으려면 세미콜론 사용 규칙을 이해하는 것이 중요합니다.

세미콜론 자동 추가를 위한 JavaScript 규칙

JavaScript 해석기는 소스 코드를 해석할 때 다음과 같은 특별한 상황을 발견하면 자동으로 세미콜론을 추가합니다.

• 다음 코드 줄의 시작이 현재 코드 줄을 중단하는 경우 (코드는 여러 줄로 작성할 수 있습니다.)

• 다음 줄이 }로 시작하면 현재 블록을 닫습니다

• 소스 코드의 끝에 도달하면

• 현재 블록에서 return이 선언될 때 line

• 현재 라인에서 break가 선언된 경우

• throw가 현재 라인에서 선언된 경우

• 현재 라인에서 continue가 선언된 경우

생각과 다른 코드 예시

이러한 규칙과 관련된 몇 가지 예는 다음과 같습니다.

예제를 보세요:

const hey = 'hey'
const you = 'hey'
const heyYou = hey + ' ' + you
['h', 'e', 'y'].forEach((letter) => console.log(letter))

규칙 1에 따라 JavaScript가 코드를

const hey = 'hey';
const you = 'hey';
const heyYou = hey + ' ' + you['h', 'e', 'y'].forEach((letter) => console.log(letter))

로 해석하려고 시도하기 때문에 Uncaught TypeError: Cannot read property 'forEach' of un Defined 오류가 발생합니다. 이 코드:

(1 + 2).toString()

가 인쇄됩니다. "3 "으로.

const a = 1
const b = 2
const c = a + b
(a + b).toString()

대신에 TypeError: b는 함수가 아닙니다. JavaScript가 이를

const a = 1
const b = 2
const c = a + b(a + b).toString()

로 해석하려고 하기 때문에 예외가 발생합니다. 규칙 4에 기반한 또 다른 예:

(() => {
  return
  {
    color: 'white'
  }
})()

즉시 호출되는 함수의 반환 값을 원합니다. 색상 속성을 포함하는 객체여야 하지만 그렇지 않습니다. 대신 JavaScript가 반환 뒤에 세미콜론을 삽입하기 때문에 정의되지 않습니다.

대신 반환 뒤에 왼쪽 괄호를 넣어야 합니다:

(() => {
  return {
    color: 'white'
  }
})()

이 코드가 '0'을 표시할 것이라고 생각합니다:

1 + 1
-1 + 1 === 0 ? alert(0) : alert(2)

규칙 1에 따른 JavaScript는 이를 다음과 같이 해석하기 때문에 2를 표시합니다:

1 + 1 -1 + 1 === 0 ? alert(0) : alert(2)

결론

조심하세요. 어떤 사람들은 세미콜론에 문제가 있습니다. 별로 상관하지 않습니다. 이 도구는 사용하지 않을 수 있는 옵션을 제공하므로 세미콜론 사용을 피할 수 있습니다.

저는 아무 것도 제안하는 것이 아니라 여러분이 스스로 결정하도록 놔두고 있습니다.

대부분의 경우 이러한 기본 시나리오는 코드에 나타나지 않는다는 점만 기억하면 됩니다.

다음과 같이 몇 가지 규칙을 추출합니다.

• 반환 문을 신중하게 사용하세요. 무언가를 반환하는 경우 반환된 콘텐츠와 동일한 줄에 추가하세요(break, throw, continue와 유사)

• 괄호로 줄을 시작하지 마세요. 괄호로 줄을 시작하지 마세요. 괄호는 이전 줄과 연결되어 함수 호출이나 배열을 형성할 수 있습니다. 요소 참조

마지막으로 항상 코드를 테스트하여 요구 사항을 충족하는지 확인하세요.

추천 튜토리얼: "JS Tutorial"

위 내용은 JS 코드에 세미콜론을 추가해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!