มาตฐาน ES6 คืออะไร
มาตรฐาน ES6, หรือที่รู้จักกันในชื่อ ECMAScript 2015, เป็นเวอร์ชันที่สำคัญของมาตรฐานภาษาโปรแกรม JavaScript ซึ่งได้รับการออกแบบมาเพื่อปรับปรุงและเพิ่มความสามารถให้กับภาษา JavaScript ตัวอย่างของคุณสมบัติหลักๆ ใน ES6 ได้แก่
2018-11-29 09:55:03 - @ratanon
- let และ const: สำหรับการประกาศตัวแปรที่มีขอบเขตการใช้งานที่ชัดเจนกว่า var โดย let ใช้สำหรับตัวแปรที่มีค่าเปลี่ยนแปลงได้ และ const สำหรับตัวแปรที่ค่าคงที่
- Arrow Functions: ฟังก์ชันที่มีโครงสร้างและการเขียนที่กระชับกว่า พร้อมทั้งมีการจัดการคำสั่ง this ที่แตกต่างจากฟังก์ชันปกติ
- Template Literals: สำหรับการสร้างสตริงที่สามารถฝังตัวแปรหรือการทำงานของฟังก์ชันได้โดยตรงในสตริง
- Destructuring Assignment: ช่วยให้สามารถแยกค่าจากอาร์เรย์หรืออ็อบเจ็กต์ไปยังตัวแปรแยกต่างหากได้ง่ายขึ้น
- Default + Rest + Spread Parameters: คุณสมบัติเหล่านี้ช่วยให้การจัดการกับพารามิเตอร์ของฟังก์ชันทำได้ง่ายและมีประสิทธิภาพมากขึ้น
- Classes and Inheritance: การนำเสนอคลาสและการสืบทอดในรูปแบบที่เข้าใจง่ายขึ้น ทำให้การเขียนโปรแกรมแบบ object-oriented เป็นไปอย่างมีระเบียบมากขึ้น
- Modules: รองรับการนำเข้า (import) และส่งออก (export) โมดูล เพื่อการจัดการโค้ดที่มีประสิทธิภาพ
- Promises: เป็นเครื่องมือสำหรับการจัดการกับการดำเนินการที่อาจจะไม่เสร็จสิ้นทันที (asynchronous operations) เช่น การโหลดข้อมูลจากเซิร์ฟเวอร์
- Enhanced Object Literals: ช่วยให้การเขียนและจัดการอ็อบเจ็กต์ใน JavaScript ง่ายขึ้น โดยมีการเพิ่มความสามารถในการกำหนดคีย์และค่าในอ็อบเจ็กต์
- New Built-In Methods: JavaScript ES6 นำเสนอเมธอดใหม่ๆ ที่เพิ่มเข้ามาในอ็อบเจ็กต์มาตรฐานต่างๆ เช่น Array, String ฯลฯ เพื่อให้การดำเนินการกับข้อมูลเหล่านั้นสะดวกยิ่งขึ้น
- Symbols: ประเภทข้อมูลใหม่ใน JavaScript ที่ใช้เป็น key สำหรับอ็อบเจ็กต์โดยมีความเป็นส่วนตัวและไม่สามารถเข้าถึงได้ง่ายดายจากภายนอก
- Generator Functions: เป็นฟังก์ชันพิเศษที่สามารถหยุดการทำงานชั่วคราวและสามารถกลับมาทำงานต่อได้ที่จุดที่หยุด เหมาะสำหรับการจัดการกับสถานการณ์ที่ต้องการการดำเนินการที่ซับซ้อน
- Maps and Sets: โครงสร้างข้อมูลใหม่ที่เพิ่มเข้ามา เช่น Map สำหรับการเก็บข้อมูลแบบ key-value ที่ key สามารถเป็นประเภทข้อมูลใดก็ได้ และ Set สำหรับการเก็บค่าที่ไม่ซ้ำกัน
- Proxy and Reflection: ช่วยในการจัดการและการเปลี่ยนแปลงพฤติกรรมพื้นฐานของอ็อบเจ็กต์ JavaScript
ES6 ถือเป็นก้าวที่สำคัญในการพัฒนา JavaScript ทำให้ภาษานี้มีความสามารถในการเขียนโปรแกรมที่ซับซ้อนและมีโครงสร้างที่ดีขึ้นอย่างมาก
ES6 Features Example
// let and const let variableLet = "I can change"; const variableConst = "I cannot change"; // Arrow function const addNumbers = (a, b) => a + b; // Template literals let name = "World"; console.log(`Hello, ${name}!`); // Destructuring assignment const object = { a: 1, b: 2, c: 3 }; const { a, b } = object; // Default parameters function greet(name = "Anonymous") { return `Hello, ${name}!`; } // Rest parameters and spread operator function sum(...numbers) { return numbers.reduce((acc, current) => acc + current, 0); } let array = [1, 2, 3]; let arrayCopy = [...array]; // Class with inheritance class Animal { constructor(name) { this.name = name; } speak() { console.log(`${this.name} makes a noise.`); } } class Dog extends Animal { speak() { console.log(`${this.name} barks.`); } } // Promises const promise = new Promise((resolve, reject) => { setTimeout(() => resolve("Promise resolved!"), 1000); }); promise.then((result) => console.log(result)); // Map and Set let map = new Map(); map.set('key1', 'value1'); let set = new Set(); set.add('value1'); // Using all together let myDog = new Dog("Rex"); myDog.speak(); console.log(greet(variableLet)); console.log(addNumbers(a, b)); console.log(sum(...array)); console.log(arrayCopy); console.log(map.get('key1')); console.log(set.has('value1'));
โค้ดนี้รวมฟีเจอร์หลักๆ ของ ES6 เช่น let และ const, arrow functions, template literals, destructuring, default parameters, rest parameters, spread operator, classes และ inheritance, promises, และการใช้งาน Map และ Set. นอกจากนี้ยังมีการนำเอาฟีเจอร์เหล่านี้มาใช้ร่วมกันในส่วนต่างๆ ของโค้ดเพื่อแสดงให้เห็นถึงวิธีการทำงานร่วมกัน