ECMAScript 6 Harmony 를 네 브라우저에 돌려봐라!

출처: http://blog.hazard.kr/archives/223

ECMAScript 6 Harmony 를 네 브라우저에 돌려봐라!

나 참.. 기분 존나 나쁘네.

뭐? CoffeeScript? TypeScript? 어쩌고 저째? 자바스크립트가 죽을 거라고?

난 동의 안한다. 제아무리 자바스크립트를 편하게 만들어도 오리지날이다. 결국 그들도 자스로 움직인다. 제아무리 편해도.

스칼라가 결국 자바에서 돌아가기 위해 자바 코드로 생성해서 컴파일 하는 것처럼 말이다.

튜닝의 끝은 순정이란 말이 괜히 나오는게 아니지.

그래서 소개한다. 니 브라우저에 직접 ECMA 6 을 적용할 기회를 내가 선사해 주겠다. 2가지 프로젝트가 있다.

1. Traceur

구글신은 미쳤다. 이번에 소개할 피로젝트는 자바 2명 타요가 아닌 외계인 2명 타요 해서 ECMA 6을 몸소 체험할 수 있는

Traceur 를 소개한다.

프로젝트 페이지는 https://github.com/google/traceur-compiler

이 스크립트 컴파일러는 ES6 을 당신 브라우저에 돌릴 수 있게 한다.

일단 IE 8은 안된다. 쳇. 최소한 8이라도 지원해주지.

크롬과 불여우는 일단 된다. 올ㅋ

Traceur 가 지원하는 ECMA 6 기능이다.

• 클래스
• 모듈
• 열거문과 For Of 반복문
• 생성기
• 약속(프로미즈)
• 블록 단위 바인딩
• 통합 할당
• 인자 기본값
• 가변 인자
• 가변 처리자
• 단축 객체 초기자
• 속성 메서드 할당

일단 여태 나오고 알려진 것들을 지원한다.

하지만 이 ES6 하모니를 쓸 때 몇가지 주의할 점이 있다.

알다시피 ES6은 확정된 표준이 아니다. 특히 클래스와 모듈이 그 대표적인데, 이들이 어떻게 바뀔지는 장담을 못하겠다.

제발 안바뀌길 바래라.

뭐.. 그래봐야 기반 스크립트 (타입스크립트 등) 또한 아직까지 안정화된 버전을 내놓지 못하고 있기 때문에

물론 커피스크립트는 상당히 안정화 되고 쓰는 사람 많은거 안다.

근데 뭐가 좋다 말을 못하겠지만, 그래도 그런 스크립트는 표준에 넣지 못할 것이다.

난 커피스크립트가 자바의 스칼라처럼 생각하지만, 그래도 스칼라도 많이 쓰지 않는가? 물론 갈라파고스 한국은 빼고.

난 표준을 만들고 따르는 주의자긴 하지. 자바스크립트는 아직까지는 강력하기 때문에. 단지 좀 귀찮고 짱나서 그렇지.

어쨌든, ES6 을 직접 체험해보고자 한다면, 이 컴파일러를 이용해 제작된 ES6Fiddle 을 사용하라.

http://www.es6fiddle.net/

ECMAScript 6 이 어떻게 돌아가는지 알 수 있을 것이다.

2. continuum 

그에 비해 이 ES6 컴파일러는 커뮤니티의 참여로 만들어졌다. 그다음 낫고, IE 8부터 지원해주기 때문에 우왕굳.

프로젝트 사이트는 https://github.com/Benvie/continuum

체험 사이트는 http://benvie.github.io/continuum/

현재 구현된 기능들이다.

• 통합 할당 및 인자
• 가변 처리자 및 배열 초기자
• 가변 인자
• 클래스와 상속
• 화살표식 함수(람다식) (.NET 의 람다식과 동일한 형식)
• 블록 단위 변수
• 새로운 Math 함수
• 새로운 Object 함수
• 새로운 String 함수
• concise methods in object literals
• 열거 및 삭제 가능한 프로토타입
• Map, Set, 그리고 WeakMap (가비지 컬렉션이 현실화되지는 않았음)
• 열거자와 for…of 반복문
• 템플릿
• 모듈과 imports, exports
• 내장 ‘@std’ 모듈 module std = '@std' 또는 import call from '@function'
• 생성기
• 프록시와 리플렉션
• Symbols with syntactic @name support
• 형식화된 배열Typed Arrays
• Object.observe (es-next/es7)
• 인자 기본값
• 꼬리물기 호출 최적화
• 배열 초기화 식 (부분 지원)

아래 기능은 아직 구현이 안되어 있으며 추후 지원될 예정이라 한다.

• 생성기 식
• 이진 데이터 api (structs, etc.)
• 프로미즈 (내가 Feature request 했음.)

물론 프로미즈같은 경우 promisejs 또는 q 로 해결은 가능하기 때문에 커버는 해줄만 하다.

ECMA 6 기능에 목이 말랐다면 지금 바로 체험하라.

아참, 마지막으로 ES6의 새로운 기능을 한글로 잘 정리한 위키 페이지가 있어 이걸 소개하고 쿨하게 끝내겠다.

http://wiki.codekin.com/index.php/ECMAScript_%ED%95%98%EB%AA%A8%EB%8B%88

끝이다.

추신 업데이트 사항 : Traceur 외에 나머지 ES6 컴파일러는 몇달동안 활동이 없다. 그냥 Traceur 써라. 진자끝.

COMPOSITE / 2014년 2월 25일 / 미분류
태그:ECMA, ECMA 6, ECMASCRIPT, ECMASCRIPT 6, ES, ES6, HARMONY, JAVASCRIPT, JAVASCRIPT 1.7, JS, PROMISE, PROTOTYPE, 자바스크립트, 자스, 프로미즈

1. ECMAScript 6의 generator :: Outsider's Dev Story
2. Thoughts on ECMAScript 6 and new syntax | NCZOnline
3. ECMAScript 하모니 - codeKIN
4. 5 Great Features in EcmaScript 6 (ES6 Harmony) – Wintellect ...
5. ECMAScript 6 support in Mozilla - JavaScript | MDN
6. ECMAScript 6의 generator :: Outsider's Dev Story
7. JavaScript Next - ES6 Harmony - Sankha Narayan Guria
8. Thoughts on ECMAScript 6 and new syntax | NCZOnline
9. Jet Brains tunes JavaScript IDE for Harmony | JavaWorld
10. 5 Great Features in EcmaScript 6 (ES6 Harmony) – Wintellect ...

Published By BreadTrend