Chrome 72 では、以下をサポートしました。
- JavaScript で公開クラス フィールドを作成するのがはるかに簡単になりました。
- ページが有効になっているかどうかは、新しい User Activation API で確認できます。
Intl.format()API を使用すると、リストのローカライズが大幅に容易になります。
他にもさまざまな機能があります。
Pete LePage と申します。Chrome 72 のデベロッパー向けの新機能について詳しく見てみましょう。
変更履歴
以下に示すのは主な変更点の一部です。Chrome 72 のその他の変更については、以下のリンクをご覧ください。
公開クラス フィールド
最初に学んだ言語は Java だったので、JavaScript を学ぶのは少し大変でした。クラスを作成した方法または継承ですか？公開プロパティと非公開プロパティ、公開メソッドと非公開メソッドはどうなりますか？JavaScript の最近のアップデートの多くは、オブジェクト指向プログラミングを大幅に容易にしています。
コンストラクタ、ゲッター、セッター、静的メソッド、パブリック プロパティを備え、想定どおりに動作するクラスを作成できるようになりました。
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
非公開クラス フィールドのサポートは現在開発中です。
詳しくは、Mathias のクラス フィールドに関する記事をご覧ください。
User Activation API
ページが読み込まれるとすぐにサイトが音声を自動的に再生していた時代を覚えていますか？慌ててミュートキーを押すか、どのタブだったかを特定して閉じます。 そのため、一部の API では、機能させる前にユーザー操作による有効化が必要になります。残念ながら、ブラウザによって有効化の処理方法が異なります。
Chrome 72 では、すべてのゲート付き API のユーザー アクティベーションを簡素化する User Activation v2 が導入されます。これは、すべてのブラウザで有効化の仕組みを標準化することを目的とした新しい仕様に基づいています。
navigator と MessageEvent の両方に新しい userActivation プロパティがあり、hasBeenActive と isActive の 2 つのプロパティがあります。
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 がサービス ワーカーと同じオリジンにある限り、ファビコンのリクエストはサービス ワーカーによって処理されるようになりました。
登録
最新の動画情報を受け取るには、Chrome デベロッパーの YouTube チャンネルにチャンネル登録してください。新しい動画が公開されるとメール通知が届きます。
担当の Pete LePage です。Chrome 73 がリリースされ次第、Chrome の新機能についてお知らせします。