ES8新特性

Object.values/Object.entries

　　Object.values和 Object.entries是在ES2017規格中，它和Object.keys相似，返回數組類型，其序號和Object.keys序號對應。相似python中的dict.iteritems()。

Object.values,Object.entries和Object.keys各自項返回是數組，相對應包括key,value或者可枚舉特定對象property/attribute

在ES8 /ES2017以前，Javascript開發者須要迭代一個對象的自身屬性時候不得不用Object.keys，經過迭代且使用obj[key]獲取value值返回一個數組，很挫的：

let obj = {a: 1, b: 2, c: 3}
Object.keys(obj).forEach((key, index)=>{
  console.log(key, obj[key])
})

而使用ES6/ES2015 中for/of稍微好點：

let obj = {a: 1, b: 2, c: 3}
for (let key of Object.keys(obj)) {
  console.log(key, obj[key])
}

Object.values返回對象自身能夠迭代屬性值（values）爲數組類型。咱們最好使用Array.prototype.forEach迭代它，結合ES6的箭頭函數隱形返回值：

let obj = {a: 1, b: 2, c: 3}
Object.values(obj).forEach(value=>console.log(value)) // 1, 2, 3

或者實用for/of:

let obj = {a: 1, b: 2, c: 3}
for (let value of Object.values(obj)) {
  console.log(value)
}
// 1, 2, 3

·Object.entries·，在另外一方面，將會返回對象自身可迭代屬性key-value對數組（做爲一個數組），他們（key-value）分別以數組存放數組中:

let obj = {a: 1, b: 2, c: 3}
JSON.stringify(Object.entries(obj))
"[["a",1],["b",2],["c",3]]"

可使用ES6/ES2015解構，從這嵌套數組中分別聲明key和value

let obj = {a: 1, b: 2, c: 3}
Object.entries(obj).forEach(([key, value]) => {
 console.log(`${key} is ${value}`)
})
// a is 1, b is 2, c is 3

一樣使用ES6for/of（畢竟所有都是數組）遍歷Object.entries返回來的結果值：

let obj = {a: 1, b: 2, c: 3}
for (let [key, value] of Object.entries(obj)) {
  console.log(`${key} is ${value}`)
}
// a is 1, b is 2, c is 3

如今從對象中提取values和key-value pairs 變得很是容易了。Object.values和Object.entries這種方式不想以前 Object.keys(自身屬性key+順序相同)結合for/of(ES6)一塊兒，咱們不只僅能夠提取他們還能夠迭代他們。

String padding(字符串填充)

String.prototype.padStart 和  String.prototype.padEnd在javascript字符操做是一個不錯的體驗，幫助避免依賴而外的庫。
padStart()在開始部位填充，返回一個給出長度的字符串，填充物給定字符串，把字符串填充到指望的長度。從字符串的左邊開始（至少大部分西方語言），一個經典例子是使用空格建立列：

console.log('react'.padStart(10).length)         // "       react" is 10
console.log('backbone'.padStart(10).length)         // "  backbone" is 10

它對於財務方面很是有用：

console.log('0.00'.padStart(20))            
console.log('10,000.00'.padStart(20))    
console.log('250,000.00'.padStart(20))

若是是爲會計作帳之類的，這個很實用，賬作的很整齊😄

         0.00
    10,000.00
   250,000.00

第二個參數，讓咱們放一些其餘的填充字符替代空字符串，一個字符串填充：

console.log('react'.padStart(10, '_'))         // "_____react"
console.log('backbone'.padStart(10, '*'))         // "**backbone"

padEnd顧名思義就是從字符串的尾端右邊開始填充。第二個參數，你能實際上用一個任何長度的字符串。例如：

console.log('react'.padEnd(10, ':-)'))         // "react:-):-" is 10
console.log('backbone'.padEnd(10, '*'))         // "backbone**" is 10

再賞幾個例子做爲總結：

// String.prototype.padStart(targetLength [, padString])
'hello'.padStart(10); // '     hello'
'hello'.padStart(10, '0'); // '00000hello'
'hello'.padStart(); // 'hello'
'hello'.padStart(6, '123'); // '1hello'
'hello'.padStart(3); // 'hello'
'hello'.padStart(3, '123'); // 'hello';

// String.prototype.padEnd(targetLength [, padString])
'hello'.padEnd(10); // 'hello     '
'hello'.padEnd(10, '0'); // 'hello00000'
'hello'.padEnd(); // 'hello'
'hello'.padEnd(6, '123'); // 'hello1'
'hello'.padEnd(3); // 'hello'
'hello'.padEnd(3, '123'); // 'hello';

Object.getOwnPropertyDescriptors

　　這新的  Object.getOwnPropertyDescriptors返回對象obj全部自身屬性描述。這是一個多參數版本的 Object.getOwnPropertyDescriptors(obj,propName)將會返回obj中propName屬性的一個單獨描述。
在咱們平常不可變編程（immutable programming）時代中，有了這個方法很方便（記住,Javascript中對象是引用傳遞）在ES5中，開發者要使用 Object.assign()來拷貝對象,  Object.assign()分配屬性只有copy和定義新的屬性。當咱們使用更加複雜對象和類原型，這可能會出問題。
Object.getOwnPropertyDescriptors容許建立真實的對象淺副本並建立子類,它經過給開發者描述符來作到這一點.在 Object.create(prototype, object)放入描述符後，返回一個真正的淺拷貝。

Object.create(
  Object.getPrototypeOf(obj),
  Object.getOwnPropertyDescriptors(obj)
)

或者能夠合併兩個對象target和source以下：

Object.defineProperties(
  target,
  Object.getOwnPropertyDescriptors(source)
)

以上是Object.getOwnPropertyDesciptors用法。可是什麼是描述符(descriptor)呢？就是一個對象的描述。

這裏有兩種描述符號類型：
1.數據描述符（Data descriptor）
2.存取器描述符（Accessor descriptor）
存取描述符有必須屬性：get 或者set或者get和set兩個就是如你所想的getter和setter函數，而後存取描述符還有可選屬性 configurable和 enumerable

let azatsBooks = {  
  books: ['React Quickly'],
  get latest () {
    let numberOfBooks = this.books.length
    if (numberOfBooks == 0) return undefined
    return this.books[numberOfBooks - 1]
  }
}

這個例子數據描述符books由Object.getOwnPropertyDescriptor(azatsBooks, 'books')產生結果以下：

Object
    configurable: true
    enumerable: true
    value: Array[1]
    writable: true
    __proto__: Object

一樣的，Object.getOwnPropertyDescriptor(azatsBooks, 'latest')將會展示latest的描述符，這個latest（get）存取器描述符展示以下：

Object
    configurable: truee
    numerable: true
    get: latest()
    set: undefined
    __proto__: Object

如今咱們調用新方法獲取全部的描述符：

console.log(Object.getOwnPropertyDescriptors(azatsBooks))

它會給出這個對象兩個描述符books和latest：

Object
  books: Object
    configurable: true
    enumerable: true
    value: Array[1]
    writable: true
    __proto__: Object
  latest: Object
    configurable: true
    enumerable: true
    get: latest()
    set: undefined
    __proto__: Object
  __proto__: Object

函數參數列表和調用中的尾逗號（Trailing commas）

尾逗號在函數定義中只是一個純粹語法變化，在ES5中，將會非法語法，在函數參數後面應該是沒有逗號的：

var f = function(a,
  b,
  c,
  d) { // NO COMMA!
  // ...
  console.log(d)
}
f(1,2,3,'this')

在ES8中，這種尾逗號是沒有問題的：

var f = function(a,
  b,
  c,
  d,
) { // COMMA? OK!
  // ...
  console.log(d)
}
f(1,2,3,'this')

.

var arr = [1,  // Length == 3
  2,
  3,
]  // <--- ok
let obj = {a: 1,  // Only 3 properties
  b: 2,
  c: 3,
}  // <--- ok

尾逗號主要有用在使用多行參數風格（典型的是那些很長的參數名），開發者終於能夠忘記逗號放在第一位這種奇怪的寫法。自從逗號bugs主要緣由就是使用他們。而如今你能夠處處使用逗號，甚至最後參數均可以。

異步函數（Async Functions）

　　異步函數（或者async/await）特性操做是 Promise最重要的功能。這種想法是爲了在寫異步代碼中簡化它，由於人類大腦最討厭這種平行非序號思惟了。它只是不會演變這種方式。原本覺得Promise的到來已是擺脫node異步的福音了，在ES8，異步函數是那麼給力。開發者定義一個 asyc函數裏面不包含或者包含await 基於Promise異步操做。在這引擎之下一個異步函數返回一個Promise，不管無何你在任何地方不會看到這樣的一個詞Promise。

例如，在ES6中咱們可使用Promise， Axios庫向GraphQL服務器發送一個請求：

axios.get(`/q?query=${query}`)
  .then(response => response.data)
  .then(data => {
    this.props.processfetchedData(data) // Defined somewhere else
  })
  .catch(error => console.log(error))

任何一個Promise庫都能兼容新的異步函數，咱們可使用同步try/catch作錯誤處理

async fetchData(url) => {
  try {
    const response = await axios.get(`/q?query=${query}`)
    const data = response.data
    this.props.processfetchedData(data)
  } catch (error) {
    console.log(error)
  }
}

異步函數返回一個Promise，因此咱們像下面能夠繼續執行流程:

async fetchData(query) => {
  try {
    const response = await axios.get(`/q?query=${query}`)
    const data = response.data
    return data
  } catch (error) {
    console.log(error)
  }
}
fetchData(query).then(data => {
  this.props.processfetchedData(data)
})

有了 async/await,咱們的代碼執行異步看起來像執行同步同樣。能夠從頭至尾讀起來很是簡單和易懂，由於出現結果順序和函數題中從頭至尾順序同樣啊！