ฟีเจอร์ใหม่ใน Chrome 72

Pete LePage

ใน Chrome 72 เราได้เพิ่มการรองรับสิ่งต่อไปนี้

  • ตอนนี้การสร้างช่องคลาสสาธารณะใน JavaScript เรียบร้อยขึ้นมาก
  • คุณดูได้ว่าหน้าเว็บเปิดใช้งานแล้วหรือยังด้วย User Activation API ใหม่
  • การแปลรายการต่างๆ ง่ายขึ้นมากเมื่อใช้ Intl.format() API

และยังมีอีกมากมาย

และ Pete LePage จะเป็นผู้ดูแลคุณในวันนี้ เรามาเจาะลึกและดูว่า มีอะไรใหม่สำหรับนักพัฒนาซอฟต์แวร์ใน Chrome 72 กัน!

บันทึกการเปลี่ยนแปลง

ข้อมูลนี้เป็นเพียงไฮไลต์สำคัญบางส่วนเท่านั้น ดูการเปลี่ยนแปลงเพิ่มเติมใน Chrome 72 ได้ที่ลิงก์ด้านล่าง

ฟิลด์คลาสสาธารณะ

ภาษาแรกที่ใช้คือ Java และการเรียนรู้ JavaScript ทำให้ฉันสับสนไปบ้าง ฉันจะสร้างชั้นเรียนได้อย่างไร หรือการรับค่า แล้วพร็อพเพอร์ตี้และเมธอดแบบสาธารณะและแบบส่วนตัวล่ะ การอัปเดต JavaScript เมื่อเร็วๆ นี้หลายรายการที่ทำให้ การเขียนโปรแกรมเชิงออบเจ็กต์ง่ายขึ้นมาก

ตอนนี้ฉันสามารถสร้างคลาสที่ทำงานได้ตามที่คาดหวัง พร้อมตัวสร้าง Getter และ Setter, เมธอดแบบคงที่ และพร็อพเพอร์ตี้สาธารณะ

ด้วย V8 7.2 ซึ่งมาพร้อมกับ Chrome 72 ตอนนี้คุณสามารถประกาศฟิลด์คลาสสาธารณะได้โดยตรงในคำจำกัดความคลาส ทำให้ไม่จำเป็นต้องดำเนินการในตัวสร้าง

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 เกี่ยวกับช่องคลาส

API การเปิดใช้งานผู้ใช้

จำได้ไหมว่าเว็บไซต์เล่นเสียงโดยอัตโนมัติทันทีที่โหลดหน้าเว็บ คุณต้องสลับกันเพื่อกดปุ่มปิดเสียง หรือหาว่าแท็บไหนเป็นแท็บไหน แล้วปิดไป ด้วยเหตุนี้ API บางรายการจึงต้องมีการเปิดใช้งานผ่านท่าทางสัมผัสของผู้ใช้ก่อนจึงจะใช้งานได้ อย่างไรก็ตาม เบราว์เซอร์จัดการการเปิดใช้งานด้วยวิธีที่แตกต่างกัน

User Activation API ก่อนและหลังจากที่ผู้ใช้โต้ตอบกับหน้าเว็บ

Chrome 72 เปิดตัวการเปิดใช้งานผู้ใช้เวอร์ชัน 2 ซึ่งทำให้การเปิดใช้งานผู้ใช้สำหรับ API ทั้งหมดที่มีการกำหนดสิทธิ์นั้นง่ายขึ้น ซึ่งอิงตามข้อกําหนดใหม่ที่มีจุดมุ่งหมายเพื่อกำหนดมาตรฐานวิธีการทำงานของการเปิดใช้งานในทุกเบราว์เซอร์

มีพร็อพเพอร์ตี้ userActivation ใหม่ทั้งใน navigator และ MessageEvent ซึ่งมีพร็อพเพอร์ตี้ 2 รายการ ได้แก่ hasBeenActive และ isActive

  • hasBeenActive ระบุว่ากรอบเวลาที่เกี่ยวข้องเคยมีการเปิดใช้งานของผู้ใช้ในวงจรหรือไม่
  • isActive ระบุว่าขณะนี้กรอบเวลาที่เกี่ยวข้องมีการเปิดใช้งานผู้ใช้ในวงจรหรือไม่

ดูรายละเอียดเพิ่มเติมได้ในการทำให้การเปิดใช้งานของผู้ใช้สอดคล้องกันใน API ต่างๆ

การแปลรายการสิ่งต่างๆ ด้วย Intl.format

เราชอบ Intl API มาก เพราะมีประโยชน์มากสำหรับการแปลเนื้อหาเป็นภาษาอื่นๆ ใน Chrome 72 มีเมธอด .format() ใหม่ที่ช่วยให้การเรนเดอร์รายการง่ายขึ้น เช่นเดียวกับ Intl API อื่นๆ API นี้จะเปลี่ยนภาระไปให้เครื่องมือ JavaScript โดยไม่ลดประสิทธิภาพ

เริ่มต้นด้วยภาษาที่ต้องการ จากนั้นเรียกใช้ format แล้วระบบจะใช้คำและไวยากรณ์ที่ถูกต้อง สามารถใช้คำสันธาน ซึ่งเพิ่มค่าที่เทียบเท่ากับ and ที่แปลแล้ว (และดูเครื่องหมายจุลภาคแบบ Oxford ที่สวยๆ เหล่านั้น) การดำเนินการนี้สามารถดำเนินการแบบยกเว้นได้ ซึ่งก็คือการเพิ่มเงื่อนไขที่เทียบเท่า 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 เพื่อให้ตรงกับข้อกำหนด
  • ตอนนี้ Service Worker จะจัดการคำขอ Favicon ตราบใดที่ URL คำขอมีต้นทางเดียวกับ Service Worker

สมัครใช้บริการ

หากต้องการติดตามวิดีโอล่าสุดของเรา โปรดติดตามช่อง YouTube ของนักพัฒนาซอฟต์แวร์ Chrome แล้วคุณจะได้รับอีเมลแจ้งเตือนทุกครั้งที่เราเปิดตัววิดีโอใหม่

ผมชื่อ Pete LePage และทันทีที่ Chrome 73 เปิดตัว เราจะมาบอกคุณถึงสิ่งใหม่ๆ ใน Chrome