สรุปการเปลี่ยนแปลงบน jQuery 3 เป็นยังไง อะไรเปลี่ยนไปบ้าง

สรุปการเปลี่ยนแปลงบน jQuery 3 เป็นยังไง อะไรเปลี่ยนไปบ้าง

สดๆร้อนๆเลยสำหรับการปล่อยเวอร์ชันที่ 3 ที่เป็น Final Release สำหรับ jQuery 3 ครับ วันนี้ผมจะพามาดูกันว่า มีอะไรเปลี่ยนแปลงไปจากเวอร์ชัน 2 บ้าง เพื่อการเปลี่ยนผ่านที่ง่ายขึ้น ของชาว Developer อย่างเราๆ ไปดูกันเลยครับ

ความเข้ากันได้กับ jQueryUI และ jQuery Mobile

ทางทีมงาน jQuery บอกว่า ฟังค์ชันส่วนใหญ่เข้ากันได้ปกติ แต่ก็ยังมีบางฟังค์ชันที่ทำงานไม่ได้ โดยทางทีมงานได้แนะนำให้ใช้ตัว Migrate เพื่อแก้ปัญหาชั่วคราวไปก่อน โดยทางทีมงานจะทำการแก้ไขให้ในเร็วๆนี้

Jquery 3 Migrate : https://code.jquery.com/jquery-migrate-3.0.0.js

การรองรับ Browser ต่างๆ

jQuery 3 รองรับ Browser ดังนี้ครับ

  • Internet Explorer: 9+
  • Chrome, Edge, Firefox, Safari: Current and Current - 1
  • Opera: Current
  • Safari Mobile iOS: 7+
  • Android 4.0+

สังเกตว่า jQuery 3 ได้ยกเลิกการ Support Browser บนระบบปฏิบัติการเก่าๆอย่าง iOS 6 ลงไป และ Android 3 ลงไป หากท่านกำลังพัฒนา Web Application ที่ต้องทำงานกับ User กลุ่มที่ใช้งานระบบปฎิบัติการเก่าๆ ก็ไม่แนะนำให้อัพเกรดครับ

การเปลี่ยนแปลงที่สำคัญบน jQuery 3

เรามาดูการเปลี่ยนแปลงหลักๆที่เกี่ยวข้องในชีวิตประจำวันกันครับ ว่าเปลี่ยนอะไรกันบ้าง

การใช้ Ajax เพื่อร้องขอไฟล์ประเภท Script ข้าม Domain จะต้องมีการระบุเพื่ออนุญาติในการร้องขอไฟล์นั้น

โดยปกติแล้ว เราสามารถใช้งาน jQuery.ajax() หรือ jQuery.get() เพื่อร้องขอไฟล์แบบ Ajax นั้น ตัว jQuery จะ Auto Detect ได้อยู่แล้วว่าเป็นไฟล์ประเภทอะไร แต่ใน jQuery 3 นั้นถ้าคุณต้องการร้องขอไฟล์ประเภท Script ข้าม Domain ผ่าน Ajax คุณจะต้องระบุ dataType: "script" ลงในไปใน jQuery.ajax() ให้ชัดเจนเลยว่า ไฟล์ที่คุณต้องการ เปลี่ยนไฟล์ประเภท Script สิ่งๆนี้ ออกมาเพื่อป้องกันการโจมตีผ่าน Script ในกรณีที่เรียกใช้งาน Ajax call แล้วโดนเปลี่ยนเส้นทางโดยไม่ได้รับอนุญาติ (Man-in-the-middle) ไปยัง Script ที่ไม่พึงประสงค์ ทำให้ผู้ใช้งานโดนโจมตีได้

jQuery.get() และ jQuery.post() สามารถใช้ parameter setting เหมือน jQuery.ajax() ได้แล้ว

ปกติแล้ว jQuery.get() กับ jQuery.post() จะไม่สามารถใช้ parameter setting ได้เยอะเหมือน jQuery.ajax() แต่ใน jQuery 3 นั้นทำได้แล้วครับ โดยสามารถไปดู parameter setting ที่สามารถ set ได้ใน Documentation API ของ jQuery.ajax() ครับ

ยกเลิกฟังค์ชัน .toggleClass() ที่ไม่มี arguments และ .toggleClass(boolean)

ทางทีมงานให้เหตุผลว่า การใช้ฟังค์ชันนี้ในกรณี .toggleClass() และ .toggleClass(boolean) มีความเป็นไปได้สูงที่จะเกิดข้อผิดพลาด เช่น .toggleClass( undefined ) ทางทีมงานเลยยกเลิกฟังค์ชันดังกล่าวออก

เปลี่ยนชื่อฟังค์ชัน jQuery.unique() ไปเป็น jQuery.uniqueSort()

ทางทีมงานให้เหตุผลว่า ชื่อของ jQuery.uniqueSort() นั้นสื่อและให้ความหมายชัดเจนกว่า jQuery.unique() แต่การทำงานของฟังค์ชัน ยังเหมือนเดิมทุกประการ

ยกเลิกฟังค์ชัน jQuery.parseJSON()

ยกเลิก jQuery.parseJSON() แล้วให้ไปใช้งานฟังค์ชัน Native ของ Javascript แทน นั้นคือ JSON.parse()

อันนี้ผมแค่ยกตัวอย่างมาส่วนหนึ่งครับ ยังมีอีกเยอะเลยที่ไม่ได้เขียนถึง สามารถเข้าไปดูได้ที่ : http://jquery.com/upgrade-guide/3.0/

ผมเชื่อว่า Web Developer หลายท่านก็ยังใช้งาน jQuery เป็นหลักอยู่ ตอนนี้ได้เวลาศึกษา jQuery 3 เอาไว้บ้างแล้วนะครับ เพื่อเตรียมพร้อมการ Migrate จากเวอร์ชันก่อนๆ มายัง jQuery 3

สำหรับผม ตอนนี้แนะนำให้รอก่อนครับ เหมือน jQuery 3 จะเปลี่ยน API ไปเยอะพอสมควร ทำให้ Library หลายๆตัวต้องปรับตัวและเตรียมปรับเวอร์ชัน ต้องใช้เวลาสักพักครับ แต่ศึกษาเอาไว้ก่อน ก็เป็นเรื่องที่ดีครับ