Chrome 72에서는 다음 지원이 추가되었습니다.
- 이제 JavaScript에서 public 클래스 필드를 훨씬 더 깔끔하게 만들 수 있습니다.
- 새 User Activation API를 사용하여 페이지가 활성화되었는지 확인할 수 있습니다.
Intl.format()API를 사용하면 목록을 더 쉽게 현지화할 수 있습니다.
이 외에도 더 많은 기능이 있습니다.
저는 피트 르페이지입니다. Chrome 72에서 개발자를 위해 새롭게 제공되는 기능을 자세히 살펴보겠습니다.
변경 로그
이 도움말에서는 주요 변경사항 중 일부만 다룹니다. Chrome 72의 추가 변경사항은 아래 링크를 참고하세요.
공개 클래스 필드
제가 처음 배우는 언어는 자바였고, JavaScript를 배우면서 약간의 루프가 생겼습니다. 수업을 어떻게 만들었나요? 아니면 상속인가요? 공개 및 비공개 속성과 메서드는 어떻게 되나요? JavaScript의 최근 업데이트 중 다수를 통해 객체 지향 프로그래밍을 훨씬 더 쉽게 할 수 있습니다.
이제 생성자, getter 및 setter, 정적 메서드, 공개 속성으로 완성된 예상대로 작동하는 클래스를 만들 수 있습니다.
Chrome 72와 함께 제공되는 V8 7.2 덕분에 이제 클래스 정의에서 직접 공개 클래스 필드를 선언할 수 있으므로 생성자에서 선언할 필요가 없습니다.
class Counter {
_value = 0;
get value() {
return this._value;
}
increment() {
this._value++;
}
}
const counter = new Counter();
console.log(counter.value);
// → 0
counter.increment();
console.log(counter.value);
// → 1
비공개 클래스 필드 지원이 진행 중입니다.
자세한 내용은 마티아스의 클래스 필드 도움말을 참고하세요.
User Activation API
페이지가 로드되는 즉시 사이트에서 소리를 자동으로 재생할 수 있었던 때가 있었습니다. 음소거 키를 누르거나 어떤 탭인지 파악하고 닫으려고 애씁니다. 따라서 일부 API는 작동하기 전에 사용자 동작을 통한 활성화가 필요합니다. 안타깝게도 브라우저마다 활성화를 다르게 처리합니다.
Chrome 72에서는 모든 제한된 API의 사용자 활성화를 간소화하는 User Activation v2를 도입했습니다. 이 API는 모든 브라우저에서 활성화가 작동하는 방식을 표준화하는 것을 목표로 하는 새로운 사양을 기반으로 합니다.
navigator와 MessageEvent 모두에 새로운 userActivation 속성이 있으며, 여기에는 두 가지 속성 hasBeenActive와 isActive가 있습니다.
hasBeenActive는 연결된 창의 수명 주기에서 사용자가 활성화된 적이 있는지를 나타냅니다.isActive는 연결된 창의 수명 주기에 현재 사용자 활성화가 있는지 나타냅니다.
자세한 내용은 API 전체에서 일관된 사용자 활성화 만들기를 참고하세요.
Intl.format를 사용하여 항목 목록 현지화
Intl API가 정말 좋습니다. 콘텐츠를 다른 언어로 현지화하는 데 큰 도움이 됩니다. Chrome 72에는 목록을 더 쉽게 렌더링할 수 있는 새로운 .format() 메서드가 있습니다. 다른 Intl API와 마찬가지로 성능을 저하시키지 않으면서 부담을 JavaScript 엔진으로 전환합니다.
원하는 언어로 초기화한 다음 format를 호출하면 올바른 단어와 문법이 사용됩니다. and의 현지화된 해당 값을 더하는 접속사를 실행할 수 있습니다 (멋진 옥스포드 쉼표도 살펴보세요). 불연결을 실행할 수 있습니다. 즉, 또는의 로컬 등가 항목을 추가합니다. 추가 옵션을 제공하면 더 많은 작업을 할 수 있습니다.
const opts = {type: 'disjunction'};
const lf = new Intl.ListFormat('fr', opts);
lf.format(['chien', 'chat', 'oiseau']);
// → 'chien, chat ou oiseau'
lf.format(['chien', 'chat', 'oiseau', 'lapin']);
// → 'chien, chat, oiseau ou lapin'
자세한 내용은 Intl.ListFormat API 게시물을 확인하세요.
그 외에도 다양한 기능 제공
이는 Chrome 72에서 개발자를 위해 변경된 사항 중 일부에 불과하며, 물론 그 외에도 많은 변경사항이 있습니다.
- Chrome 72에서는 사양에 더 잘 맞게
Cache.addAll()의 동작을 변경합니다. 이전에는 동일한 호출에 중복 항목이 있는 경우 이후 요청이 첫 번째 항목을 덮어썼습니다. 사양에 맞추기 위해 중복 항목이 있으면InvalidStateError로 거부됩니다. - 이제 요청 URL이 서비스 워커와 동일한 출처에 있는 한 서비스 워커가 favicon 요청을 처리합니다.
구독
관련 동영상을 놓치지 않고 확인하고 Chrome 개발자 YouTube 채널을 구독하세요. 새 동영상이 게시될 때마다 이메일 알림을 받게 됩니다.
저는 펫 르페이지입니다. Chrome 73이 출시되는 대로 Chrome의 새로운 기능을 바로 알려드리겠습니다.