BigInt는 JavaScript에서 임의 정밀도로 정수를 표현할 수 있는 새로운 숫자형 원시 자료형입니다. BigInt를 사용하면 Number의 안전한 정수 범위를 초과하는 큰 정수를 안전하게 저장하고 연산할 수 있습니다. 이 글은 몇 가지 사용 사례를 살펴보고 BigInt와 Number를 비교하여 Chrome 67에서 추가된 새로운 기능을 설명합니다.
try 문장의 catch 절은 바인딩을 필요로 했습니다:
try {
doSomethingThatMightThrow();
} catch (exception) {
// ^^^^^^^^^
// 우리는 바인딩 이름을 지정해야 하지만, 사용하지 않을 수도 있습니다!
handleException();
}
ES2019에서는 catch를 이제 바인딩 없이 사용할 수 있습니다. 이는 예외를 처리하는 코드에서 exception 객체가 필요하지 않은 경우 유용합니다.
try {
doSomethingThatMightThrow();
} catch { // → 바인딩 없음!
handleException();
}
catch 바인딩 지원ES2019에서는 String.prototype.trimStart() 및 String.prototype.trimEnd()을 소개합니다:
const string = ' hello world ';
string.trimStart();
// → 'hello world '
string.trimEnd();
// → ' hello world'
string.trim(); // ES5
// → 'hello world'
이 기능은 이전에 비표준 메서드인 trimLeft()와 trimRight()를 통해 제공되었습니다. 이러한 메서드는 새로운 메서드와의 호환성을 위해 여전히 별칭으로 남아 있습니다.
const string = ' hello world ';
string.trimStart();
// → 'hello world '
string.trimLeft();
// → 'hello world '
string.trimEnd();
// → ' hello world'
string.trimRight();
// → ' hello world'
string.trim(); // ES5
// → 'hello world'
Function.prototype.toString()이 이제 공백과 주석을 포함한 소스 코드 텍스트의 정확한 조각을 반환합니다. 이전 동작과 새로운 동작을 비교한 예제를 아래에서 확인하세요:
Dynamic import()는 정적 import와 비교하여 새로운 기능을 해제하는 함수 같은 형태의 import를 도입합니다. 이 기사에서는 두 가지를 비교하고 새로운 내용을 개괄적으로 소개합니다.
Promise.prototype.finally는 프로미스가 _정산_될 때(즉, 완료 또는 거부됨)에 호출될 콜백을 등록할 수 있도록 합니다.
페이지에 표시할 데이터를 가져오고 싶다고 상상해보세요. 그리고 요청이 시작될 때 로딩 스피너를 표시하고 요청이 완료되면 숨기고 싶습니다. 문제가 발생하면 대신 오류 메시지를 표시합니다.
const fetchAndDisplay = ({ url, element }) => {
showLoadingSpinner();
fetch(url)
.then((response) => response.text())
.then((text) => {
element.textContent = text;
hideLoadingSpinner();
})
.catch((error) => {
element.textContent = error.message;
hideLoadingSpinner();
});
};
Iñtërnâtiônàlizætiøn은 어렵습니다. 복수형 처리는 언뜻 간단해 보이는 문제들 중 하나지만, 각 언어마다 고유한 복수형 규칙이 있다는 것을 깨닫게 되면 복잡해질 수 있습니다.
영어 복수형의 경우 가능한 결과는 두 가지뿐입니다. “cat”이라는 단어를 예로 들어보겠습니다:
'one' 형태로, 영어에서는 단수형으로 알려져 있습니다.'other' 형태(유일한 다른 형태)로, 영어에서는 복수형으로 알려져 있습니다.새롭게 제공되는 Intl.PluralRules API는 주어진 숫자를 기준으로 선택한 언어에서 어떤 형태를 적용해야 하는지 알려줍니다.
const pr = new Intl.PluralRules('en-US');
pr.select(0); // 'other' (예: '0 cats')
pr.select(0.5); // 'other' (예: '0.5 cats')
pr.select(1); // 'one' (예: '1 cat')
pr.select(1.5); // 'other' (예: '0.5 cats')
pr.select(2); // 'other' (예: '0.5 cats')
_객체 나머지 및 펼침 속성_을 논의하기 전에, 기억을 되살리고 매우 유사한 기능을 상기해봅시다.
익숙한 ECMAScript 2015는 배열 구조 분해 할당을 위한 _나머지 요소_와 배열 리터럴을 위한 _펼침 요소_를 도입했습니다.
// 배열 구조 분해 할당을 위한 나머지 요소:
const primes = [2, 3, 5, 7, 11];
const [first, second, ...rest] = primes;
console.log(first); // 2
console.log(second); // 3
console.log(rest); // [5, 7, 11]
// 배열 리터럴을 위한 펼침 요소:
const primesCopy = [first, second, ...rest];
console.log(primesCopy); // [2, 3, 5, 7, 11]
그렇다면 새로워진 점은 무엇일까요? 제안서에 따르면 객체 리터럴을 위한 나머지 및 펼침 속성도 사용할 수 있습니다.
// 객체 구조 분해 할당을 위한 나머지 속성:
const person = {
firstName: 'Sebastian',
lastName: 'Markbåge',
country: 'USA',
state: 'CA',
};
const { firstName, lastName, ...rest } = person;
console.log(firstName); // Sebastian
console.log(lastName); // Markbåge
console.log(rest); // { country: 'USA', state: 'CA' }