InfoWorld와 많은 매체에 의하면 ECMAScript 2022가 6-7월에 승인받을 예정이라고 합니다.
사실 저는 이제 갓 JavaScript에 흥미를 가지고 공부하는 햇병아리 수준이라
ECMAScript와 JavaScript의 모든 내용에 대해서 다 공부 하지는 못했습니다만 맨땅에 헤딩하며 알아가는게 42 에꼴의 장점이니, 그 장점을 살려 공부 겸 ECMAScript에 대해서 글을 쓰게 됐습니다.
ECMA International
세상에는 많은 표준화 단체가 있습니다. 정보통신 분야만 보더라도 다음과 같습니다.
•
여러 나라의 표준 제정 단체들의 대표로 이루어진 국제 표준화 기구(ISO)
•
C언어를 제.개정한 미국 국가표준 협회(ANSI)
•
IP 주소나 도메인 관련 업무를 조정하고 기본 프로토콜을 고안하는 국제인터넷주소관리기구(ICANN)
•
잘 알고 있는 무선랜(IEEE 802.11)과 같은 통신에 대한 표준을 제정하는 전기 전자 기술자 협회(IEEE)
•
기타 등등
분야는 다르더라도 어쨌든 제품이 전세계적으로 사용될 수 있도록 표준을 개발하고 발전에 기여하는 단체입니다. 그리고 이러한 단체들 중에는 ECMA International도 있습니다.
이 표준화 기구를 말하려고 앞에서 웅장하게 빌드업을 했습니다.
ECMA International
정보 통신 기술 및 소비자 전자 제품에 대한 표준을 개발하고 발행하는 표준화 기구입니다.
표준화하는 주제가 다양한데 하드웨어, 소프트웨어, 통신, 소비자 전자 제품, 미디어, 스토리 등이 있습니다.
ECMA International에서 개발한 표준은 대표적으로 ECMAScript(TC39)가 있습니다.
이 외에도 C#와 CLI(TC49), NFC(ECMA-340, ISO/IEC 18092), Office Open XML(비공식적으로 Microsoft Open XML이라고도 함, TC45) 등이 있습니다.
TC39
‘ECMA International’에는 여러 기술 위원회(일명 TC)가 있는데 그 중 TC39라는 위원회에서 ECMA-262을 관리합니다.
TC39 위원회에는 TC39 프로세스라고 불리는 절차가 있습니다.
0단계(Stage 0)부터 4단계(Stage 4)까지 있으며, 0단계에서는 ECMAScript 언어를 발전시키기 위한 아이디어(제안)를 받습니다.
이후 위원회의 동의를 얻고 피드백을 받는 등 수많은 과정을 1~3단계에서 거치게 되고, 4단계에 도달하게 되면 ‘해당 프로포절(proposal)은 ECMAScript 표준에 포함될 준비가 되었음’을 의미하게 됩니다.
별다른 이변이 없다면 4단계에 올라온 프로포절(proposal)은 표준에 반영되고, 6-7월에 ECMA 총회에서 새로운 표준 승인을 받게 됩니다.
ECMAScript(ECMA-262)와 JavaScript
계속 앞에서 ECMA-262를 언급 했는데 그 이유는 ECMA-262는 ECMAScript 언어의 표준이며 ECMAScript(스크립트 언어)를 정의하고 있기 때문입니다.
그리고 ECMAScript라는 프로그래밍 언어에는 JavaScript가 속합니다.
•
그 외에도 JScript(Microsoft), ActionScript 등이 있습니다.
즉, JavaScript는 ECMA-262를 표준으로 하는 프로그래밍 언어입니다.
※ ECMAScript를 한 줄로 정리하면 “호스트 환경 내에서 계산(computation)을 수행하고 계산 객체를 조작하기 위한 객체 지향 프로그래밍 언어”라고 할 수 있습니다.
사실 표준인 ECMA-262가 먼저 정의된 다음에 JavaScript가 만들어진 것은 아닙니다.
JavaScript는 넷스케이프에서 처음 만들어졌으며,
표준화의 필요성을 느낀 ‘넷스케이프’에서 ‘ECMA International’에 JavaScript를 제출한 것이라고 합니다.
참고로 JavaScript를 공부할 때 종종 만나는 ES6, ES8 등과 같은 용어 또한 ECMA-262와 연관이 깊습니다.
•
ES : EcmaScript
•
6, 8 등 : 버전
→ ES6 : 2015년에 공개된 버전 (6th edition)
→ ES7 : 2016년에 공개된 버전 (7th edition)
→ ES8 : 2017년에 공개된 버전 (8th edition)
ECMAScript 2022의 예상되는 사양(specification)
역사 이야기는 이제 끝났습니다.
2022년 6-7월에 승인될 ECMAScript 2022의 4단계(Stage4; Finished Proposals)에 올라온 제안은
현재 총 8개의 finished proposals가 있습니다.
앞서 언급한 것과 같이 별다른 이변이 없다면 ECMAScript 2022에 기능이 반영되어 승인을 받게 됩니다.
하지만 승부는 끝날 때까지 끝난 게 아닙니다. 이변이 생길지도 모르는 법입니다.
8개의 finished proposals은 다음과 같습니다. (2022.5.30 기준)
1. Class Fields
•
생성자(constructor)를 호출하지 않고 클래스 자체에서 선언할 수 있습니다.
•
private 클래스 필드를 선언할 수 있습니다. (#기호를 접두사로 사용합니다.)
•
static 키워드를 사용해서 static class field와 private static field를 선언할 수 있습니다.
사실 대부분의 브라우저는 이미 이 기능을 구현하고 있습니다. 다만 표준이 아닐 뿐입니다.
2. RegExp Match Indices
정규표현식(regexp)은 패턴과 플래그를 사용해서 텍스트를 판별할 때 사용합니다.
다음과 같이 사용합니다.
regexp = /pattern/gmi;
// 플래그 g : 패턴과 일치하는 모든 것들을 찾음
// 플래그 i : 대.소문자 구분 없이 검색
// 플래그 m : 다중 행 모드(multiline mode)를 활성화
JavaScript
복사
이번 프로포절(proposal)은 정규 표현식에 플래그로 /d를 추가한다는 내용입니다.
d 플래그는 일치하는 문자열의 시작과 끝 인덱스를 기록할 수 있는 플래그입니다.
3. Top-level await
사실 저는 갓 JavaScript에 관심을 갖고 공부하고 있기 때문에 await 잘 알지 못합니다.
따라서 빠르게 넘어가겠습니다. 그리고 좀 더 열심히 공부하겠습니다..
4. Ergonomic brand checks for Private Fields
선언되지 않은 private 필드에 액세스하려고 하면 예외가 발생합니다.
아래 코드는 brand라는 private 필드가 존재하는지를 확인하고자 하는 코드이지만, 사실 원하는 결과(=true)를 얻지는 못합니다.
class C {
#brand;
static isC(obj) {
return obj.#brand;
}
}
JavaScript
복사
이를 해결하기 위한 방법으로 try~catch를 사용하기도 하는데,
본 제안은 try~catch가 아니라 in이라는 키워드를 추가해서 private 필드가 있는지 확인하는 기능을 구현한다는 내용입니다.
class C {
#brand;
static isC(obj) {
return #brand in obj;
}
}
JavaScript
복사
5. .at()
수년 동안 프로그래머들은 Python처럼 JS 배열의 음수 인덱싱을 수행할 수 있는 기능을 요청했다고 합니다.
즉, 배열의 마지막 요소부터 거꾸로 계산할 때 arr[arr.length - 1]이 아니라 arr[-1]을 쓰기를 간절히 꿈꿔왔다고 합니다.
하지만 대괄호 안에는 음수 인덱스를 넣을 수 없습니다. 정확하게 말하면 넣을 수는 있지만 원하는 값은 나오지 않습니다. (-1을 요소의 인덱스가 아니라 프로퍼티 키로 해석하게 됩니다)
이번에 추가되는 제안(proposal)은 위에서 말한 꿈꿔 왔던 일을 해결했다는 것은 아니고
그에 대한 차선책으로 Array, String, Typed Array에 at() 메서드를 추가해서 음수 인덱싱을 수행할 수 있다는 내용입니다.
덕분에 조금 더 쉬운 방법으로 위의 문제를 해결할 수 있게 됐습니다.
"Hello World!".at(-1); // '!'
"Hello World!".at(-2); // 'd'
"Hello World!".at(-3); // 'l'
JavaScript
복사
6. Accessible Object.prototype.hasOwnProperty
Object.prototype.hasOwnProperty() 보다 더 접근성을 높일 수 있는 Object.hasOwn()을 추가한다는 내용입니다.
일단 hasOwnProperty 메서드는 객체가 특정 프로퍼티를 가지고 있는지에 대해서 확인하고 boolean 값을 반환해주는 메서드입니다. 특정 프로퍼티가 있으면 true, 없으면 false를 반환합니다.
따라서 아래와 같이 사용 할 수 있습니다.
const obj = {
hasOwnProperty: function() {
return false;
},
foo: 'bar'
};
if(Object.prototype.hasOwnProperty.call(obj, 'foo'))
console.log("has property foo");
JavaScript
복사
코드 출처 : Github(@jamiebuilds)
이번에 추가되는 제안(proposal)은 hasOwn 메서드를 도입해서 아래와 같이 단순화할 수 있다는 내용입니다.
if(Object.hasOwn(obj, 'foo'))
console.log("has property foo");
JavaScript
복사
이 역시 표준은 아니었지만 많은 브라우저에 이미 구현되어 있습니다.
7. Class Static Block
class C {
static {
// statements
}
}
JavaScript
복사
정적 초기화 블록(static initialization block)을 도입해서 클래스 정의 평가 시에 초기화한다는 내용입니다.
기존에는 초기화 동안 evaluate statement(평가문)을 사용해야 했거나, 2개의 필드를 초기화할 때 클래스 정의 밖에서 수행 해야했는데
정적 초기화 블록을 사용하면 좀 더 편리하게 초기화할 수 있다고 합니다.
Github에 나와있는 예제에 따르면 다음과 같은 코드가 가능해진다고 합니다.
// without static blocks:
class C {
static x = ...;
static y;
static z;
}
try {
const obj = doSomethingWith(C.x);
C.y = obj.y
C.z = obj.z;
}
catch {
C.y = ...;
C.z = ...;
}
// with static blocks:
class C {
static x = ...;
static y;
static z;
static {
try {
const obj = doSomethingWith(this.x);
this.y = obj.y;
this.z = obj.z;
}
catch {
this.y = ...;
this.z = ...;
}
}
}
JavaScript
복사
출처 : Github(@rbuckton)
8. Error Cause
예기치 않은 동작을 진단하기 위해서는 오류를 포착하고 오류 메시지, 오류 인스턴스 속성과 같은 컨텍스트 정보와 오류를 함께 던져서 문제를 해결하는게 일반적인 방법입니다.
try…catch 등을 이용해서 아래와 같이 사용합니다.
function doWork() {
try {
doSomeWork();
} catch (err) {
throw new CustomError('Some work failed', err);
}
doMoreWork();
}
/* 코드 출처 : Chrome v8.dev(https://v8.dev/features/error-cause) */
JavaScript
복사
이번에 추가되는 기능은 좀 더 구체적인 에러 정보를 확인하기 위해서 cause 프로퍼티를 제공합니다.
사실 Firefox와 Chrome 등에서는 이미 사용할 수 있는 기능입니다. 다만 ECMAScript의 표준(ECMA-262)에는 이 동작이 정의되어 있지 않았다고 하네요.
위와 같이 총 8개의 제안입니다.
대부분의 기능이 이미 많은 브라우저에 구현되어 있는 기능입니다.
신기하다고 생각할 부분이 없긴 하지만 그래도 곧 승인된다고 해서 한번 살펴봤습니다.
끝
ECMA의 역사와 TC39의 제안(proposal)들을 읽다보니 전 나름 JS가 신기하고 재미있다고 느껴졌습니다.
다른 분들도 JavaScript를 재미있게 공부했으면 좋겠습니다.
p.s. 음수 인덱싱은 과연 Python처럼 구현이 가능해질 것인지.. 정말 궁금합니다.
