항해 2주차 WIL

- Node.js, React: JavaScript의 ES란?, ES5/ES6 문법 차이

 

ECMA Script(ES)?

자바스크립트는 1990년대 Netscape 회사의 Brendan Eich 라는 사람에 의해 최초 개발되었다.

자바스크립트가 잘 되자, MS에서 Jscript라는 언어를 개발해 IE에 탑재하였는데,

이 두 스크립트가 너무 제각각이라, 표준이 필요하게 되었다.

 

표준을 위해 자바스크립트를 ECMA(European Computer Manufactures Association)라는 정보와 통신시스템의 비영리 표준 기구에 제출하였고 표준에 대한 작업을 ECMA-262란 이름으로 1996년 11월에 시작해 1997년 6월에 채택되었다.

종종 보게되는 ES란 ECMA Script의 약자다. ES5는 ECMA Script5의 규격을 따른다고 생각하면 된다.

 

• JavaScript와 ECMA Script

둘 다 뒤에 Script라는 키워드가 붙지만, 자바스크립트는 언어이고, ECMA 스크립트는 규격, 표준 즉, 스펙을 말한다.

• ES 버전에 따른 특징

ES는 최초 표준이 정의된 이후, 세월과 함께 발전해왔다. 각 버전에 따라 어떤 특징들이 있는지 정리해보자.

 

(1) S3(1999)
우리가 흔히 말하는 자바스크립트이다.

함수 단위의 스코프, 호이스팅, 모듈화 미지원, 프로토타입, 클로저 등등 자바스크립트의 기본적인 특징들이 들어있다. 
대부분의 브라우저에서 지원하고, IE8까지 크로스브라우징하는 환경이면 ES3를 쓰고 있다고 생각하면 된다.

 

(2) ES5(2009)
4는 너무 급변하는 내용이 있었던지 거절되고, 그 후에 점진적인 개선을 하고자 5가 나왔다.

기본적으로 IE9부터 본격적으로 지원을 하지만 es5-shim을 사용하면 하위 버전에서도 특정 기능들을 지원해준다.

5부터 추가된 기능으로는 다음과 같다.

1. 배열과 관련해서 새로운 메소드들이 생겼는데 대표적으로 forEach, map, filter, reduce, some, every와 같은 메소드가 생겼다. 이 메소드들은 개발자가 반복 횟수나 조건을 잘못 입력하는 등의 실수를 줄여주는 효과가 있다.
2. object에 대한 getter/setter 지원
3. 자바스크립트 strict 모드 지원(더욱 세심하게 문법 검사를 한다.)
4. JSON 지원(과거에는 XML을 사용하다가, json이 뜨면서 지원하게 되었다.)
5. bind() 메소드가 생겼다. (this를 강제로 bind 시켜주는 메소드다.)

 

(3) ES 2015(ES6)
원래는 ES6 였는데 사람들이 끝자리인 6과 2016년을 연관짓는 습성 때문에 2016년에 나온걸로 착각을 해서인지 ES2015로 바꾼 것 같다

 

추가된 기능으로는 다음과 같다.

1. let, const 키워드 추가
기존의 변수는 함수 scope를 가진 var 키워드를 이용하여 선언하였다.

때문에 block scope를 가진 let과 const 키워드를 추가하였다.

기존에는 상수형 키워드가 없어 CONST_TEST와 같이 대문자로 상수임을 표시했다면,

ES 6부터 const 키워드가 추가되어 값의 변경을 통제한다.

2. arrow 문법 지원

arrow 문법은 두 가지의 장점을 제공한다.

첫 번째는 익숙하면 편하고 간결해진 코드를 작성할 수 있다.

두 번째는 this를 바인딩하지 않는다.(다르게 말하면, this는 해당 scope의 this와 같다.)

 

간단히,

ES5와 ES6의 대표적인 차이점으로 아래 항목들임.

• 템플릿 리터럴
• 화살표 함수
• this
• 변수선언
• 모듈
• 클래스

 

참고해볼 블로그

https://doozi0316.tistory.com/entry/JavaScript-ECMAScript%EB%9E%80-ES5%EC%99%80-ES6%EC%9D%98-%EC%B0%A8%EC%9D%B4var-const-let-%ED%99%94%EC%82%B4%ED%91%9C-%ED%95%A8%EC%88%98-class

[JavaScript] ECMAScript란? ES5와 ES6의 차이