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

Pete LePage

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

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

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

ฉันชื่อ Pete LePage เรามาเจาะลึกและดูว่า มีอะไรใหม่สำหรับนักพัฒนาซอฟต์แวร์ใน Chrome 72 กัน!

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

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

ช่องชั้นเรียนสาธารณะ

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

ตอนนี้ฉันสามารถสร้างคลาสที่ทำงานได้ตามที่ต้องการ โดยมีทั้งตัวสร้าง เครื่องมือและตัวตั้งค่า เมธอดแบบคงที่ และพร็อพเพอร์ตี้สาธารณะ

ด้วย 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 บางตัวจึงกำหนดให้ต้องมีการเปิดใช้งานผ่านท่าทางสัมผัสของผู้ใช้ก่อนจึงจะทำงานได้ อย่างไรก็ตาม เบราว์เซอร์จัดการการเปิดใช้งานด้วยวิธีที่แตกต่างกัน

API การเปิดใช้งานของผู้ใช้ก่อนและหลังจากที่ผู้ใช้โต้ตอบกับหน้าเว็บ

Chrome 72 เปิดตัว User Activation v2 ซึ่งช่วยให้การเปิดใช้งานผู้ใช้ง่ายขึ้นสำหรับ API ที่มีการรักษาความปลอดภัยทั้งหมด โดยอิงตามข้อกำหนดใหม่ที่มีเป้าหมายเพื่อสร้างมาตรฐานการทำงานของการเปิดใช้งานในเบราว์เซอร์ทั้งหมด

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

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

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

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

ฉันชอบ Intl API เพราะมีประโยชน์มากสำหรับการแปลเนื้อหาเป็นภาษาอื่น ใน Chrome 72 มีเมธอด .format() ใหม่ที่ทำให้รายการแสดงผลง่ายขึ้น เช่นเดียวกับ API อื่นๆ ของ Intl ฟีเจอร์นี้จะเพิ่มภาระงานให้กับเครื่องมือ 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 จะจัดการคำขอไอคอน Fav ตราบใดที่ URL คำขออยู่ในต้นทางเดียวกับ Service Worker

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

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

ผมชื่อ Pete LePage และทันทีที่ Chrome 73 เปิดตัว เราจะบอกว่า มีอะไรใหม่ใน Chrome!