ECMA Script(이하 ES)는 웹 표준으로 사용 되는 자바스크립트의 버전을 말한다. 현재 내가 사용하는 ES 버전은 2016년에 발표 된 것으로, 그 앞의 ES5는 2009년에 발표되었다고 한다.
-
ES5와 ES6의 대표적인 차이점으로 아래 항목들을 들 수 있다.
. 템플릿 리터럴 . 화살표 함수 . this . 변수선언 . 모듈 . 클래스
-템플릿 리터럴
백틱이다.
그냥 백틱이 아니라 이것도 이름이 있었다(...) 문장부호인 만큼 옛날 부터 있을 거라고 생각했는데 의외로 최신 버전에 추가 된 문법이었다.
이 '템플릿 리터럴'로 인해서 ${----}이런 식의 플레이스 홀더를 사용해 '문자열'과 '표현식'을 함께 넣을 수 있게 되었다고 한다.
사실 이건 제이쿼리에서만 이렇게 쓰이는 줄 알았다. 의외로 JS문법이었구나 이거...
-화살표 함수
익숙하지 않아서 그런지는 몰라도 난 개인적으로 되게 맘에 안드는 녀석이다. ES5 버전 까지는 이 녀석이 없어서 평화로웠을지도 모른다.
아니, 정 function을 압축하고 싶었으면 좀 더 직관적이고 이쁘게 압축하지 왜 이렇게 해놨을까 싶은 생각만 든다.
그냥 맘에 안든다(...)
-this
this의 사용이 간단해 졌다고 한다.
ES5 버전에서는 this에 ()를 통해 바인딩 하거나 변수에 담아서 접근했으나, ES6 버전에서는 this가 자신을 둘러싸고 있는 body를 바라보게 변경 되어, 별도의 바인딩이나 변수 선언을 해 줄 필요가 없어졌다고 한다.
이 역시 이전 버전을 모르고 사용 해서 얼마나 편해진 건지 체감은 잘 안가지만 글로만 설명을 봐도 편해졌겠네 싶은 생각이 크게 든다.
(화살표 함수를 쓰면 함수가 선언 된 스콥에 자동으로 바인딩이 된다고 한다.)
-let
JS의 기본인 변수 선언에 있어 질리도록 써 온 let 또한 ES6 버전에서 나왔다는게 굉장히 의외였다.
처음 부터 let으로 배워서 var를 안써 버릇 하다 보니 이 역시도 얼마나 편해졌는지 체감은 안가지만 편해졌을 거라는 막연한 생각만 드는 부분이긴 하다.
-모듈 / class
최근 리액트를 배우고 있는데, 여기서 부터 사용하게 된 클래스와 import /export 또한 ES6 부터 나온 문법이라고 한다.
