在 Chrome 72 中,我们添加了对以下内容的支持:
- 现在,在 JavaScript 中创建公共类字段更加简洁。
- 您可以使用新的 User Activation API 查看网页是否已激活
- 借助
Intl.format()
API,您可以更轻松地本地化列表。
还有更多功能!
我是 Pete LePage。我们来深入了解一下 Chrome 72 中面向开发者的新功能!
更新日志
本文仅介绍了一些主要亮点,如需了解 Chrome 72 中的其他变更,请访问以下链接。
公共类字段
我的第一门语言是 Java,学习 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
我们正在开发对私有类字段的支持!
如需了解详情,请参阅 Mathias 关于类字段的文章。
User Activation API
还记得网站在网页加载后会自动播放声音吗? 您会急忙按静音键,或者找出是哪个标签页,然后关闭它。 因此,某些 API 需要先通过用户手势激活,然后才能正常运行。很抱歉,浏览器处理激活的方式各不相同。
Chrome 72 引入了 User Activation v2,该工具可简化所有受限 API 的用户激活流程。它基于一项新的规范,旨在标准化所有浏览器中的激活方式。
navigator
和 MessageEvent
中都有一个新的 userActivation
属性,该属性包含两个属性:hasBeenActive
和 isActive
:
hasBeenActive
表示关联的窗口在其生命周期内是否曾发生过用户激活。isActive
表示关联的窗口当前生命周期中是否有用户激活。
如需了解详情,请参阅在多个 API 中使用户激活保持一致
使用 Intl.format
本地化事物列表
我喜欢 Intl
API,它们非常有助于将内容本地化为其他语言!Chrome 72 中新增了 .format()
方法,可简化列表的渲染。与其他 Intl
API 一样,它会将负担转移到 JavaScript 引擎,而不会牺牲性能。
使用所需的语言区域对其进行初始化,然后调用 format
,它将使用正确的字词和语法。它可以进行连词处理,即添加与 and 对等的本地化内容(请看这些美丽的牛津英文标点符号)。它可以执行析取运算,即添加本地等效于 or 的运算。通过提供一些额外的选项,您还可以执行更多操作。
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
进行拒绝。 - 只要请求网址与服务工作器位于同一源,服务工作器现在就会处理对 Favicon 的请求。
订阅
如需及时了解我们的最新视频,请订阅我们的 Chrome Developers YouTube 频道,这样每当我们发布新视频时,您就会收到电子邮件通知。
我是 Pete LePage,Chrome 73 发布后,我会立即为您介绍 Chrome 中的新变化!