지난번 2022년을 맞이하여 Ecmascript2021년 버전을 보았다.
⏤ 그동안 JS 기존 문법을 배우느라 급급하여 22년도였지만 21년 버전도 처음 보는 내용이었다...
ECMASCRIPT 2021 버전 요약본 : 2020년 이후, 자바스크립트는 어떤 것이 변경되었을까
요약본에 자바스크립트 종말론을 보고 꿈에서도 자바스크립트가 없어지는 꿈을 꾸었다 .. 악몽 .. 아직 13년정도 남았으니까 자바스크립트 명세를 열심히 보기로 한다.
ECMASCRIPT 2022는 아직 릴리즈 되지 않았지만
TC39 finished-proposal 에서 예상되는 최신 명세를 볼 수 있다.
TC39 discourse 에서 자바스크립트를 사용하는 모든 사람들이 명세에 대한 제안과 질문을 할 수 있다.
나도.. 자바스크립트 언어를 다지는 contributor가 될 수 있는 기회 ?!
보글보글 김칫국
22 이전 class 문법은 명시적으로 public이라고 선언되지 않았지만 모든 멤버 변수가 public 했다.. ( java를 쓰는 친구는 자바스크립트가 class에 protected, static이 없는 해괴망측한 언어라고 표현했다. 🥲 )
클래스 멤버 변수 선언시 constructor 내에서 선언했다.
이제 우리도. private 이용이 가능하다.
private
는 # 을 붙여서 사용하게끔 해준다! class B {
#hidden = 0;
m() {
return this.#hidden;
}
}
static
으로 프로퍼티 지정도 가능해졌습니다 ! 우리도 이제 명시적으로 캡슐화가 가능한 놈들이다.
그냥 level 도 아니고 top level... ! !
async function hello() {
return greeting = await Promise.resolve("Hello");
};
hello().then(alert);
원래 async
함수와 await
을 짝꿍이었습니다. await 을 쓰기 위해서는 async 함수 내에서 사용할 수 있었는데 이제 await 을 최상단에서 사용할 수 있게 되었습니다.
import { process } from "./some-module.mjs";
const dynamic = import(computedModuleSpecifier);
const data = fetch(url);
export const output = process((await dynamic).default, await data);
이렇게 async 없이도 await 를 쓸 수 있게 되었답니다.
let hasOwnProperty = Object.prototype.hasOwnProperty
if (hasOwnProperty.call(object, "foo")) {
console.log("has property foo")
}
이렇게 .. 길던 코드를
if (Object.hasOwn(object, "foo")) {
console.log("has property foo")
}
이렇게 짧게 쓸 수 있도록 하여 접근성을 개선하였습니다.
Object.prototype.hasOwnProperty 의 쓰임새 .. (?)
const object1 = {}; object1.property1 = 42; console.log(object1.hasOwnProperty('property1')); // expected output: true
단어 그대로 객체 내에 프로퍼티가 있는지 true/false 로 리턴해줍니다.
원래 stage 3에 있다가 4로 올라온 아이입니다.
try {
await doJob();
} catch (e) {
console.log(e);
console.log('Caused by', e.cause);
}
// Caused by TypeError: Failed to fetch
catch(e){} 에서 console.log(e) 를 하게 되면 에러의 종류가 나왔는데 이제 에러의 이유가 같이 출력될 수 있게끔 도와줍니다. 에러를 조금 더 상세하게 볼 수 있을 것 같습니다 💪🏻
아직 호환되지 못하는 웹이 많을 수 있다.
우리는, arr=[0,1,2,3,4] 라는 배열이 있을 때 4라는 값에 접근하고 싶다면 index 값이 4라는 것을 알고 arr[4] 를 통해 접근할 수 있다. 그러나, 마지막 index 값을 알지 못한다면 어떻게 될까?
아마, arr[arr.length-1]
로 접근을 해야할 것이다. 왜 arr[-1] 로 접근할 수 없을까? 라는 질문에서 부터 시작된 명세이다. 이제는 String과 Array의 .at()
메서드를 통해 음수 인덱스에 접근이 가능해진다.
const arr=[0,1,2,3,4];
arr[-1] // index 음수는 없으니까 undefined
arr.at(-1) // 4
아직 한글로 해석되어 있는 곳이 많지 않고 명세 설명이 길다보니 영어가 지렁이처럼 꿀렁거린다.