Javascript ES2022 정리

1. Private

함수나 변수 앞에 #을 붙이면 private가 된다. 

class Juice {
	#count = 0;
	#make() {}
}

 

2. Static 

static 키워드를 통해 static 변수, 함수를 만들 수 있으며

private와 같이 사용할 수 있다. 

class Circle {
	static PI = 3.14;
}

 

3. await

async 없이 await를 사용할 수 있고, 그래서 top-level에서도 사용할 수 있다.

const connection = await dbConnector();

 

4. error의 원인 전달

try {
	work();
} catch(err) {
	new Error("failed", { cause: err })
}

 

5. at

at을 통해서 간편하게 배열에 접근할 수 있다.

기존에 []을 통해서도 가능했지만, at을 통해 맨 마지막 원소 접근이 쉬워졌다.

const arr = ["a", "b", "c", "d"];
arr.at(-1);

 

5. Object.hasOwn

객체 내에 property가 존재하는지 확인할 수 있다 .

const people = {
	name: "abc",
    address: "seoul",
};

console.log(Object.hasOwn(people, 'address')); // true
console.log(people.hasOwnProperty('address')); // true

 

6. Indices

기존

const fruits = 'Fruits: apple, applemango, orange';
const regex = /(apple)/g

const matches = [...fruits.matchAll(regex)];
console.log(matches[0]) // ['apple', 'apple', index:8, input: 'Fruits: apple, applemango, orange', groups: undefined'

es2022

const fruits = 'Fruits: apple, applemango, orange';
const regex = /(apple)/gd

const matches = [...fruits.matchAll(regex)];
console.log(matches[0]) // ['apple', 'apple', index:8, groups: undefined', indices: [[8, 13], [8, 13]]

 

regex에서 d를 추가하고 console을 찍어보면

indices 항목이 추가되었음을 확인할 수 있다.

기존에는 시작과 끝의 index가 나타나지 않았는데 es2022에서는 indices를 통해 확인할 수 있다.