[JS] 예약어 오류 나는 이유 & 오류 종류가 다른 이유

다른 이유만 궁금하신 분들은 맨아래 결론부터 보시면 됩니다. 

JS의 변수명 규칙

• 영어,숫자,한글, 특수문자(일부) 사용 가능하다.
• 하지만 변수명의 첫글자는 숫자를 사용할 수 없다.
  ex) 123variable
  -> 숫자를 변수명의 일부로 인식할지 숫자 상수로 인식할지 혼란스러워 해버림.
• 띄어쓰기도 안된다.
• 선언 하는 키워드는 var과 let,const 이 있지만, let, const를 사용한다.
  -> var은 옛날 버전이라서 그런듯.

let is disallowed as a lexically bound name

• 변수를 선언할때, 사용하면 안되는 예약어들이 존재한다.
  • 예약어(Reserved Words)는 프로그래밍 언어에서 특별한 용도로 미리 예약되어 있는 단어나 식별자입니다. 이러한 단어들은 변수명, 함수명, 클래스명 등의 식별자로 사용될 수 없습니다. break,case,catch,class,const,continue,debugger,default,delete,do,else,export,extends,finally,for,function,if,import,in,instanceof,new,return,super,switch,this,throw,try,typeof,var,void,while,with,yield,......
• 위와 같은 예약어를 변수명으로 사용하게되면 Uncaught SyntaxError: Unexpected token 'class' 라는 에러가 뜬다. 해석하자면 "'class'라는 단어(토큰)에서 예기치못한 에러가 발생했다." 이다.

• 하지만, let은 let is disallowed as a lexically bound name 이라는 에러가 나온다. 해석하자면, "let은 변수명으로 허용되지않는다"라는 것인데, 🤔 대체 왜 이런 에러가 나는 것일까?

에러가 다른 이유

• 답은 var let = 1 이라고 코드를 쳐보면 나온다.
• 아래를 보면 var let = 1;은 에러 없이 잘 실행된다

그 이유는 let이라는 문법이 ES6 이후로 추가된 문법이기 때문이다.
그래서 사실 let은 예약어가 아니다. 뒤늦게 추가되었기 때문에 위와같이 다른 에러로 처리를 한 것이다

• 그럼 왜? 예약어로 추가하지않고 새로 추가했을까?
  • 이것의 이유는 간단하다. 이미 많은 사람들이 사용하고있는 JS에 새로운 문법을 추가하는 것보다 기존의 있는 문법을 변경하는것이 매우~어렵고 불가능하기 때문이다.
  • 기존의 문법을 바꾸게 된다면 JS로 표현한 웹페이지들은 모두 변경되게되어 잠재적 버그가 일어날수도 있고 그만큼 안정적이지 못한 언어로 된다는 것이다.
• 🧐그럼 왜 굳이 var가 있는데 let를 추가했을까?🤔

 

var가 있는데 let이 추가된 이유

• 이유는 간단하다. 문제가 있어서 보완하기위해 추가된 것!

 

 

 

 

도움 받은 블로그 : https://velog.io/@gloom/JavaScript-%EB%B3%80%EC%88%98%EC%99%80-let-is-disallowed-as-a-lexically-bound-name