"io19" 태그로 연결된 13개 게시물개의 게시물이 있습니다.

여러 제안이 기존 JavaScript 클래스 문법을 새로운 기능으로 확장합니다. 이 글은 V8 v7.2와 Chrome 72에서 새로운 공용 클래스 필드 문법, 그리고 곧 출시될 비공용 클래스 필드 문법에 대해 설명합니다.

IncreasingCounter라는 이름의 클래스 인스턴스를 생성하는 코드 예시는 다음과 같습니다:

const counter = new IncreasingCounter();
counter.value;
// 로그 출력: '현재 값을 가져오는 중!'
// → 0
counter.increment();
counter.value;
// 로그 출력: '현재 값을 가져오는 중!'
// → 1

value 접근 시 코드를 실행한 후 결과를 반환합니다(즉, 메시지가 로그에 출력됩니다). 그렇다면 이 클래스를 JavaScript로 어떻게 구현할 수 있을까요? 🤔

ES2015 클래스 문법​

IncreasingCounter를 ES2015 클래스 문법을 사용하여 구현하는 방법은 다음과 같습니다:

class IncreasingCounter {
  constructor() {
    this._count = 0;
  }
  get value() {
    console.log('현재 값을 가져오는 중!');
    return this._count;
  }
  increment() {
    this._count++;
  }
}

클래스는 value getter와 increment 메소드를 프로토타입에 설치합니다. 더 흥미로운 것은, 클래스가 생성자인데, 이는 인스턴스 속성 _count를 생성하고 초기값을 0으로 설정합니다. 현재는 언더스코어 접두사를 사용하여 _count를 소비자가 직접 사용하지 않도록 권장합니다. 하지만 이것은 단지 관례일 뿐이며, 언어에 의해 특별한 의미가 부여된 “비공용” 속성은 아닙니다.

현대적인 웹 애플리케이션은 종종 "어제", "42초 전", "3개월 후"와 같은 구문을 사용하여 전체 날짜와 타임스탬프 대신 사용합니다. 이러한 _상대적인 시간 형식 값_은 매우 일반적으로 사용되어 여러 인기 있는 라이브러리에서 이러한 값을 로컬화된 형식으로 출력하는 유틸리티 함수를 구현하고 있습니다. (예로는 Moment.js, Globalize, 그리고 date-fns 등이 있습니다.)

BigInt는 JavaScript에서 임의 정밀도로 정수를 표현할 수 있는 새로운 숫자형 원시 자료형입니다. BigInt를 사용하면 Number의 안전한 정수 범위를 초과하는 큰 정수를 안전하게 저장하고 연산할 수 있습니다. 이 글은 몇 가지 사용 사례를 살펴보고 BigInt와 Number를 비교하여 Chrome 67에서 추가된 새로운 기능을 설명합니다.