ECMAScript 2017

  • หน้าก่อนหน้า JS 2016
  • หน้าต่อไป JS 2018

นามที่ใช้ใน JavaScript จะเริ่มต้นด้วย ES1, ES2, ES3, ES5 และ ES6。

แต่ ECMAScript 2016 และ 2017 ไม่ได้ถูกเรียกว่า ES7 และ ES8。

ตั้งแต่ปี 2016 ต้นมา คู่มือฉบับใหม่ได้มีชื่อตามปี (ECMAScript 2016/2017/2018)。

คุณสมบัติใหม่ใน ECMAScript 2017

บทบาทนี้นำเสนอคุณสมบัติใหม่ของ ECMAScript 2017:

  • JavaScript String Padding
  • JavaScript Object.entries
  • JavaScript Object.values
  • JavaScript Async Function
  • JavaScript Shared Memory

JavaScript String Padding

ECMAScript 2017 ได้เพิ่มเข้ามาเพียงสองวิธีการ String ใหม่:padStart และ padEndเพื่อสนับสนุนการกรองที่ต้นและปลายของ字符串。

ตัวอย่าง

let str = "5";
str = str.padStart(4,0);
// ผลลัพธ์คือ：0005

ทดลองด้วยตัวเอง

ตัวอย่าง

let str = "5";
let str = "5";
str = str.padEnd(4,0);

ทดลองด้วยตัวเอง

// ผลลัพธ์คือ: 5000

Internet Explorer ไม่สนับสนุนการบันทึกค่าของสตริง

Chrome IE Firefox Safari Opera
Firefox และ Safari คือกลุ่มแรกที่สนับสนุนการบันทึกค่าของสตริง JavaScript Edge 15 Firefox 48 Safari 10 Opera 44
มีนาคม 2017 เมษายน 2017 2016 ปี สิงหาคม 2016 ปี กันยายน มีนาคม 2017

ตัวเลขวัตถุ JavaScript

ECMAScript 2017 ได้เพิ่มความสามารถใหม่ในวัตถุ: Object.entries วิธี。

Object.entries() มีการกลับสร้างแนวแบบของตัวเลขที่มีค่าในวัตถุ:

ตัวอย่าง

const person = {
  firstName : "Bill",
  lastName : "Gates",
  age : 50,
  eyeColor : "blue"
};
document.getElementById("demo").innerHTML = Object.entries(person);

ทดลองด้วยตัวเอง

Object.entries() ทำให้ง่ายขึ้นในการใช้วัตถุในระหว่างการวนลูป:

ตัวอย่าง

const fruits = {Bananas:300, Oranges:200, Apples:500};
let text = "";
for (let [fruit, value] of Object.entries(fruits)) {
text += fruit + ": " + value + "
";
}

ทดลองด้วยตัวเอง

Object.entries() ทำให้ง่ายขึ้นในการเปลี่ยนวัตถุเป็นแมบประมาณธรรมชาติ:

ตัวอย่าง

const fruits = {Bananas:300, Oranges:200, Apples:500};
const myMap = new Map(Object.entries(fruits));

ทดลองด้วยตัวเอง

Chrome และ Firefox คือกลุ่มแรกที่สนับสนุน Object.entries แบบบันเทิงความเปรียบที่ใช้

Chrome IE Firefox Safari Opera
Chrome 47 Edge 14 Firefox 47 Safari 10.1 Opera 41
2016 ปี มิถุนายน 2016 ปี สิงหาคม 2016 ปี มิถุนายน มีนาคม 2017 ตุลาคม 2016

ค่าในวัตถุ JavaScript

Object.values เหมือน Object.entriesแต่ส่งกลับมาเป็นแนวแบบเรียงที่เดียวของตัวเลขในวัตถุ：

ตัวอย่าง

const person = {
  firstName : "Bill",
  lastName : "Gates",
  age : 50,
  eyeColor : "blue"
};
document.getElementById("demo").innerHTML = Object.values(person);

ทดลองด้วยตัวเอง

Firefox และ Chrome คือกลุ่มแรกที่สนับสนุน Object.values แบบบันเทิงความเปรียบที่ใช้

Chrome IE Firefox Safari Opera
Chrome 54 Edge 14 Firefox 47 Safari 10.1 Opera 41
ตุลาคม 2016 2016 ปี สิงหาคม 2016 ปี มิถุนายน มีนาคม 2017 ตุลาคม 2016

ฟังก์ชัน Async ของ JavaScript

ความล่าช้า

async function myDisplay() {
  let myPromise = new Promise(function(myResolve, myReject) {
    setTimeout(function() { myResolve("I love You !!"); }, 3000);
  });
  document.getElementById("demo").innerHTML = await myPromise;
}
myDisplay();

ทดลองด้วยตัวเอง

Firefox และ Chrome เป็นบราวเซอร์แรกที่สนับสนุนฟังก์ชัน JavaScript แบบเรียกแบบอัลทิมัติ (async)

Chrome IE Firefox Safari Opera
Chrome 55 Edge 15 Firefox 52 Safari 11 Opera 42
เดือนธันวาคม 2016 เมษายน 2017 มีนาคม 2017 กันยายน 2017 เดือนธันวาคม 2016
  • หน้าก่อนหน้า JS 2016
  • หน้าต่อไป JS 2018