Tính năng mới trong Chrome 72

Trong Chrome 72, chúng tôi đã thêm tính năng hỗ trợ cho:

nhiều tính năng khác!

Tôi là Pete LePage. Hãy cùng tìm hiểu kỹ và xem có gì mới dành cho nhà phát triển trong Chrome 72!

Nhật ký thay đổi

Bài viết này chỉ bao gồm một số điểm nổi bật chính, hãy xem các đường liên kết bên dưới để biết thêm những thay đổi trong Chrome 72.

Trường lớp công khai

Ngôn ngữ đầu tiên của tôi là Java và việc học JavaScript khiến tôi lặp đi lặp lại một chút. Làm cách nào để tạo lớp học? Hay ứng dụng được kế thừa? Còn các thuộc tính và phương thức công khai và riêng tư thì sao? Nhiều bản cập nhật gần đây về JavaScript giúp việc lập trình hướng đối tượng trở nên dễ dàng hơn nhiều.

Bây giờ, tôi có thể tạo các lớp, hoạt động như tôi mong đợi, hoàn chỉnh với các hàm khởi tạo, phương thức getter và phương thức setter, phương thức tĩnh và thuộc tính công khai.

Nhờ V8 7.2 đi kèm với Chrome 72, giờ đây, bạn có thể khai báo các trường của lớp công khai ngay trong phần định nghĩa lớp, nhờ đó không cần thực hiện việc này trong hàm khởi tạo.

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

Chúng tôi đang hỗ trợ các trường lớp riêng tư!

Bạn có thể xem thêm thông tin chi tiết trong bài viết của Mathias về các trường lớp để biết thêm thông tin chi tiết.

API Kích hoạt người dùng

Bạn có nhớ thời điểm các trang web có thể tự động phát âm thanh ngay khi trang tải xong không? Bạn cố nhấn phím tắt tiếng hoặc tìm ra đó là thẻ nào rồi đóng lại. Đó là lý do một số API yêu cầu kích hoạt thông qua cử chỉ của người dùng để có thể hoạt động. Rất tiếc là các trình duyệt xử lý kích hoạt theo nhiều cách.

API kích hoạt người dùng trước và sau khi người dùng tương tác với trang.

Chrome 72 ra mắt tính năng Kích hoạt người dùng phiên bản 2, giúp đơn giản hoá việc kích hoạt người dùng cho mọi API được kiểm soát. API này dựa trên một thông số kỹ thuật mới nhằm tiêu chuẩn hoá cách hoạt động của thao tác kích hoạt trên mọi trình duyệt.

Có một thuộc tính userActivation mới trên cả navigatorMessageEvent, trong đó có hai thuộc tính: hasBeenActiveisActive:

  • hasBeenActive cho biết liệu cửa sổ được liên kết đã từng thấy người dùng kích hoạt trong vòng đời của cửa sổ đó hay chưa.
  • isActive cho biết liệu cửa sổ liên kết hiện có kích hoạt người dùng trong vòng đời hay không.

Bạn có thể xem thêm thông tin chi tiết trong bài viết Tạo tính nhất quán cho việc kích hoạt người dùng trên các API

Bản địa hoá danh sách mọi thứ bằng Intl.format

Tôi rất thích các API Intl, chúng cực kỳ hữu ích trong việc bản địa hoá nội dung sang các ngôn ngữ khác! Trong Chrome 72, có một phương thức .format() mới giúp hiển thị danh sách dễ dàng hơn. Giống như các API Intl khác, API này chuyển gánh nặng sang công cụ JavaScript mà không làm giảm hiệu suất.

Hãy khởi động phiên bản này bằng ngôn ngữ bạn muốn, sau đó gọi format và mã này sẽ sử dụng đúng từ và cú pháp. Nó có thể tạo ra các liên từ – thêm sự tương đương đã bản địa hoá của and (và hãy nhìn vào dấu phẩy oxford đẹp mắt đó). Có thể phân tách bằng cách thêm thành phần tương đương cục bộ của or. Ngoài ra, bằng cách cung cấp thêm một số tuỳ chọn, bạn có thể làm được nhiều việc hơn nữa.

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'

Hãy xem bài đăng Intl.ListFormat API để biết thêm thông tin chi tiết!

Và nhiều kiến thức khác!

Đây chỉ là một vài trong số những thay đổi trong Chrome 72 dành cho nhà phát triển. Tất nhiên, còn rất nhiều thay đổi khác.

  • Chrome 72 thay đổi hành vi của Cache.addAll() để phù hợp hơn với thông số kỹ thuật. Trước đây, nếu có các mục nhập trùng lặp trong cùng một lệnh gọi, thì các yêu cầu sau này sẽ chỉ ghi đè mục đầu tiên. Để khớp với thông số kỹ thuật, nếu có các mục nhập trùng lặp, hệ thống sẽ từ chối bằng InvalidStateError.
  • Yêu cầu biểu tượng trang web hiện do trình chạy dịch vụ xử lý, miễn là URL yêu cầu có cùng nguồn gốc với trình chạy dịch vụ.

Đăng ký

Nếu bạn muốn luôn nhận được thông tin mới nhất về video của chúng tôi, hãy đăng ký kênh YouTube dành cho nhà phát triển Chrome và bạn sẽ nhận được thông báo qua email bất cứ khi nào chúng tôi ra mắt video mới.

Tôi là Pete LePage và ngay sau khi Chrome 73 được phát hành, tôi sẽ có mặt tại đây để cho bạn biết -- những điểm mới trong Chrome!