[자바스크립트] 세미콜론(;)을 꼭 안찍어도되는 ASI 알아보기

자바스크립트 세미콜론 꼭찍어야되나?

✔️자바스크립트의 세미콜론(;)

자바스크립트에서는 세미콜론을 찍어주는 이유는 내가 쓰는 구문이 종료가 되었다 라는 의미이다.

프로그래밍 문법에 맞게 작성한 코드를 적고 해당 코드가 완료되면

그 뒤에 종료가 되었다는 의미로 세미콜론을 찍어준다.

let a = 1;
console.log(a);

 

하지만, 개발을 하다 보면 세미콜론을 정확히 찍을 때도 있지만,

개발을 하다보면 세미콜론을 까먹고 안 찍는 경우도 있다.

하지만 보통 세미콜론을 안찍어도 오류가 난적이 없다!

그런데도 꼭 세미콜론을 찍어야하는건가? 

 

하지만 오류가 안나는 이유는 바로 ASI 때문이다!

 

🎇ASI(Automatic Semicolon Inserion, 자동 세미콜론 삽입)

ASI는 자바스크립트 엔진에서 자동으로 ASI를 찍어주는 기능이 있기 때문에

내가 까먹고 세미콜론을 안 찍어도 자동으로 세미콜론이 추가가 된다.

 

 

🤔그럼 우리는 자바스크립트 작성 시 세미콜론을 안찍어도 되는 것인가?

결론적으로 말하면 ASI기능으로 인해서 세미콜론을 찍지 않아도 기능적으로 동작에는 문제는 없다.

 

하지만, 기본적으로 세미콜론을 붙이는 것이 자바스크립트의 기본적인 사용법이고

실제로 가독성을 위해서 세미콜론을 찍는 것이 좋다는 주장들이 많으며,

ASI가 수행되는 시나리오에 따라서 오류가 발생할 수 있는 상황도 적지만 발생이 가능하다.

 

⛔ASI 오류가 나타날 만한 상황

ASI 특징은 한 줄에 개행이 되는 곳에 세미콜론을 붙여준다.

function text() {
	return 
    {
    	text : '가나다'
    }
}

console.log(text())

 

ASI에 대해 나타나는 결과화면

위의 경우 코드의 경우 return 뒤에 개행이 되어있어

바로 ASI 규칙에 따라 세미콜론이 붙게 된다.

 

function text() {
	return {
    	text : '가나다'
    }
}

console.log(text())

 

내가 원하는 가나다를 가진 text를 호출하려면,

return 뒤에 띄어쓰기 없이 작성을 해야지 정확한 결과를 볼 수 있다.

 

ASI 결과화면